123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673 |
- <style scoped lang="scss">
- /deep/.display-none-selset {
- display: none !important;
- }
- .step-jump {
- /deep/ table tr td {
- border-bottom: 0px;
- }
- }
- .bottom-to-one {
- /deep/ .ant-form-item {
- margin-bottom: 0;
- }
- }
- .target-person-add-button {
- margin-left: 15px;
- }
- .card-person {
- width: 300px;
- /deep/.ant-card-body {
- padding: 0px;
- }
- /deep/.ant-card-head {
- padding: 0px 10px;
- }
- .card-main-case {
- height: 250px;
- overflow: auto;
- padding: 0 5px;
- }
- }
- .card-person-drawer {
- width: 100%;
- height: 90%;
- overflow: hidden;
- padding: 10px 0px;
- display: flex;
- flex-wrap: wrap;
- margin-right: -10px;
- justify-content: space-between;
- .card-item {
- width: calc(33% - 10px);
- margin-bottom: 10px;
- float: left;
- }
- .card-item-else {
- width: calc(20% - 10px);
- margin-bottom: 10px;
- float: left;
- }
- }
- .showShare {
- position: relative;
- }
- .share {
- display: none;
- }
- .showShare:hover .share {
- display: flex;
- justify-content: center;
- align-items: center;
- }
- .chouzhen {
- border-style: solid;
- border-width: 1px;
- border-color: #e4e4e4;
- width: calc(20% - 10px);
- padding: 10px;
- margin-right: 10px;
- margin-bottom: 10px;
- display: flex;
- align-items: center;
- background: #fff;
- position: relative;
- z-index: 99;
- float: left;
- }
- li.chouzhen.first:before {
- font-size: 12px;
- content: '首帧';
- position: absolute;
- top: 7px;
- left: 5px;
- width: 36px;
- height: 20px;
- color: rgb(255, 255, 255);
- line-height: 20px;
- text-align: center;
- background: rgba(0, 0, 0, 0.5);
- border-radius: 2px;
- z-index: 1000;
- }
- .display-none-selset {
- display: none !important;
- }
- .logo {
- padding-left: 24px;
- img {
- height: 32px !important;
- }
- .name {
- font-size: 14px;
- font-family: PingFangSC-Medium, PingFang SC;
- font-weight: 500;
- color: #ced2d9;
- // line-height: 22px;
- margin-left: 20px;
- padding-left: 21px;
- position: relative;
- }
- .name::before {
- content: '';
- width: 1px;
- height: 18px;
- background: rgba(255, 255, 255, 0.31);
- position: absolute;
- left: 0;
- top: 50%;
- margin-top: -9px;
- }
- }
- .chartBox {
- .chartBody {
- display: flex;
- justify-content: space-around;
- flex-wrap: wrap;
- }
- .search-box {
- margin-bottom: 20px;
- }
- }
- /deep/ .ant-descriptions-item-content {
- font-weight: bold;
- }
- .info-detail {
- /deep/ table tr td {
- border: 0;
- }
- /deep/ .ant-descriptions-item-label {
- color: darkgray;
- // min-width: 30px;
- white-space: nowrap;
- }
- }
- .flex-main {
- display: flex;
- margin-bottom: 10px;
- p {
- color: black;
- font-weight: 600;
- overflow: hidden; //超出的文本隐藏
- text-overflow: ellipsis; //溢出用省略号显示
- white-space: nowrap; //溢出不换行
- }
- }
- </style>
- <style lang="scss">
- .hide-checkbox .ant-table-thead .ant-table-selection {
- display: none;
- }
- .new-batch .ant-card-head-title {
- font-weight: 700;
- }
- // .new-batch textarea {
- // resize: none;
- // border: none;
- // outline: 0;
- // box-shadow: none;
- // }
- .create-info .ant-form-item {
- margin-bottom: 0 !important;
- }
- .fengmian .ant-checkbox-wrapper:first-child {
- margin-left: 8px;
- }
- @media screen and (max-width: 1200px) {
- // 这里写对应要修改的样式如:
- .new-batch .el-step__title {
- font-size: 12px;
- }
- }
- .line-height-one .ant-form-item-control {
- line-height: inherit;
- }
- .creat-all-info .ant-form-item-control {
- width: 60%;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- }
- .config-new-batch {
- .display-none-selset {
- display: none !important;
- }
- .ant-btn-danger {
- background-color: #ff4d4f !important;
- }
- }
- </style>
- <template>
- <div ref="questionnaireBox" class="new-batch config-new-batch">
- <div class="chartBox">
- <a-row :gutter="20">
- <a-col :sm="24" style="margin-bottom: 20px; z-index: 10" id="container">
- <a-card class="search-box step-jump">
- <a-form layout="horizontal" v-bind="formItemLayout" :form="formOptimize">
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="模板名称">
- <a-input
- :disabled="$route.query.preview == 'true'"
- v-decorator="[
- 'templateName',
- {
- rules: [
- { required: true, message: ' ' },
- { validator: templateNameValid }
- ]
- }
- ]"
- >
- </a-input>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="清理时间范围">
- <a-select
- :disabled="$route.query.preview == 'true'"
- v-decorator="[
- 'cleanTime',
- {
- rules: [{ required: true, message: '清理时间范围必选' }],
- initialValue: '1'
- }
- ]"
- >
- <a-select-option value="1">最近一天</a-select-option>
- <a-select-option value="3">最近三天</a-select-option>
- <a-select-option value="7">最近七天</a-select-option>
- <a-select-option value="15">最近十五天</a-select-option>
- </a-select>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="优化目标">
- <a-select
- :disabled="$route.query.preview == 'true'"
- showSearch
- allowClear
- mode="multiple"
- v-decorator="[
- 'optimizationObjective',
- {
- rules: [{ required: true, message: '优化目标必选' }],
- initialValue: ['activation']
- }
- ]"
- >
- <!-- <a-select-option value="bclick">行为数</a-select-option> -->
- <a-select-option value="activation">激活</a-select-option>
- <a-select-option value="formSize">表单提交</a-select-option>
- <a-select-option value="pay">付费</a-select-option>
- <!-- <a-select-option value="roi">首日ROI</a-select-option> -->
- <a-select-option value="evocativeApplication">唤起应用</a-select-option>
- <!-- <a-select-option value="effectiveClues">使用有效线索</a-select-option> -->
- <!-- <a-select-option value="creditApp">授信App</a-select-option> -->
- <!-- <a-select-option value="creditGrant">授信落地页</a-select-option> -->
- <!-- <a-select-option value="ordersSubmitted">订单提交</a-select-option> -->
- <!-- <a-select-option value="finishedPieceApp">App完件数</a-select-option> -->
- <!-- <a-select-option value="finishedPieceGrant">落地页完件数</a-select-option> -->
- <!-- <a-select-option value="registered">注册优化目标</a-select-option> -->
- </a-select>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="累计消耗">
- <span style="width: 15%;display: inline-block;">小于等于</span>
- <a-input-number
- :disabled="$route.query.preview == 'true'"
- v-decorator="[
- 'charge',
- {
- rules: [
- {
- required: true,
- message: '累计消耗必填'
- }
- ],
- initialValue: 100
- }
- ]"
- :min="0"
- :precision="0"
- style="width: 60%"
- />
- 元
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="累计转化数">
- <span style="width: 15%;display: inline-block;">小于等于</span>
- <a-input-number
- :disabled="$route.query.preview == 'true'"
- v-decorator="[
- 'conversion',
- {
- rules: [
- {
- required: true,
- message: '累计转化数必填'
- }
- ],
- initialValue: 2
- }
- ]"
- :min="0"
- :precision="0"
- style="width: 60%"
- />
- 个
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="推广组状态">
- <a-select
- :disabled="$route.query.preview == 'true'"
- v-decorator="[
- 'promotionGroupStatus',
- {
- rules: [{ required: true, message: '推广组状态必选' }],
- initialValue: '1'
- }
- ]"
- @change="checkStatus"
- >
- <a-select-option value="1">投放中</a-select-option>
- <a-select-option value="2">暂停</a-select-option>
- <a-select-option value="3">不限</a-select-option>
- </a-select>
- </a-form-item>
- </a-col>
- </a-row>
- <!-- { rules: [{ validator: deepBidValid }] } -->
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="执行操作类型">
- <a-radio-group
- :disabled="$route.query.preview == 'true'"
- button-style="solid"
- v-decorator="[
- 'performOperations',
- {
- rules: [{ required: true, message: '执行操作类型必选' }],
- initialValue: '3'
- }
- ]"
- >
- <a-radio-button value="3">删除</a-radio-button>
- <a-radio-button
- value="2"
- :disabled="getFormData('formOptimize', 'promotionGroupStatus') != '1'"
- >暂停</a-radio-button
- >
- </a-radio-group>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="执行操作时间">
- 每天上午10点以后执行
- </a-form-item>
- </a-col>
- </a-row>
- </a-form>
- </a-card>
- <div
- style="display: flex; justify-content: flex-end; margin-bottom: 100px"
- v-if="$route.query.preview != 'true'"
- >
- <div>
- <a-button
- type="primary"
- style="margin-right: 15px"
- @click="handleSubmit"
- :loading="sumbitLoading"
- :disabled="disabled"
- >
- 创建
- </a-button>
- <a-button @click="clearAllData"> 取消 </a-button>
- </div>
- </div>
- </a-col>
- </a-row>
- </div>
- </div>
- </template>
- <script>
- // import UserMenu from '../tools/UserMenu'
- // import SMenu from '../menu/'
- import Logo from '@/components/tools/Logo.vue'
- import pick from 'lodash.pick'
- import { mixin } from '@/utils/mixin.js'
- import Treeselect from '@/views/modules/Statistics/components/Treeselect.vue'
- import moment from 'moment'
- import selectCheckAll from '@/components/formComponents/toutiaoTime'
- import checkBoxGroup from '@/components/formComponents/checkBoxGroup'
- import uploadFile from '@/components/uploadFileMd5Push.vue'
- import { stopOtherVideo, closeAllVideoFun } from '@/utils/videoControl' // 停止除当前外的其他视频播放,及停止所有视频播放的方法
- import selectTable from '@/views/modules/Statistics/components/selectPagination.vue'
- import { mapGetters } from 'vuex'
- // import lookPreviewVue from './lookPreview.vue'
- function tqFun(qcArr1) {
- var tempArr = []
- function bbFun(qcArr) {
- for (var i = 0; i < qcArr.length; i++) {
- if (qcArr[i] instanceof Array) {
- bbFun(qcArr[i])
- } else {
- tempArr.push(qcArr[i])
- }
- }
- return tempArr
- }
- return bbFun(qcArr1)
- }
- export default {
- name: 'GlobalHeader',
- components: {
- // UserMenu,
- // SMenu,
- Logo,
- Treeselect,
- selectCheckAll,
- checkBoxGroup,
- uploadFile,
- selectTable
- },
- data() {
- return {
- formOptimize: this.$form.createForm(this), //优化目标表单
- sumbitLoading: false,
- formItemLayout: {
- labelCol: { span: 4 },
- wrapperCol: { span: 16 }
- },
- formDrawerItemLayout: {
- labelCol: { span: 5 },
- wrapperCol: { span: 19 }
- },
- tailFormItemLayout: {
- wrapperCol: {
- sm: {
- span: 20,
- offset: 4
- }
- }
- },
- tailFormItemLayoutElse: {
- wrapperCol: {
- sm: {
- span: 20,
- offset: 1
- }
- }
- },
- tailFormDrawerItemLayout: {
- wrapperCol: {
- sm: {
- span: 19,
- offset: 5
- }
- }
- },
- disabled: false
- }
- },
- computed: {},
- watch: {},
- mounted() {
- this.$nextTick(function() {
- if (this.$route.query.id) {
- this.getAction('/accountClean/previewTemplate', { templateId: this.$route.query.id }).then(res => {
- if (res.success) {
- let data = res.result
- data.optimizationObjective = data.optimizationObjective.split(',')
- this.formOptimize.setFieldsValue(
- pick(
- data,
- 'templateName',
- 'cleanTime',
- 'optimizationObjective',
- 'charge',
- 'conversion',
- 'promotionGroupStatus',
- 'performOperations'
- )
- )
- }
- })
- } else {
- this.formOptimize.setFieldsValue({
- promotionGroupStatus: '1'
- })
- }
- })
- },
- filters: {},
- methods: {
- moment,
- templateNameValid(rule, value, callback) {
- if (value === '' || value === undefined || value === 0 || value === '0') {
- callback('模板名称必须填写')
- } else {
- let params = {}
- params.templateName = value
- if (this.$route.query.id) {
- params.id = this.$route.query.id
- callback()
- } else {
- this.getAction('/accountClean/getTemplateNameSize', params).then(res => {
- if (res.success) {
- if (res.result > 0) {
- callback('模板名称重复')
- } else {
- callback()
- }
- }
- })
- }
- }
- },
- ...mapGetters(['userInfo']),
- getFormData(form, className) {
- return this[form].getFieldValue(className)
- },
- handleSubmit() {
- // /accountClean/createTemplate
- this.formOptimize.validateFields((err, values) => {
- if (!err) {
- this.sumbitLoading = true
- let params = { ...values }
- params.optimizationObjective = params.optimizationObjective.join()
- params.createId = this.userInfo().id
- params.createUser = this.userInfo().username
- console.log(this.userInfo())
- if (this.$route.query.id) {
- params.id = this.$route.query.id
- this.postDataAction('/accountClean/updateTemplate', params).then(res => {
- this.sumbitLoading = false
- if (res.success) {
- this.$router.replace('/earlyWarningRules/accountClear')
- this.$bus.$emit('remove', `/earlyWarningRules/createClear?id=${this.$route.query.id}`)
- } else {
- this.$message.error(res.message)
- }
- })
- } else {
- this.postDataAction('/accountClean/createTemplate', params).then(res => {
- this.sumbitLoading = false
- if (res.success) {
- this.$router.replace('/earlyWarningRules/accountClear')
- this.$bus.$emit('remove', '/earlyWarningRules/createClear')
- } else {
- this.$message.error(res.message)
- }
- })
- }
- } else {
- }
- })
- },
- checkStatus(e) {
- // if (e != '1') {
- this.formOptimize.setFieldsValue({
- performOperations: '3'
- })
- // }else{
- // this.formOptimize.setFieldsValue({
- // performOperations: undefined
- // })
- // }
- },
- clearAllData() {
- if (this.$route.query.id) {
- this.$router.replace('/earlyWarningRules/accountClear')
- this.$bus.$emit('remove', `/earlyWarningRules/createClear?id=${this.$route.query.id}`)
- } else {
- this.$router.replace('/earlyWarningRules/accountClear')
- this.$bus.$emit('remove', '/earlyWarningRules/createClear')
- }
- }
- }
- }
- </script>
- <style lang="scss" scoped>
- /* update_begin author:scott date:20190220 for: 缩小首页布局顶部的高度*/
- $height: 59px;
- .layout .header .user-wrapper .action .anticon,
- .layout .top-nav-header-index .user-wrapper .action .anticon {
- color: #999;
- }
- .layout .header .user-wrapper .action .anticon,
- .layout .top-nav-header-index .user-wrapper .action .anticon {
- color: #999;
- }
- .layout {
- .top-nav-header-index {
- .header-index-wide {
- margin-left: 10px;
- .ant-menu.ant-menu-horizontal {
- height: $height;
- line-height: $height;
- }
- }
- .trigger {
- line-height: 48px;
- font-size: 17px;
- &:hover {
- background: rgba(0, 0, 0, 0.05);
- }
- }
- }
- .header {
- z-index: 2;
- color: #999;
- height: $height;
- background-color: #1890ff;
- transition: background 300ms;
- /* dark 样式 */
- &.dark {
- color: #000000;
- box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
- background-color: white !important;
- }
- }
- .header,
- .top-nav-header-index {
- &.dark .trigger:hover {
- background: rgba(0, 0, 0, 0.05);
- }
- }
- }
- .ant-layout-header {
- height: $height;
- line-height: $height;
- }
- </style>
|