123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262 |
- <style>
- #table_time_selected1 tr {
- border: 1px solid rgb(102, 162, 243);
- }
- .plug-timer-grid th {
- line-height: 25px;
- }
- .group-creat .ant-form-item-required::before {
- display: inline-block;
- margin-right: 4px;
- color: #f5222d;
- font-size: 14px;
- font-family: SimSun, sans-serif;
- line-height: 1;
- content: '';
- }
- .else-label .ant-form-item-label label::after {
- content: '';
- position: relative;
- top: -0.5px;
- margin: 0 8px 0 2px;
- }
- .ant-form-item-required::before {
- display: inline-block;
- margin-right: 4px;
- color: #f5222d;
- font-size: 14px;
- font-family: SimSun, sans-serif;
- line-height: 1;
- content: '*';
- }
- </style>
- <style lang="scss" scoped>
- .require-check {
- /deep/ .ant-form-item-label {
- label::before {
- display: inline-block;
- margin-right: 4px;
- color: #f5222d;
- font-size: 14px;
- font-family: SimSun, sans-serif;
- line-height: 1;
- content: '*';
- }
- }
- }
- </style>
- <template>
- <a-modal v-model="visible" :title="type === 'add' ? '编辑素材指定定向包' : '编辑素材指定定向包'" :width="1100" v-if="visible">
- <a-spin :spinning="spinning">
- <a-form @submit="handleSubmit" :form="form">
- <targeted-population ref="population" :populationData.sync="populationData" />
- </a-form>
- </a-spin>
- <template slot="footer">
- <!-- <a-button type="primary" @click="handleSubmit" :loading="loading"> 确定 </a-button> -->
- <a-button
- type="default"
- @click="
- () => {
- this.visible = false
- }
- "
- >
- 取消
- </a-button>
- <a-button type="primary" @click="handleSubmit" :loading="loading">
- {{ type == 'add' ? '确定' : '修改' }}
- </a-button>
- </template>
- </a-modal>
- </template>
- <script>
- import { getAction, postAction, deleteAction, putAction } from '@/api/manage'
- import moment from 'moment'
- import { mapGetters } from 'vuex'
- import jq from 'jquery'
- import selectTable from '@/views/modules/Statistics/components/selectPagination.vue'
- import targetedPopulation from './targetedPopulation.vue'
- import pick from 'lodash.pick'
- export default {
- name: 'new-mould',
- components: {
- targetedPopulation,
- selectTable,
- },
- data() {
- return {
- visible: false,
- spinning: false,
- projectName: '',
- form: this.$form.createForm(this),
- projectId: '',
- populationData: {},
- accountId: '',
- templateId: undefined,
- type: 'add',
- loading: false,
- labelCol: { lg: { span: 7 }, sm: { span: 7 } },
- disabled: false,
- id:null
- }
- },
- computed: {},
- methods: {
- create(accountId, type) {
- this.disabled = false
- this.spinning = false
- this.visible = true
- this.type = type
- this.populationData = {}
- this.accountId = accountId
- },
- handleOk(item, type) {
- this.spinning = true
- this.visible = true
- this.type = type
- // var params = {}
- // params.id = item.id
- // this.templateId = item.id
- // this.projectName = item.projectName
- // this.projectId = item.projectId
- // getAction('/kuaishouDirectionalPackage/queryById', params).then((res) => {
- // if (res.success) {
- this.id = item.id;
- var dataJson = {
- ...item,
- }
- this.populationData = dataJson
- this.populationData.devicePrice = dataJson.devicePrice ? JSON.parse(dataJson.devicePrice) : null
- this.populationData.appInterest = dataJson.appInterest ? JSON.parse(dataJson.appInterest) : null
- this.populationData.businessInterest = dataJson.businessInterest
- ? JSON.parse(dataJson.businessInterest)
- : null
- this.populationData.fansStar = dataJson.fansStar ? JSON.parse(dataJson.fansStar) : null
- this.populationData.interestVideo = dataJson.interestVideo ? JSON.parse(dataJson.interestVideo) : null
- this.populationData.deviceBrand = dataJson.deviceBrand ? JSON.parse(dataJson.deviceBrand) : null
- this.populationData.age = dataJson.min ? [dataJson.min, dataJson.max] : []
- this.populationData.agesRange = dataJson.agesRange ? JSON.parse(dataJson.agesRange) : []
- this.populationData.devicePrice = dataJson.devicePrice ? dataJson.devicePrice : null
- this.populationData.behavior = dataJson.label
- this.populationData.interest = dataJson.interestLabel
- this.populationData.sceneType = dataJson.sceneType ? JSON.parse(dataJson.sceneType) : []
- this.populationData.allForm = {}
- this.populationData.allForm.regionType =
- dataJson.region && JSON.parse(dataJson.region).length > 0 ? 'limit' : 'noLimit'
- this.populationData.allForm.region = dataJson.region
- // postAction('/kuaishou/batch/getRegionDetail', {
- // regionArr: dataJson.region
- // }).then(res => {
- // console.log(res, 11111)
- // if (res.success) {
- // this.populationData.allForm.region = res.result
- // }
- // })
- this.populationData.allForm.ageType =
- dataJson.agesRange.length > 0 ? 'ageLimit' : dataJson.min>0 ? 'ageCustom' : 'noLimit'
- this.populationData.allForm.device = dataJson.deviceBrand && eval(dataJson.deviceBrand).length > 0 ? '1' : '0'
- this.populationData.allForm.price = dataJson.devicePrice && eval(dataJson.devicePrice).length > 0 ? '1' : '0'
- this.populationData.allForm.appType =
- dataJson.appInterest && eval(dataJson.appInterest).length > 0
- ? '1'
- : dataJson.appIds && eval(dataJson.appIds).length > 0
- ? '2'
- : '0'
- this.populationData.allForm.fansStar =
- dataJson.fansStar && eval(dataJson.fansStar).length > 0 ? '1' : '0'
- this.populationData.allForm.interestVideo =
- dataJson.interestVideo && eval(dataJson.interestVideo).length > 0 ? '1' : '0'
- this.populationData.allForm.platform_os = dataJson.platformOs
- this.populationData.allForm.businessInterestType = dataJson.businessInterestType
- this.populationData.allForm.isOpen = dataJson.isOpen
- this.populationData.allForm.noAgeBreak = dataJson.noAgeBreak + ''
- this.populationData.allForm.noGenderBreak = dataJson.noGenderBreak + ''
- this.populationData.allForm.noAreaBreak = dataJson.noAreaBreak + ''
- this.populationData.allForm.behaviorInterest = dataJson.label=='[]' ? '1' : '0'
- this.populationData.allForm.checkArr =
- this.populationData.allForm.appType == '2' ? JSON.parse(dataJson.appIds) : []
- this.populationData.projectId = dataJson.projectId + ''
- this.disabled = true
- this.$nextTick(() => {
- this.spinning = false
- })
- },
- handleCancel(e) {
- this.visible = false
- },
- handleSubmit(e) {
- // this.$refs.population.handleSubmit()
- var data = JSON.parse(localStorage.getItem('materialDetail'))
- e.preventDefault()
- this.$refs.population.handleSubmit()
- this.$refs.population.formAll.validateFields((err, value) => {
- if (!err) {
- this.form.validateFieldsAndScroll((err, values) => {
- if (!err) {
- this.loading = true
- // this.loading = true
- var params = {
- ...this.populationData,
- videoGetId: data.id,
- signature: data.md5,
- id:this.id
- }
- params.label = params.behavior?JSON.stringify(params.behavior):'[]'
- params.interestLabel = params.interest?JSON.stringify(params.interest):'[]'
- console.log(this.populationData)
- if (this.populationData.allForm.regionType == 'limit') {
- if(this.populationData.allForm.region.length === 0) {
- this.$message.error('请选择地域');
- this.loading = false
- return
- }
- }
- if (this.type == 'add') {
- postAction('/kuaishouVideoDirectionalPackage/saveOrUpdate', params).then((res) => {
- if (res.success) {
- this.visible = false
- this.loading = false
- this.$emit('getData')
- } else {
- this.loading = false
- this.$message.error(res.message)
- }
- })
- } else if (this.type == 'edit') {
- postAction('/kuaishouVideoDirectionalPackage/saveOrUpdate', params).then((res) => {
- this.visible = false
- if (res.success) {
- this.loading = false
- this.$emit('getData')
- } else {
- this.loading = false
- this.$message.error(res.message)
- }
- })
- }
- }
- })
- }
- })
- },
- },
- }
- </script>
|