zhuxinbo пре 5 година
родитељ
комит
914d2f1e48

+ 76 - 22
src/views/modules/kuaishouapp/account/accountIndex.vue

@@ -32,7 +32,22 @@
       <a-card>
         <a-button @click="dianji" style="margin-bottom:15px;">新增广告计划</a-button>
         <div v-show="selectedRowKeys.length > 0">
-          请输入修改金额:<a-input-number :min="0" :step="0.01" v-model="allMoney" style="width:150px" @fouse.stop />
+          请输入修改金额:
+          <a-select style="width: 120px" v-model="allPrice">
+            <a-select-option value="1">比例</a-select-option>
+            <a-select-option value="2">出价</a-select-option>
+          </a-select>
+          <a-input-number
+            :min="-1"
+            :step="0.1"
+            v-model="allMoneyProportion"
+            style="width:150px"
+            @fouse.stop
+            v-if="allPrice == '1'"
+          />
+          <a-input-number :min="0" :step="0.01" v-model="allMoney" style="width:150px" @fouse.stop v-else />
+
+          <!-- <a-input-number :min="0" :step="0.01" v-model="allMoney" style="width:150px" @fouse.stop /> -->
           <a-button @click="editMoney" style="margin:0 15px 15px 15px" type="primary">修改</a-button>
 
           批量操作:
@@ -171,6 +186,15 @@ var columns = [
     title: '渠道',
     align: 'center',
     dataIndex: 'createChannel',
+    filters: [
+      { text: '投放后台创建', value: '0' },
+      { text: '汇创助手创建', value: '1' }
+    ],
+    onFilter: (value, record) =>
+      record.createChannel
+        .toString()
+        .toLowerCase()
+        .includes(value.toLowerCase()),
     scopedSlots: { customRender: 'createChannel' }
   },
   {
@@ -215,6 +239,8 @@ export default {
       selectedRowKeys: [],
       selectedRowKeysValue: [],
       allMoney: null,
+      allPrice: '1',
+      allMoneyProportion: 1.2,
       visible: false,
       visibleData: null,
       rowClick: (record, index) => ({
@@ -295,9 +321,7 @@ export default {
       params.putStatus = item.showSwich ? 1 : 2
       params.userId = this.userInfo().id
       params.campaignIds = [item.campaignId]
-      postAction('/kuaishou/batch/batchUpdateStatus', params).then(res => {
-        console.log(res)
-      })
+      postAction('/kuaishou/batch/batchUpdateStatus', params).then(res => {})
     },
     ...mapGetters(['nickname', 'avatar', 'userInfo']),
     addUser() {
@@ -329,30 +353,60 @@ export default {
       params.campaignIds = this.selectedRowKeysValue
       postAction('/kuaishou/batch/batchUpdateStatus', params).then(res => {
         console.log(res)
-        this.addUser()
-        this.selectedRowKeysValue = []
-        this.selectedRowKeys = []
-      })
-    },
-    editMoney() {
-      var params = {}
-      params.accountId = this.appId + ''
-      params.dayBudget = this.allMoney * 1000
-      params.userId = this.userInfo().id
-      params.campaignIds = this.selectedRowKeysValue
-      postAction('/kuaishou/batch/batchUpdateDayBudget', params).then(res => {
-        console.log(res)
-        if (res.result.failCount > 0) {
-          this.visible = true
-          this.visibleData = res.result
-          this.addUser()
-        } else {
+        if (res.success) {
           this.addUser()
           this.selectedRowKeysValue = []
           this.selectedRowKeys = []
         }
       })
     },
+    editMoney() {
+      if (this.allPrice == '1') {
+        var params = {}
+        params.accountId = this.appId + ''
+        params.proportion = this.allMoneyProportion
+        params.userId = this.userInfo().id
+        params.campaignIds = this.selectedRowKeysValue
+        postAction('/kuaishou/batch/batchUpdateDayBudgetByProportion', params).then(res => {
+          console.log(res)
+          if (res.success) {
+            if (res.result.failCount > 0) {
+              this.visible = true
+              this.visibleData = res.result
+              this.addUser()
+            } else {
+              this.addUser()
+              this.selectedRowKeysValue = []
+              this.selectedRowKeys = []
+            }
+          } else {
+            this.$message.error(res.message)
+          }
+        })
+      } else if (this.allPrice == '2') {
+        var params = {}
+        params.accountId = this.appId + ''
+        params.dayBudget = this.allMoney * 1000
+        params.userId = this.userInfo().id
+        params.campaignIds = this.selectedRowKeysValue
+        postAction('/kuaishou/batch/batchUpdateDayBudget', params).then(res => {
+          console.log(res)
+          if (res.success) {
+            if (res.result.failCount > 0) {
+              this.visible = true
+              this.visibleData = res.result
+              this.addUser()
+            } else {
+              this.addUser()
+              this.selectedRowKeysValue = []
+              this.selectedRowKeys = []
+            }
+          } else {
+            this.$message.error(res.message)
+          }
+        })
+      }
+    },
     getCampaignList(params) {
       getAction('/kuaishou/batch/getCampaignList', params).then(res => {
         if (res.code == 0) {

+ 188 - 63
src/views/modules/kuaishouapp/account/advertisingGroup.vue

@@ -22,16 +22,23 @@
             <a-button @click="showEdit = true" style="margin:0 0 15px 15px;">列表项筛选</a-button>
 
             <div v-show="selectedRowKeys.length > 0">
-              批量修改预算:<a-input-number :min="0" :step="0.01" v-model="allMoney" style="width:150px" @fouse.stop />
+              批量修改预算:<a-input-number :min="-1" :step="0.1" v-model="allMoney" style="width:150px" @fouse.stop />
               <a-button @click="editMoney" style="margin:0 15px 15px 15px" type="primary">修改</a-button>
 
-              批量修改出价:<a-input-number
-                :min="0"
-                :step="0.01"
-                v-model="allMoneyBid"
+              批量修改出价:
+              <a-select style="width: 120px" v-model="allPrice">
+                <a-select-option value="1">比例</a-select-option>
+                <a-select-option value="2">出价</a-select-option>
+              </a-select>
+              <a-input-number
+                :min="-1"
+                :step="0.1"
+                v-model="allMoneyBidProportion"
                 style="width:150px"
                 @fouse.stop
+                v-if="allPrice == '1'"
               />
+              <a-input-number :min="0" :step="0.01" v-model="allMoneyBid" style="width:150px" @fouse.stop v-else />
               <a-button @click="editMoneyBid" style="margin:0 15px 15px 15px" type="primary">修改</a-button>
 
               批量操作:
@@ -39,6 +46,7 @@
                 <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-option value="4">修改</a-select-option>
               </a-select>
               <a-button @click="editStatus" style="margin:0 0 15px 15px" type="primary">确认</a-button>
             </div>
@@ -57,8 +65,12 @@
               :customRow="rowClick"
               :pagination="ipagination"
               :scroll="{ x: 3000 }"
-              :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
+              :rowSelection="{
+                selectedRowKeys: selectedRowKeys,
+                onChange: onSelectChange
+              }"
             >
+              <!-- getCheckboxProps: getCheckboxProps -->
               <a slot="unitName" slot-scope="text, record" @click="toDetail(record)">{{ text }}</a>
               <span slot="action" slot-scope="text, record">
                 <a-switch v-model="record.showSwich" @change="onChangeSwitch(record)" />
@@ -129,12 +141,21 @@
         </a-tabs>
       </a-card>
     </a-row>
+    <editGroup ref="editGroup" @getList="getDataList" />
+    <a-modal title="批量修改" v-model="visibleEditAll" :width="900">
+      <editAllGroup :populationData.sync="populationData" ref="population" />
+      <template slot="footer">
+        <a-button key="submit" type="primary" @click="handleSubmit">
+          确定
+        </a-button>
+      </template>
+    </a-modal>
     <a-modal v-model="visible" title="错误信息" onOk="handleOk" :footer="null">
       <div v-if="visibleData">
         修改条数:{{ visibleData.totalCount }} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;失败条数:{{ visibleData.failCount }}
         <div style="margin-top:20px">
           <p v-for="(item, index) of visibleData.failInfo" :key="index">
-            <span>名称:{{ item.campaignName }}</span
+            <span>名称:{{ item.unitName }}</span
             ><br />
             <span>错误信息:{{ item.message }}</span>
           </p>
@@ -152,6 +173,10 @@ import countTo from 'vue-count-to'
 import { deleteAction, getAction, postAction } from '@/api/manage'
 // import lifting from './components/lifting'
 import { mapGetters } from 'vuex'
+
+import editGroup from './editGroup'
+import editAllGroup from './editAllGroup'
+
 var columns = [
   {
     title: '开关',
@@ -210,6 +235,15 @@ var columns = [
     title: '创建渠道',
     align: 'center',
     dataIndex: 'createChannel',
+    filters: [
+      { text: '投放后台创建', value: '0' },
+      { text: '汇创助手创建', value: '1' }
+    ],
+    onFilter: (value, record) =>
+      record.createChannel
+        .toString()
+        .toLowerCase()
+        .includes(value.toLowerCase()),
     scopedSlots: { customRender: 'createChannel' }
   },
   {
@@ -221,7 +255,20 @@ var columns = [
     title: '出价类型',
     align: 'center',
     dataIndex: 'bidType',
-
+    filters: [
+      { text: '封面点击', value: '0' },
+      { text: '行为数', value: '2' },
+      //   { text: '曝光', value: '10' },
+      { text: '点击', value: '11' },
+      //   { text: '下载完成', value: '31' },
+      { text: '提交线索', value: '53' },
+      { text: '激活', value: '180' }
+    ],
+    onFilter: (value, record) =>
+      record.ocpxActionType
+        .toString()
+        .toLowerCase()
+        .includes(value.toLowerCase()),
     scopedSlots: { customRender: 'bidType' }
   },
   //   {
@@ -284,19 +331,23 @@ export default {
   components: {
     ACol,
     ARow,
-    countTo
+    countTo,
+    editGroup,
+    editAllGroup
   },
 
   data: function() {
     return {
       visible: false,
       visibleData: null,
+      visibleEditAll: false,
       showEdit: false,
       columns,
       columnsElse: columns,
       dataList: [],
       selectedRowKeys: [],
       selectedRowKeysValue: [],
+      populationData: {},
       rowClick: (record, index) => ({
         // 事件
         on: {
@@ -334,9 +385,11 @@ export default {
       dataValue: [],
       indeterminate: true,
       checkAll: false,
-      allMoney: null,
+      allMoney: 1.2,
       allMoneyBid: null,
+      allMoneyBidProportion: 1.2,
       allType: '1',
+      allPrice: '1',
       maxBid: null
     }
   },
@@ -391,6 +444,13 @@ export default {
     }
   },
   methods: {
+    // getCheckboxProps(record) {
+    //   return {
+    //     props: {
+    //       defaultChecked: this.selectedRowKeys.includes(record.unitId)
+    //     }
+    //   }
+    // },
     remove(targetKey) {
       let activeKey = this.titleKey
       let lastIndex
@@ -417,7 +477,9 @@ export default {
         this.getDataList(activeKey)
       }
     },
-    editDetail(item) {},
+    editDetail(item) {
+      this.$refs.editGroup.handleOk(item)
+    },
     toDetail(record) {
       // 点击改行时要做的事情
       localStorage.setItem('originalityKey', record.unitId)
@@ -466,11 +528,7 @@ export default {
             console.log(res)
             if (res.result.failCount > 0) {
               this.$message.error(
-                '广告计划:' +
-                  res.result.failInfo[0].campaignName +
-                  '          ' +
-                  '错误:' +
-                  res.result.failInfo[0].message
+                '广告组:' + res.result.failInfo[0].unitName + '          ' + '错误:' + res.result.failInfo[0].message
               )
             }
           })
@@ -497,7 +555,7 @@ export default {
             if (res.result.failCount > 0) {
               this.$message.error(
                 '广告计划:' +
-                  res.result.failInfo[0].campaignName +
+                  res.result.failInfo[0].unitName +
                   '          ' +
                   '错误:' +
                   res.result.failInfo[0].message
@@ -511,66 +569,103 @@ export default {
       console.log(item)
     },
     editStatus() {
-      var params = {}
-      params.accountId = localStorage.getItem('accountId')
-      params.putStatus = this.allType
-      params.userId = this.userInfo().id
-      params.unitIds = this.selectedRowKeysValue
-      postAction('/kuaishou/batch/batchUpdateUnitStatus', params).then(res => {
-        console.log(res)
-        this.getDataList(localStorage.getItem('advertisingGroupKey'))
-        this.$message.success('批量修改成功')
-        this.allType = '1'
-        this.selectedRowKeysValue = []
-        this.selectedRowKeys = []
-      })
-    },
-    editMoney() {
-      var params = {}
-      params.accountId = localStorage.getItem('accountId')
-      params.dayBudget = this.allMoney * 1000
-      params.userId = this.userInfo().id
-      params.unitIds = this.selectedRowKeysValue
-      postAction('/kuaishou/batch/batchUpdateUnitBudget', params).then(res => {
-        console.log(res)
-        if (res.result.failCount > 0) {
-          this.visible = true
-          this.visibleData = res.result
-          this.getDataList(localStorage.getItem('advertisingGroupKey'))
-        } else {
+      if (this.allType == '4') {
+        this.visibleEditAll = true
+      } else {
+        var params = {}
+        params.accountId = localStorage.getItem('accountId')
+        params.putStatus = this.allType
+        params.userId = this.userInfo().id
+        params.unitIds = this.selectedRowKeysValue
+        postAction('/kuaishou/batch/batchUpdateUnitStatus', params).then(res => {
+          console.log(res)
           this.getDataList(localStorage.getItem('advertisingGroupKey'))
-          this.allMoney = null
           this.$message.success('批量修改成功')
+          this.allType = '1'
           this.selectedRowKeysValue = []
           this.selectedRowKeys = []
-        }
-      })
-    },
-    editMoneyBid() {
-      if (this.allMoneyBid < 1 || this.allMoneyBid > this.maxBid) {
-        this.$message.error('不得低于1元,不得高于项目最高出价' + this.maxBid + '元')
-        return
+        })
       }
+    },
+    editMoney() {
       var params = {}
       params.accountId = localStorage.getItem('accountId')
-      params.bid = this.allMoneyBid * 1000
+      params.proportion = this.allMoney
       params.userId = this.userInfo().id
       params.unitIds = this.selectedRowKeysValue
-      postAction('/kuaishou/batch/batchUpdateUnitBid', params).then(res => {
+      postAction('/kuaishou/batch/batchUpdateUnitBudgetByProportion', params).then(res => {
         console.log(res)
-        if (res.result.failCount > 0) {
-          this.visible = true
-          this.visibleData = res.result
-          this.getDataList(localStorage.getItem('advertisingGroupKey'))
+        if (res.success) {
+          if (res.result.failCount > 0) {
+            this.visible = true
+            this.visibleData = res.result
+            this.getDataList(localStorage.getItem('advertisingGroupKey'))
+          } else {
+            this.allMoney = 1.2
+            this.$message.success('批量修改成功')
+            this.getDataList(localStorage.getItem('advertisingGroupKey'))
+            this.selectedRowKeysValue = []
+            this.selectedRowKeys = []
+          }
         } else {
-          this.getDataList(localStorage.getItem('advertisingGroupKey'))
-          this.$message.success('批量修改成功')
-          this.allMoneyBid = null
-          this.selectedRowKeysValue = []
-          this.selectedRowKeys = []
+          this.$message.error(res.message)
         }
       })
     },
+    editMoneyBid() {
+      if (this.allPrice == '2') {
+        if (this.allMoneyBid < 1 || this.allMoneyBid > this.maxBid) {
+          this.$message.error('不得低于1元,不得高于项目最高出价' + this.maxBid + '元')
+          return
+        }
+        var params = {}
+        params.accountId = localStorage.getItem('accountId')
+        params.bid = this.allMoneyBid * 1000
+        params.userId = this.userInfo().id
+        params.unitIds = this.selectedRowKeysValue
+        postAction('/kuaishou/batch/batchUpdateUnitBid', params).then(res => {
+          console.log(res)
+          if (res.success) {
+            if (res.result.failCount > 0) {
+              this.visible = true
+              this.visibleData = res.result
+              this.getDataList(localStorage.getItem('advertisingGroupKey'))
+            } else {
+              this.allMoneyBid = null
+              this.$message.success('批量修改成功')
+              this.getDataList(localStorage.getItem('advertisingGroupKey'))
+              this.selectedRowKeysValue = []
+              this.selectedRowKeys = []
+            }
+          } else {
+            this.$message.error(res.message)
+          }
+        })
+      } else if (this.allPrice == '1') {
+        var params = {}
+        params.accountId = localStorage.getItem('accountId')
+        params.proportion = this.allMoneyBidProportion
+        params.userId = this.userInfo().id
+        params.unitIds = this.selectedRowKeysValue
+        postAction('/kuaishou/batch/batchUpdateUnitBidByProportion', params).then(res => {
+          if (res.success) {
+            if (res.result.failCount > 0) {
+              this.visible = true
+              this.visibleData = res.result
+              this.getDataList(localStorage.getItem('advertisingGroupKey'))
+            } else {
+              this.allMoneyBidProportion = 1.2
+              this.$message.success('批量修改成功')
+              this.getDataList(localStorage.getItem('advertisingGroupKey'))
+              this.selectedRowKeysValue = []
+              this.selectedRowKeys = []
+            }
+          } else {
+            this.$message.error(res.message)
+          }
+        })
+      }
+    },
     handleOk(e) {
       console.log(e)
       this.showEdit = false
@@ -654,6 +749,36 @@ export default {
         localStorage.setItem('campaignId', this.titleKey)
         this.$router.replace({ path: '/account/stepForm' })
       }
+    },
+    handleSubmit(e) {
+      //   this.$refs.population.handleSubmit()
+      this.$refs.population.handleSubmit()
+
+      var params = {
+        ...this.populationData
+      }
+      params.userId = this.userInfo().id
+      params.unitIds = this.selectedRowKeysValue
+      params.accountId = localStorage.getItem('accountId')
+      postAction('/kuaishou/batch/batchUpdateUnit', params).then(res => {
+        if (res.success) {
+          if (res.result.failCount > 0) {
+            this.visibleEditAll = false
+            this.visible = true
+            this.visibleData = res.result
+            this.getDataList(localStorage.getItem('advertisingGroupKey'))
+          } else {
+            this.visibleEditAll = false
+            this.getDataList(localStorage.getItem('advertisingGroupKey'))
+            this.$message.success('批量修改成功')
+            this.allMoneyBidProportion = 1.2
+            this.selectedRowKeysValue = []
+            this.selectedRowKeys = []
+          }
+        } else {
+          this.$message.error(res.message)
+        }
+      })
     }
   },
   watch: {

+ 650 - 0
src/views/modules/kuaishouapp/account/editAllGroup.vue

@@ -0,0 +1,650 @@
+<style>
+#table_time_selected1 tr {
+  border: 1px solid rgb(102, 162, 243);
+}
+
+.plug-timer-grid th {
+  line-height: 25px;
+}
+
+.module-form .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;
+}
+</style>
+<style scoped>
+ul {
+  padding-left: 0;
+}
+li {
+  list-style: none;
+}
+li:hover {
+  background: #f2f2f2;
+}
+</style>
+<template>
+  <a-form :form="form" class="module-form" @submit="handleSubmit">
+    <a-form-item
+      label="自定义人群"
+      :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+      :wrapperCol="{ lg: { span: 17 }, sm: { span: 17 } }"
+    >
+      <a-radio-group buttonStyle="solid" v-model="people" @change="getPeople">
+        <a-radio-button value="2">不限</a-radio-button>
+        <a-radio-button value="3">定向人群</a-radio-button>
+        <!-- <a-radio-button value="4">付费人群</a-radio-button> -->
+      </a-radio-group>
+    </a-form-item>
+    <a-form-item
+      v-if="people == '3'"
+      label="定向逻辑"
+      :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+      :wrapperCol="{ lg: { span: 17 }, sm: { span: 17 } }"
+    >
+      <a-radio-group buttonStyle="solid" v-model="targeted" @change="radioChange">
+        <a-radio-button value="2">定向</a-radio-button>
+        <a-radio-button value="3">排除</a-radio-button>
+        <a-radio-button value="4">同时定向排除</a-radio-button>
+      </a-radio-group>
+      <div
+        :style="{
+          border: targeted == '4' ? '1px solid #f2f2f2' : '0',
+          padding: targeted == '4' ? '20px' : '0'
+        }"
+      >
+        <div style="display:flex;margin-top:15px" v-if="targeted == '4' || targeted == '2'">
+          <span style="white-space:nowrap;width:10%" v-if="targeted == '4'">定向池:</span>
+          <a-input
+            placeholder="请至少选择一个自定义人群"
+            @focus="
+              topMiddle = true
+              topMiddleNo = false
+            "
+            v-model="keyValue"
+          />
+        </div>
+
+        <div
+          style="background:white;padding:10px;box-shadow: 0 2px 8px 0 rgba(0,0,0,.15);"
+          :style="{ width: targeted == '4' ? '90%' : '100%', marginLeft: targeted == '4' ? '10%' : '0' }"
+          v-show="topMiddle"
+        >
+          <a-table
+            :columns="columns"
+            :dataSource="dataList"
+            bordered
+            :pagination="false"
+            :scroll="{ y: 300 }"
+            :rowSelection="{
+              selectedRowKeys: selectedRowKeys,
+              onChange: onSelectChange,
+              getCheckboxProps: getCheckboxProps
+            }"
+          >
+            <span slot="orientationName" slot-scope="text, record">{{ text }}({{ record.orientationId }})</span>
+            <span slot="populationType" slot-scope="text">{{ text | population_type }}</span>
+            <span slot="createTime" slot-scope="text">{{ text | getDate }}</span>
+          </a-table>
+          <div style="text-align:right">
+            <a-button style="margin-right:5px" @click="topMiddle = false">取消</a-button>
+            <a-button type="primary" @click="okSelect">确定</a-button>
+          </div>
+        </div>
+        <div style="display:flex;margin-top:15px" v-if="targeted == '4' || targeted == '3'">
+          <span style="white-space:nowrap;width:10%" v-if="targeted == '4'">排除池:</span>
+          <a-input
+            placeholder="请至少选择一个自定义人群"
+            @focus="
+              topMiddleNo = true
+              topMiddle = false
+            "
+            v-model="keyValueNo"
+          />
+        </div>
+
+        <div
+          style="background:white;padding:10px;box-shadow: 0 2px 8px 0 rgba(0,0,0,.15);"
+          :style="{ width: targeted == '4' ? '90%' : '100%', marginLeft: targeted == '4' ? '10%' : '0' }"
+          v-show="topMiddleNo"
+        >
+          <a-table
+            :columns="columns"
+            :dataSource="dataList"
+            bordered
+            :pagination="false"
+            :scroll="{ y: 300 }"
+            :rowSelection="{
+              selectedRowKeys: selectedRowKeysNo,
+              onChange: onSelectChangeNo,
+              getCheckboxProps: getCheckboxPropsNo
+            }"
+          >
+            <span slot="orientationName" slot-scope="text, record">{{ text }}({{ record.orientationId }})</span>
+            <span slot="populationType" slot-scope="text">{{ text | population_type }}</span>
+            <span slot="createTime" slot-scope="text">{{ text | getDate }}</span>
+          </a-table>
+          <div style="text-align:right">
+            <a-button style="margin-right:5px" @click="topMiddleNo = false">取消</a-button>
+            <a-button type="primary" @click="okSelectNo">确定</a-button>
+          </div>
+        </div>
+      </div>
+    </a-form-item>
+    <a-form-item
+      label="地区"
+      :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+      :wrapperCol="{ lg: { span: 17 }, sm: { span: 17 } }"
+    >
+      <a-radio-group @change="regionChange" v-model="allForm.regionType" buttonStyle="solid">
+        <a-radio-button value="noLimit">不限</a-radio-button>
+        <a-radio-button value="limit">指定地区</a-radio-button>
+      </a-radio-group>
+      <div v-if="allForm.regionType == 'limit'" style="margin-top:10px">
+        <select-region :checkData.sync="allForm.region" :dataValue="allForm.region" />
+      </div>
+    </a-form-item>
+    <a-form-item
+      label="年龄"
+      :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+      :wrapperCol="{ lg: { span: 17 }, sm: { span: 17 } }"
+    >
+      <a-radio-group v-model="allForm.ageType" buttonStyle="solid">
+        <a-radio-button value="noLimit">不限</a-radio-button>
+        <a-radio-button value="ageLimit">限定年龄段</a-radio-button>
+        <a-radio-button value="ageCustom">自定义年龄段</a-radio-button>
+      </a-radio-group>
+      <div v-if="allForm.ageType == 'ageLimit'">
+        <a-checkbox-group v-decorator="['agesRange', { rules: [{ required: true, message: '请选择年龄段' }] }]">
+          <a-checkbox :value="0">0-11岁</a-checkbox>
+          <a-checkbox :value="12">12-27岁</a-checkbox>
+          <a-checkbox :value="18">18-23岁</a-checkbox>
+          <a-checkbox :value="24">24-30岁</a-checkbox>
+          <a-checkbox :value="31">31-40岁</a-checkbox>
+          <a-checkbox :value="41">41-49岁</a-checkbox>
+          <a-checkbox :value="50">50+</a-checkbox>
+        </a-checkbox-group>
+      </div>
+      <div v-if="allForm.ageType == 'ageCustom'">
+        <a-slider
+          range
+          :marks="marks"
+          :min="5"
+          :max="55"
+          v-decorator="[
+            'age',
+            {
+              rules: [{ required: true, message: '请选择年龄段' }, { validator: handleConfirmValue }],
+              initialValue: [10, 50]
+            }
+          ]"
+        />
+      </div>
+    </a-form-item>
+    <a-form-item
+      label="性别"
+      :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+      :wrapperCol="{ lg: { span: 17 }, sm: { span: 17 } }"
+    >
+      <a-radio-group
+        buttonStyle="solid"
+        v-decorator="[
+          'gender',
+          {
+            initialValue: 0
+          }
+        ]"
+      >
+        <a-radio-button :value="0">不限</a-radio-button>
+        <a-radio-button :value="1">女性</a-radio-button>
+        <a-radio-button :value="2">男性</a-radio-button>
+      </a-radio-group>
+    </a-form-item>
+    <a-form-item
+      label="投放时段"
+      :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+      :wrapperCol="{ lg: { span: 17 }, sm: { span: 17 } }"
+    >
+      <!-- v-decorator="['speed', { initialValue: '1' }]" -->
+      <a-radio-group buttonStyle="solid" v-model="allForm.scheduleTime" @change="setTimeAll">
+        <a-radio-button value="1">全天</a-radio-button>
+        <a-radio-button value="2">特定时间</a-radio-button>
+      </a-radio-group>
+      <br />
+      <selectCheckAll
+        style="width:100%"
+        v-show="allForm.scheduleTime == '2'"
+        :scheduleTime.sync="allForm.scheduleTimeData"
+        ref="selectCheck"
+      />
+    </a-form-item>
+  </a-form>
+</template>
+
+<script>
+import { getAction, postAction } from '@/api/manage'
+import moment from 'moment'
+import { mapGetters } from 'vuex'
+import jq from 'jquery'
+
+import selectRegion from './stepForm/stepModule/selectRegion'
+import selectCheckAll from './stepForm/stepModule/test'
+import pick from 'lodash.pick'
+let dateQuantumRangeConst = ''
+const clickoutside = {
+  // 初始化指令
+  bind(el, binding, vnode) {
+    function documentHandler(e) {
+      // 这里判断点击的元素是否是本身,是本身,则返回
+      if (el.contains(e.target)) {
+        return false
+      }
+      // 判断指令中是否绑定了函数
+      if (binding.expression) {
+        // 如果绑定了函数 则调用那个函数,此处binding.value就是handleClose方法
+        binding.value(e)
+      }
+    }
+    // 给当前元素绑定个私有变量,方便在unbind中可以解除事件监听
+    el.__vueClickOutside__ = documentHandler
+    document.addEventListener('click', documentHandler)
+  },
+  update() {},
+  unbind(el, binding) {
+    // 解除事件监听
+    document.removeEventListener('click', el.__vueClickOutside__)
+    delete el.__vueClickOutside__
+  }
+}
+
+const columns = [
+  {
+    title: '人群',
+    dataIndex: 'orientationName',
+    scopedSlots: { customRender: 'orientationName' },
+    width: 150
+  },
+  {
+    title: '属性',
+    dataIndex: 'populationType',
+    filters: [
+      { text: '上传人群', value: '1' },
+      { text: '广告人群', value: '2' },
+      { text: '主题专区', value: '3' },
+      { text: '逻辑规则', value: '4' },
+      { text: '人群扩展', value: '5' },
+      { text: '平台定制', value: '6' },
+      { text: '定制付费', value: '7' },
+      { text: '网红粉丝类别', value: '8' },
+      { text: '内容付费行为', value: '9' },
+      { text: '移动应用安装', value: '10' },
+      { text: '快手使用活跃度', value: '11' },
+      { text: '行业分类', value: '12' },
+      { text: '商业兴趣', value: '13' },
+      { text: '固化标签', value: '14' },
+      { text: '行业偏好', value: '15' },
+      { text: '第三方标签', value: '16' },
+      { text: '产品关键词', value: '17' }
+    ],
+    onFilter: (value, record) =>
+      record.populationType
+        .toString()
+        .toLowerCase()
+        .includes(value.toLowerCase()),
+    scopedSlots: { customRender: 'populationType' },
+    width: 150
+  },
+  {
+    title: '创建时间',
+    dataIndex: 'createTime',
+    scopedSlots: { customRender: 'createTime' },
+    sorter: (a, b) => a.createTime - b.createTime
+  }
+]
+
+export default {
+  name: 'BaseForm',
+  components: { selectRegion, selectCheckAll },
+  props: {
+    campaignId: {
+      type: String,
+      default() {
+        return null
+      }
+    },
+    platform: {
+      default() {
+        return null
+      }
+    },
+    populationData: {}
+  },
+  filters: {
+    getDate(value) {
+      let date = new Date(value)
+      let y = date.getFullYear()
+      let MM = date.getMonth() + 1
+      MM = MM < 10 ? '0' + MM : MM
+      let d = date.getDate()
+      d = d < 10 ? '0' + d : d
+      return y + '-' + MM + '-' + d
+    },
+    population_type(str) {
+      var data = {
+        1: '上传人群',
+        2: '广告人群',
+        3: '主题专区',
+        4: '逻辑规则',
+        5: '人群扩展',
+        6: '平台定制',
+        7: '定制付费',
+        8: '网红粉丝类别',
+        9: '内容付费行为',
+        10: '移动应用安装',
+        11: '快手使用活跃度',
+        12: '行业分类',
+        13: '商业兴趣',
+        14: '固化标签',
+        15: '行业偏好',
+        16: '第三方标签',
+        17: '产品关键词'
+      }
+      return data[str]
+    }
+  },
+  directives: { clickoutside },
+  data() {
+    return {
+      form: this.$form.createForm(this),
+      marks: {
+        5: '5岁',
+        10: '10岁',
+        15: '15岁',
+        20: '20岁',
+        25: '25岁',
+        30: '30岁',
+        35: '35岁',
+        40: '40岁',
+        45: '45岁',
+        50: '50岁',
+        55: '55岁'
+      },
+      loading: false,
+      allForm: {
+        regionType: 'noLimit',
+        region: [],
+        ageType: 'noLimit',
+        age: [],
+        scheduleTime: '1',
+        scheduleTimeData:
+          '000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000'
+      },
+      optionsApp: [],
+      optionsAppActive: [],
+      checkOptions: [],
+      businessOptions: [],
+      fansStarOptions: [],
+      interestVideoOptions: [],
+      optionPropsApp: {
+        value: 'tagId',
+        label: 'tagName',
+        children: 'children',
+        multiple: true,
+        emitPath: false
+      },
+      closeDialog: false,
+      indeterminate: false,
+      checkAll: false,
+      people: '2',
+      targeted: '2',
+      topMiddle: false,
+      topMiddleNo: false,
+      keyValue: '',
+      keyValueNo: '',
+      columns,
+      selectedRowKeys: [],
+      selectedRowKeysValue: [],
+      selectedRowKeysNo: [],
+      selectedRowKeysValueNo: [],
+      dataList: []
+    }
+  },
+  computed: {},
+  methods: {
+    setTimeAll(e) {
+      //   console.log(moment('2019-12-27'))
+      if (e.target.value == '2') {
+        // this.$nextTick(() => {
+        //   this.$refs.selectCheck.init()
+        // })
+      } else {
+      }
+    },
+    getPeople() {
+      return new Promise((resolve, reject) => {
+        getAction('/kuaishou/batch/getPopulationList', { accountId: localStorage.getItem('accountId') }).then(res => {
+          if (res.success) {
+            console.log(res)
+            this.dataList = res.result.map((item, index) => {
+              return {
+                ...item,
+                key: index
+              }
+            })
+            resolve(res.result)
+          }
+        })
+      })
+    },
+    radioChange() {
+      this.selectedRowKeys = []
+      this.selectedRowKeysValue = []
+      this.selectedRowKeysNo = []
+      this.selectedRowKeysValueNo = []
+      this.keyValue = ''
+      this.keyValueNo = ''
+    },
+    onSelectChange(selectedRowKeys, selectionRows) {
+      this.selectedRowKeys = selectedRowKeys
+      console.log(selectionRows)
+      this.selectedRowKeysValue = selectionRows.map(item => {
+        return { orientationId: item.orientationId, orientationName: item.orientationName }
+      })
+    },
+    getCheckboxProps(record) {
+      return {
+        props: {
+          disabled: this.selectedRowKeysValueNo.some(item => item.orientationId === record.orientationId)
+        }
+      }
+    },
+    onSelectChangeNo(selectedRowKeys, selectionRows) {
+      this.selectedRowKeysNo = selectedRowKeys
+      console.log(selectionRows)
+      this.selectedRowKeysValueNo = selectionRows.map(item => {
+        return { orientationId: item.orientationId, orientationName: item.orientationName }
+      })
+    },
+    getCheckboxPropsNo(record) {
+      return {
+        props: {
+          disabled: this.selectedRowKeysValue.some(item => item.orientationId === record.orientationId)
+        }
+      }
+    },
+    okSelect() {
+      this.keyValue = ''
+      this.topMiddle = false
+      for (let i = 0; i < this.selectedRowKeysValue.length; i++) {
+        this.keyValue += this.selectedRowKeysValue[i].orientationName + '   '
+      }
+    },
+    okSelectNo() {
+      this.keyValueNo = ''
+      this.topMiddleNo = false
+      for (let i = 0; i < this.selectedRowKeysValueNo.length; i++) {
+        this.keyValueNo += this.selectedRowKeysValueNo[i].orientationName + '   '
+      }
+    },
+    getRegion(data) {
+      this.$refs.cascaderRegion.getCheckedNodes()
+      console.log(this.$refs.cascaderRegion.getCheckedNodes())
+      var dataName = this.$refs.cascaderRegion.getCheckedNodes()
+      var jsonArr = data
+      for (let i = 0; i < dataName.length; i++) {
+        for (let j = 0; j < data.length; j++) {
+          if (dataName[i].children.length > 0) {
+            if (data[j].substring(0, 2) == dataName[i].value) {
+              jsonArr.splice(j, 1)
+            }
+          }
+        }
+      }
+    },
+    showAppName(appId) {
+      var data = this.checkOptions.filter(item => {
+        return item.appId == appId
+      })
+      return data[0].appName
+    },
+    log(appId) {
+      var index = this.checkArr.findIndex(item => item === appId)
+      this.checkArr.splice(index, 1)
+      if (this.checkArr.length == 0) {
+        this.indeterminate = false
+        this.checkAll = false
+      }
+    },
+    handleClose(e) {
+      this.closeDialog = false
+    },
+    handleSubmit() {
+      //   e.preventDefault()
+      console.log(this.selectedRowKeysValue)
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          console.log('Received values of form: ', values)
+          //   this.checkArr
+          var json = {}
+          if (this.allForm.regionType == 'limit') {
+            json.region = this.allForm.region.map(item => {
+              return item.value
+            })
+          }
+          var jsonData = {}
+          if (this.targeted == '2') {
+            jsonData.population = this.selectedRowKeysValue.map(item => {
+              return item.orientationId
+            })
+          } else if (this.targeted == '3') {
+            jsonData.excludePopulation = this.selectedRowKeysValueNo.map(item => {
+              return item.orientationId
+            })
+          } else if (this.targeted == '4') {
+            jsonData.population = this.selectedRowKeysValue.map(item => {
+              return item.orientationId
+            })
+            jsonData.excludePopulation = this.selectedRowKeysValueNo.map(item => {
+              return item.orientationId
+            })
+          } else {
+            jsonData = {}
+          }
+          var dataJson = {
+            ...values,
+            ...json,
+            ...jsonData,
+            scheduleTime:
+              this.allForm.scheduleTime == '2'
+                ? this.allForm.scheduleTimeData
+                : '000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000'
+          }
+          this.$emit('update:populationData', dataJson)
+        }
+      })
+    },
+    handleConfirmValue(rule, value, callback) {
+      console.log(value)
+      if (Math.abs(value[0] - value[1]) < 5) {
+        callback('自定义年龄段需要间隔大于5岁')
+      }
+      callback()
+    },
+    regionChange() {
+      this.allForm.region = []
+    },
+    filterOption(input, option) {
+      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+    },
+    getData(className) {
+      return this.form.getFieldValue(className)
+    }
+  },
+  mounted: function() {}
+}
+</script>
+
+<style type="text/css">
+.plug-timer-grid {
+  width: 100%;
+}
+
+.plug-timer-grid td,
+.plug-timer-grid th {
+  border: 1px solid #97b4d1;
+  text-align: center; /*cursor:pointer;*/
+  font-size: 10px;
+  line-height: 10px;
+}
+
+.Selected {
+  background-color: rgb(102, 162, 243);
+  opacity: 0.5;
+}
+
+.plug-timer-grid {
+  border-collapse: collapse;
+  z-index: 4;
+}
+
+.plug-timer-grid thead tr {
+  display: table-row;
+  vertical-align: inherit;
+  border-color: inherit;
+}
+
+.group-creat table td {
+  height: 20px;
+  max-width: 5px;
+  border: 1px solid #dfe6ec;
+  font-size: 12px;
+  text-align: center;
+  vertical-align: middle;
+  overflow: hidden;
+  transition: background 0.5s;
+  -webkit-transition: background 0.5s;
+}
+
+.plug-timer-grid tbody th {
+  width: 4%;
+}
+
+.plug-timer-grid tbody tr td {
+  width: 2%;
+}
+
+/*.clear{*/
+/*  margin:20px 0px 20px 0px;*/
+/*}*/
+</style>

+ 870 - 0
src/views/modules/kuaishouapp/account/editGroup.vue

@@ -0,0 +1,870 @@
+<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;
+}
+</style>
+<template>
+  <a-modal v-model="visible" title="修改广告组信息" :width="900" v-if="visible">
+    <a-form @submit="handleSubmit" :form="form">
+      <a-form-item
+        label="目标应用"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+        v-if="campaignType == '2'"
+      >
+        <a-select
+          v-decorator="['appId', { rules: [{ required: true, message: '请选择目标应用' }] }]"
+          showSearch
+          allowClear
+          placeholder="选择应用目标"
+          optionFilterProp="children"
+          style="width: 500px"
+          @focus="handleFocus"
+          @blur="handleBlur"
+          @change="handleChange"
+          :filterOption="filterOption"
+        >
+          <a-select-option value="0">请选择目标应用</a-select-option>
+          <a-select-option v-for="appModel in appList" :key="appModel.appId" :value="appModel.appId">
+            {{ appModel.appName }}&#12288;&nbsp;&#12288; {{ appModel.appVersion }}&#12288;&#12288;&#12288;{{
+              appModel.platform | platform
+            }}
+          </a-select-option>
+        </a-select>
+        <a @click="addApplication" style="margin-left:10px">添加应用</a>
+        <creat-application ref="application" />
+      </a-form-item>
+      <a-form-item
+        label="转化类型"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+        v-if="campaignType == '3'"
+      >
+        <a-radio-group
+          buttonStyle="solid"
+          v-decorator="['urlType', { rules: [{ required: true, message: '请选择目标应用' }], initialValue: '1' }]"
+        >
+          <a-radio-button value="1">淘宝商品</a-radio-button>
+          <a-radio-button value="2">淘客商品</a-radio-button>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item
+        :label="campaignType == '3' ? ' ' : '链接'"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+        v-if="campaignType != '2'"
+        :class="{ elseLabel: campaignType == '3' }"
+      >
+        <!-- 请填写以http://或者https://开头的落地页地址,长度不超过1000个字符 -->
+        <a-input
+          placeholder="请填写链接"
+          v-decorator="['url', { rules: [{ required: true, message: ' ' }, { validator: handleConfirmValue }] }]"
+        />
+      </a-form-item>
+      <div style="text-align:center;font-size:16px;margin-bottom:10px">
+        目标人群
+      </div>
+      <a-form-item
+        label="选择模板"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+      >
+        <a-select
+          showSearch
+          allowClear
+          placeholder="选择模板"
+          optionFilterProp="children"
+          style="width: 500px"
+          @change="handleChangeMould"
+          :filterOption="filterOption"
+        >
+          <a-select-option v-for="(appModel, index) in dataList" :key="index" :value="appModel.id">
+            {{ appModel.templateName }}
+          </a-select-option>
+        </a-select>
+      </a-form-item>
+      <targeted-population
+        ref="population"
+        :populationData.sync="populationData"
+        :platform="getPlatForm(getData('appId'))"
+      />
+      <a-form-item
+        label=" "
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+        class="else-label"
+      >
+        <div style="display:flex;">
+          <a-checkbox :checked="checkedTrue" @change="getCheck">
+            是否设置为模板
+          </a-checkbox>
+          <a-input v-model="nameValue" v-if="checkedTrue" placeholder="请输入模板名称" style="width:70%" />
+        </div>
+      </a-form-item>
+
+      <div style="text-align:center;font-size:16px">
+        预算和排期
+      </div>
+
+      <a-form-item
+        label="单日预算"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+      >
+        <a-radio-group buttonStyle="solid" v-model="allForm.dayBudget">
+          <a-radio-button value="0">不限</a-radio-button>
+          <a-radio-button value="1">统一预算</a-radio-button>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item
+        label=" "
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+        class="else-label"
+        v-if="allForm.dayBudget == '1'"
+      >
+        <a-input
+          placeholder="不小于100,不超过100000000,仅支持输入自然数"
+          v-decorator="[
+            'dayBudget',
+            {
+              rules: [{ required: true, message: '请填写预算' }, { validator: budgetValue }]
+            }
+          ]"
+        />
+      </a-form-item>
+      <a-form-item
+        label="投放方式"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+      >
+        <a-radio-group buttonStyle="solid" v-decorator="['speed', { initialValue: 1 }]">
+          <a-radio-button :value="1">正常投放</a-radio-button>
+          <a-radio-button :value="2">平滑投放</a-radio-button>
+        </a-radio-group>
+        <br />
+        <span>
+          {{ getData('speed') == '2' ? '平滑匀速投放' : '尽快展示广告消耗预算' }}
+        </span>
+      </a-form-item>
+      <a-form-item
+        label="排期"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+      >
+        <!-- v-decorator="['speed', { initialValue: '1' }]" -->
+        <a-radio-group buttonStyle="solid" v-model="allForm.time" @change="setTime">
+          <a-radio-button value="1">从今天开始长期投放</a-radio-button>
+          <a-radio-button value="2">设置开始和结束日期</a-radio-button>
+        </a-radio-group>
+        <br />
+        <a-range-picker v-if="allForm.time == '2'" v-model="timeRange" format="YYYY-MM-DD" :allowClear="false" />
+      </a-form-item>
+      <a-form-item
+        label="投放时段"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 17 }, sm: { span: 17 } }"
+      >
+        <!-- v-decorator="['speed', { initialValue: '1' }]" -->
+        <a-radio-group buttonStyle="solid" v-model="allForm.scheduleTime" @change="setTimeAll">
+          <a-radio-button value="1">全天</a-radio-button>
+          <a-radio-button value="2">特定时间</a-radio-button>
+        </a-radio-group>
+        <br />
+        <selectCheckAll
+          style="width:100%"
+          v-show="allForm.scheduleTime == '2'"
+          :scheduleTime.sync="allForm.scheduleTimeData"
+          ref="selectCheck"
+        />
+      </a-form-item>
+
+      <a-form-item
+        label="创意展现方式"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+      >
+        <!-- v-decorator="['speed', { initialValue: '1' }]" -->
+        <a-radio-group buttonStyle="solid" v-decorator="['showMode', { initialValue: '2' }]">
+          <a-radio-button value="2">智能优选</a-radio-button>
+          <a-radio-button value="1">随机轮播</a-radio-button>
+        </a-radio-group>
+        <br />
+        <span>
+          {{
+            getData('showMode') == '1'
+              ? '广告组包含的广告创意将随机展现'
+              : '每一次展现的时候,系统会进行CTR预估,预估CTR高的会得到展现机会'
+          }}
+        </span>
+      </a-form-item>
+      <a-form-item
+        label="场景广告位"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+      >
+        <!-- v-decorator="['speed', { initialValue: '1' }]" -->
+        <a-radio-group buttonStyle="solid" v-decorator="['sceneId', { initialValue: '2' }]">
+          <a-radio-button value="2">信息流广告</a-radio-button>
+          <a-radio-button value="1">优选广告位</a-radio-button>
+        </a-radio-group>
+      </a-form-item>
+      <div style="text-align:center;font-size:16px">优化目标和计费</div>
+      <a-form-item
+        label=" "
+        :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
+        :wrapperCol="{ lg: { span: 18 }, sm: { span: 18 } }"
+        class="else-label"
+      >
+        <div style="width:100%">
+          <a-layout>
+            <a-layout-content style="padding:10px;">
+              <!-- <div :style="{ marginBottom: '16px' }">
+                <a-button @click="addGroup" :disabled="allForm.group.length > 10">添加广告组</a-button>
+              </div> -->
+              <a-row>
+                <a-col :sm="24" :md="24" :xl="24" :xxl="24" v-for="(item, index) of allForm.group" :key="index">
+                  <a-card title :ref="item" style="height:435px">
+                    <div style="clear:both"></div>
+                    <a-form-item
+                      label="优化目标"
+                      :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
+                      :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }"
+                    >
+                      <a-radio-group buttonStyle="solid" v-model="item.bidType" @change="resData(index)">
+                        <a-radio-button :value="1">点击数</a-radio-button>
+                        <a-radio-button :value="2">行为数</a-radio-button>
+                        <a-radio-button
+                          :value="180"
+                          v-if="campaignType == '2' && allForm.groupTypeData.isActivate == '1'"
+                          >激活</a-radio-button
+                        >
+                        <a-radio-button
+                          :value="53"
+                          v-if="
+                            (campaignType == '4' || campaignType == '5') && allForm.groupTypeData.isFormSubmit == '1'
+                          "
+                          >表单提交</a-radio-button
+                        >
+                      </a-radio-group>
+                    </a-form-item>
+                    <a-form-item
+                      label="深度转化目标"
+                      :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
+                      :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }"
+                      v-if="
+                        (item.bidType == '180' || item.bidType == '53') &&
+                          allForm.groupTypeData.deepConversionTypes.length > 0
+                      "
+                    >
+                      <a-select v-model="item.deepConversionType" allowClear>
+                        <a-select-option
+                          :value="items.deepConversionType"
+                          v-for="(items, index) of allForm.groupTypeData.deepConversionTypes"
+                          :key="index"
+                          >{{ items.desc }}</a-select-option
+                        >
+                      </a-select>
+                    </a-form-item>
+
+                    <a-form-item
+                      label="计费方式"
+                      :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
+                      :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }"
+                    >
+                      <a-radio-group :defaultValue="1">
+                        <a-radio :value="1">点击计费</a-radio>
+                      </a-radio-group>
+                    </a-form-item>
+                    <a-form-item
+                      label="出价"
+                      :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
+                      :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }"
+                      v-if="item.bidType == '1'"
+                    >
+                      <a-input-number
+                        v-model="item.bid"
+                        @change="showTip(index)"
+                        :style="{ borderColor: item.showTipCheck ? 'red' : '#d9d9d9' }"
+                        style="width:100%"
+                      ></a-input-number>
+                      <span style="color:red" v-if="item.showTipCheck"
+                        >不得低于0.2元,不得高于项目最高出价{{ maxBid }}元</span
+                      >
+                    </a-form-item>
+                    <a-form-item
+                      label="目标成本"
+                      :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
+                      :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }"
+                      v-else
+                    >
+                      <a-input-number
+                        v-model="item.cpaBid"
+                        @change="showTip(index)"
+                        :style="{ borderColor: item.showTipCheck ? 'red' : '#d9d9d9' }"
+                        style="width:100%"
+                      ></a-input-number>
+                      <span style="color:red" v-if="item.showTipCheck">{{
+                        item.bidType == '2'
+                          ? '不得低于1元,不得高于项目最高出价' + maxBid + '元'
+                          : '不得低于5元,不得高于项目最高出价' + maxBid + '元'
+                      }}</span>
+                    </a-form-item>
+                    <a-form-item
+                      label="深度转化出价"
+                      :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
+                      :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }"
+                      v-if="
+                        (item.bidType == '180' || item.bidType == '53') &&
+                          allForm.groupTypeData.deepConversionTypes.length > 0 &&
+                          item.deepConversionType != ''
+                      "
+                    >
+                      <a-input-number
+                        v-model="item.deepConversionBid"
+                        @change="deep_conversion_bidTip(index)"
+                        :style="{ borderColor: item.deepConversionBidCheck ? 'red' : '#d9d9d9' }"
+                        style="width:100%"
+                        :disabled="item.cpaBid == ''"
+                      ></a-input-number>
+                      <span style="color:red" v-if="item.deepConversionBidCheck"
+                        >深度转化目标成本必须高于优化目标成本,且不得高于3000元</span
+                      >
+                    </a-form-item>
+                    <a-form-item
+                      label="广告组名称"
+                      :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
+                      :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }"
+                    >
+                      <a-input v-model="item.unitName" @change="checkGroup($event, index)"></a-input>
+                      <span style="color:red" v-if="item.unitNameCheck">广告组名称重复</span>
+                    </a-form-item>
+                  </a-card>
+                </a-col>
+              </a-row>
+            </a-layout-content>
+          </a-layout>
+        </div>
+      </a-form-item>
+    </a-form>
+    <template slot="footer">
+      <a-button key="submit" type="primary" @click="handleSubmit" :loading="loading">
+        确定
+      </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 Treeselect from '@/views/modules/Statistics/components/Treeselect.vue'
+import targetedPopulation from '@/views/modules/kuaishouapp/account/stepForm/stepModule/targetedPopulation.vue'
+
+import creatApplication from '@/views/modules/kuaishouapp/account/stepForm/stepModule/creatApplication.vue'
+
+import selectCheckAll from '@/views/modules/kuaishouapp/account/stepForm/stepModule/test'
+import pick from 'lodash.pick'
+export default {
+  name: 'new-mould',
+  components: {
+    targetedPopulation,
+    Treeselect,
+    creatApplication,
+    selectCheckAll
+  },
+  data() {
+    return {
+      checkedTrue: false,
+      nameValue: '',
+      visible: false,
+      timeRange: [],
+      form: this.$form.createForm(this),
+      step: 0,
+      people: '2',
+      targeted: '2',
+      topMiddle: false,
+      topMiddleNo: false,
+      keyValue: '',
+      keyValueNo: '',
+      selectedRowKeys: [],
+      selectedRowKeysValue: [],
+      selectedRowKeysNo: [],
+      selectedRowKeysValueNo: [],
+      data: [],
+      populationData: {},
+      url: {
+        insertTemplateUrl: '/kuaishou/create/createGroups',
+        userAllocationList: '/ctop/userAllocation/list',
+        campaignList: '/kuaishou/kuaiShouCampaignTemplate/list',
+        getDeepConversionUrl: '/kuaishou/kuaiShouConversionTypes/getIsActivate',
+        getCampaignTemplate: '/kuaishou/kuaiShouCampaignTemplate/getKuaiShouCampaignTemplate',
+        appListUrl: '/kuaishou/kuaiShouCreateAppTemplate/list'
+      },
+      appList: [],
+      appId: '',
+      loading: false,
+      campaignTemplateId: '',
+      campaignType: '2',
+      maxBid: 0,
+      allForm: {
+        dayBudget: '0',
+        time: '1',
+        scheduleTime: '1',
+        scheduleTimeData:
+          '000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000',
+        group: [],
+        groupTypeData: null,
+        fail: [],
+        success: []
+      },
+      dataList: [],
+      unitId: ''
+    }
+  },
+  computed: {},
+  filters: {
+    platform(str) {
+      var data = {
+        1: 'Android应用下载',
+        2: 'Android网页游戏',
+        3: 'iOS应用下载',
+        4: 'iOS网页游戏'
+      }
+      return data[str]
+    }
+  },
+  methods: {
+    getCheck(e) {
+      this.checkedTrue = e.target.checked
+    },
+    resData(index) {
+      this.allForm.group[index].bid = ''
+      this.allForm.group[index].cpaBid = ''
+      this.allForm.group[index].showTipCheck = false
+      this.allForm.group[index].deepConversionBidCheck = false
+      this.allForm.group[index].deepConversionType = ''
+      this.allForm.group[index].deepConversionBid = ''
+    },
+    removeGroup(index) {
+      this.allForm.group.splice(index, 1)
+    },
+    deep_conversion_bidTip(index) {
+      if (
+        this.allForm.group[index].deepConversionBid < this.allForm.group[index].cpaBid ||
+        this.allForm.group[index].deepConversionBid > 3000
+      ) {
+        this.allForm.group[index].deepConversionBidCheck = true
+      } else {
+        this.allForm.group[index].deepConversionBidCheck = false
+      }
+    },
+    checkGroup(e, index) {
+      getAction('/kuaishou/batch/checkUnitName', {
+        campaignId: localStorage.getItem('advertisingGroupKey'),
+        unitName: e.target.value
+      }).then(res => {
+        this.allForm.group[index].unitNameCheck = !res.result
+      })
+    },
+    showTip(index) {
+      if (this.allForm.group[index].bidType == '1') {
+        if (this.allForm.group[index].bid < 0.2 || this.allForm.group[index].bid > this.maxBid) {
+          this.allForm.group[index].showTipCheck = true
+        } else {
+          this.allForm.group[index].showTipCheck = false
+        }
+      } else if (this.allForm.group[index].bidType == '2') {
+        if (this.allForm.group[index].cpaBid < 1 || this.allForm.group[index].cpaBid > this.maxBid) {
+          this.allForm.group[index].showTipCheck = true
+        } else {
+          this.allForm.group[index].showTipCheck = false
+        }
+      } else {
+        if (this.allForm.group[index].cpaBid < 5 || this.allForm.group[index].cpaBid > this.maxBid) {
+          this.allForm.group[index].showTipCheck = true
+        } else {
+          this.allForm.group[index].showTipCheck = false
+        }
+      }
+    },
+    getScheduleTime(item) {
+      this.allForm.scheduleTimeData = item
+    },
+    setTime(e) {
+      //   console.log(moment('2019-12-27'))
+      if (e.target.value == '2') {
+        this.timeRange[0] = moment().startOf('day')
+        this.timeRange[1] = moment().add(1, 'months')
+      }
+    },
+    setTimeAll(e) {
+      //   console.log(moment('2019-12-27'))
+      //   if (e.target.value == '2') {
+      //     this.$refs.selectCheck.init()
+      //   } else {
+      //   }
+    },
+    getData(className) {
+      return this.form.getFieldValue(className)
+    },
+    handleConfirmValue(rule, value, callback) {
+      if (this.campaignType == '3') {
+        if (value == '') {
+          callback('请填写链接')
+        }
+      } else if (this.campaignType == '4') {
+        if (/(http|https):\/\/([\w.]+\/?)\S*/.test(value) && value != '' && value.length < 10000) {
+          callback()
+        } else {
+          callback('链接不能为空且开头为http://或https://,并且长度小于10000')
+        }
+      } else if (this.campaignType == '5') {
+        if (/(http|https):\/\/([\w.]+\/?)\S*/.test(value) && value != '' && value.length < 10000) {
+          callback()
+        } else {
+          callback('链接不能为空且开头为http://或https://,并且长度小于10000')
+        }
+      }
+    },
+    budgetValue(rule, value, callback) {
+      if (value < 100 || value > 100000000) {
+        callback('不小于100,不超过100000000,仅支持输入自然数')
+      }
+      callback()
+    },
+    handleConfirmBid(rule, value, callback) {
+      if (this.bid == 0 || this.bid <= 0.2 || this.bid >= 100) {
+        callback('不得低于0.2元,不得高于100元')
+      }
+      callback()
+    },
+
+    handleConfirmCpaBid(rule, value, callback) {
+      if (this.ocpxActionType == '2' && (this.cpaBid == 0 || this.cpaBid <= 1 || this.cpaBid >= 3000)) {
+        callback('金额不得低于1元,不得高于3000元')
+      }
+      if (this.ocpxActionType == '180' && (this.cpaBid == 0 || this.cpaBid <= 5 || this.cpaBid >= 3000)) {
+        callback('金额不得低于5元,不得高于3000元')
+      }
+      callback()
+    },
+    onSelectChange(selectedRowKeys, selectionRows) {
+      this.selectedRowKeys = selectedRowKeys
+      this.selectedRowKeysValue = selectionRows.map(item => {
+        return { orientationId: item.orientationId, orientationName: item.orientationName }
+      })
+    },
+    getCheckboxProps(record) {
+      return {
+        props: {
+          disabled: this.selectedRowKeysValueNo.some(item => item.orientationId === record.orientationId)
+        }
+      }
+    },
+    onSelectChangeNo(selectedRowKeys, selectionRows) {
+      this.selectedRowKeysNo = selectedRowKeys
+      this.selectedRowKeysValueNo = selectionRows.map(item => {
+        return { orientationId: item.orientationId, orientationName: item.orientationName }
+      })
+    },
+    getCheckboxPropsNo(record) {
+      return {
+        props: {
+          disabled: this.selectedRowKeysValue.some(item => item.orientationId === record.orientationId)
+        }
+      }
+    },
+    okSelect() {
+      this.keyValue = ''
+      this.topMiddle = false
+      for (let i = 0; i < this.selectedRowKeysValue.length; i++) {
+        this.keyValue += this.selectedRowKeysValue[i].orientationName + '   '
+      }
+    },
+    okSelectNo() {
+      this.keyValueNo = ''
+      this.topMiddleNo = false
+      for (let i = 0; i < this.selectedRowKeysValueNo.length; i++) {
+        this.keyValueNo += this.selectedRowKeysValueNo[i].orientationName + '   '
+      }
+    },
+    radioChange() {
+      this.selectedRowKeys = []
+      this.selectedRowKeysValue = []
+      this.selectedRowKeysNo = []
+      this.selectedRowKeysValueNo = []
+      this.keyValue = ''
+      this.keyValueNo = ''
+    },
+
+    addApplication() {
+      this.$refs.application.showApplication()
+    },
+    handleOk(item) {
+      this.visible = true
+      //   /kuaishou/batch/getUnitDetail
+      console.log(item)
+      this.unitId = item.unitId
+      var params = {}
+      params.accountId = item.accountId
+      params.unitId = item.unitId
+      getAction('/kuaishou/batch/getUnitDetail', params).then(res => {
+        if (res.success) {
+          var dataJson = { ...res.result.baseInfo, ...res.result.appInfo, ...res.result.target }
+          dataJson.dayBudget = dataJson.dayBudget / 1000
+          this.allForm.dayBudget = dataJson.dayBudget == 0 ? '0' : '1'
+          this.allForm.time = dataJson.endTime ? '2' : '1'
+          this.timeRange = [moment(dataJson.beginTime), moment(dataJson.endTime)]
+          this.allForm.scheduleTime = dataJson.scheduleTime.indexOf('1') != -1 ? '2' : '1'
+          this.allForm.scheduleTimeData = dataJson.scheduleTime
+          this.allForm.group = [
+            {
+              bidType: dataJson.ocpxActionType,
+              bid: dataJson.bid,
+              cpaBid: dataJson.cpaBid / 1000,
+              showTipCheck: false,
+              deepConversionBidCheck: false,
+              unitName: dataJson.unitName,
+              unitNameCheck: false,
+              deepConversionType: dataJson.deepConversionType,
+              deepConversionBid: dataJson.deepConversionBid
+            }
+          ]
+
+          this.populationData = dataJson
+          this.populationData.population = dataJson.population ? JSON.parse(dataJson.population) : null
+          this.populationData.excludePopulation = dataJson.population ? JSON.parse(dataJson.excludePopulation) : null
+
+          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.ageMin ? [dataJson.ageMin, dataJson.ageMax] : []
+          this.populationData.agesRange = dataJson.agesRange ? JSON.parse(dataJson.agesRange) : []
+          this.populationData.devicePrice = dataJson.devicePrice ? dataJson.devicePrice : null
+          this.populationData.allForm = {}
+          this.populationData.allForm.regionType =
+            dataJson.region && JSON.parse(dataJson.region).length > 0 ? 'limit' : 'noLimit'
+          postAction('/kuaishou/batch/getRegionDetail', { regionArr: dataJson.region }).then(res => {
+            console.log(res)
+            if (res.success) {
+              this.populationData.allForm.region = res.result
+            }
+          })
+
+          this.populationData.allForm.ageType = dataJson.agesRange
+            ? 'ageLimit'
+            : dataJson.ageMin
+            ? 'ageCustom'
+            : 'noLimit'
+          this.populationData.allForm.device = dataJson.deviceBrand ? '1' : '0'
+          this.populationData.allForm.price = dataJson.devicePrice ? '1' : '0'
+          this.populationData.allForm.appType = dataJson.appInterest ? '1' : dataJson.appIds ? '2' : '0'
+          this.populationData.allForm.fansStar = dataJson.fansStar ? '1' : '0'
+          this.populationData.allForm.interestVideo = dataJson.interestVideo ? '1' : '0'
+          this.populationData.allForm.platform_os = dataJson.platformOs + ''
+          this.populationData.allForm.businessInterestType = dataJson.businessInterest ? '2' : '0'
+          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.$nextTick(() => {
+            this.form.setFieldsValue(pick(dataJson, ['appId', 'urlType', 'url', 'dayBudget', 'speed', 'showMode']))
+          })
+        }
+      })
+    },
+    handleCancel(e) {
+      this.visible = false
+    },
+    handleSubmit(e) {
+      //   this.$refs.population.handleSubmit()
+      e.preventDefault()
+      this.$refs.population.handleSubmit()
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          this.loading = true
+          var groupArr = this.allForm.group.map(item => {
+            return {
+              ...item,
+              cpaBid: item.cpaBid != '' ? item.cpaBid * 1000 : '',
+              bid: item.bid != '' ? item.bid * 1000 : '',
+              deepConversionBid: item.deepConversionBid != '' ? item.deepConversionBid * 1000 : '',
+              ocpxActionType: item.bidType,
+              bidType: item.bidType == '1' ? '2' : '6'
+            }
+          })[0]
+          var json = { ...values, sceneId: [values.sceneId], dayBudget: values.dayBudget * 1000 }
+          var params = {
+            ...this.populationData,
+            ...json,
+            ...groupArr,
+            accountId: localStorage.getItem('accountId'),
+            unitId: this.unitId,
+            unitType: 4,
+            beginTime: moment(this.timeRange[0]).format('YYYY-MM-DD'),
+            endTime: this.allForm.time == '2' ? moment(this.timeRange[1]).format('YYYY-MM-DD') : '',
+            scheduleTime: this.allForm.scheduleTimeData
+          }
+
+          if (this.checkedTrue) {
+            var data = this.populationData
+            postAction('/kuaishou/batch/addDirectionalTemplate', {
+              accountId: localStorage.getItem('accountId'),
+              templateName: this.nameValue,
+              templateContent: JSON.stringify(this.populationData)
+            }).then(res => {})
+          }
+          postAction('/kuaishou/batch/updateUnit', params).then(res => {
+            if (res.result.code == 0) {
+              this.visible = false
+              this.$emit('getList', localStorage.getItem('advertisingGroupKey'))
+              this.loading = false
+            } else {
+              this.loading = false
+            }
+          })
+        }
+      })
+    },
+    onChange(value) {
+      console.log(value)
+    },
+    handleChange(value) {
+      //   this.$refs.population.getAppList(value)
+    },
+    handleChangeMould(value) {
+      if (value) {
+        this.populationData = JSON.parse(
+          this.dataList.filter(item => {
+            return item.id == value
+          })[0].templateContent
+        )
+      } else {
+        this.populationData = {}
+      }
+    },
+    getPlatForm(appId) {
+      if (appId) {
+        var data = this.appList.filter(item => {
+          return item.appId == appId
+        })
+        return data[0].platform
+      }
+    },
+    handleBlur() {
+      console.log('blur')
+    },
+    handleFocus() {
+      console.log('focus')
+    },
+    filterOption(input, option) {
+      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+    },
+    prevStep() {
+      this.$emit('prevStep', this.campaignId ? this.campaignId : localStorage.getItem('campaignId'))
+    },
+    getMould() {
+      let params = {}
+      params.accountId = localStorage.getItem('accountId')
+      getAction('/kuaishou/batch/getDirectionalTemplate', params).then(res => {
+        console.log(res)
+        if (res.success) {
+          this.dataList = res.result.map((item, index) => {
+            return {
+              ...item,
+              key: index
+            }
+          })
+        }
+      })
+    },
+
+    getAppList() {
+      let params = {}
+      params.accountId = localStorage.getItem('accountId')
+      getAction('/kuaishou/batch/getAppList', params).then(res => {
+        if (res.success) {
+          this.appList = res.result.map((item, index) => {
+            return {
+              ...item,
+              key: index
+            }
+          })
+        }
+      })
+    },
+    getPeople(e) {
+      console.log(e.target.value)
+      if (e.target.value == 3) {
+        getAction('/kuaishou/batch/getPopulationList', { accountId: localStorage.getItem('accountId') }).then(res => {
+          if (res.success) {
+            this.data = res.result.map((item, index) => {
+              return {
+                ...item,
+                key: index
+              }
+            })
+          }
+        })
+      }
+    },
+    getCampaignList() {
+      var params = {}
+      params.accountId = localStorage.getItem('accountId')
+      params.campaignId = this.campaignId ? this.campaignId : localStorage.getItem('campaignId')
+      getAction('/kuaishou/batch/getCampaignList', params).then(res => {
+        if (res.success) {
+          this.campaignType = res.result.records[0].campaignType
+        }
+      })
+    },
+    getData(className) {
+      return this.form.getFieldValue(className)
+    }
+  },
+  mounted: function() {
+    this.getAppList()
+    this.getCampaignList()
+    this.getMould()
+    getAction('/kuaishou/batch/getIsActivate', { accountId: localStorage.getItem('accountId') }).then(res => {
+      if (res.success) {
+        this.allForm.groupTypeData = res.result
+      }
+    })
+    getAction('/kuaishou/batch/getProjectMaxBid', { accountId: localStorage.getItem('accountId') }).then(res => {
+      if (res.success) {
+        this.maxBid = res.result / 1000
+      }
+    })
+  }
+}
+</script>

+ 2 - 3
src/views/modules/kuaishouapp/account/newMould.vue

@@ -45,7 +45,7 @@
         </span>
       </a-table>
     </a-row>
-    <a-modal v-model="visible" title="广告组创建信息" :width="900" v-if="visible">
+    <a-modal v-model="visible" title="广告组创建信息" :width="900" v-if="visible" :maskClosable="false">
       <a-form-item
         label="模板名称"
         :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
@@ -273,7 +273,7 @@ export default {
       this.visible = true
     },
     handleDelete(id) {
-      deleteAction('/kuaishou/batch/deleteeditDirectionalTemplate', { id: id }).then(res => {
+      deleteAction('/kuaishou/batch/deleteDirectionalTemplate', { id: id }).then(res => {
         if (res.success) {
           this.$message.success('删除成功')
           this.addUser()
@@ -289,7 +289,6 @@ export default {
       params.accountId = this.appId + ''
       if (this.appId) {
         getAction('/kuaishou/batch/getDirectionalTemplate', params).then(res => {
-          console.log(res)
           if (res.success) {
             this.dataList = res.result.map((item, index) => {
               return {

+ 5 - 154
src/views/modules/kuaishouapp/account/stepForm/Step2.vue

@@ -62,7 +62,6 @@
         <a-radio-group
           buttonStyle="solid"
           v-decorator="['urlType', { rules: [{ required: true, message: '请选择目标应用' }], initialValue: '1' }]"
-          @change="getPeople"
         >
           <a-radio-button value="1">淘宝商品</a-radio-button>
           <a-radio-button value="2">淘客商品</a-radio-button>
@@ -81,115 +80,6 @@
           v-decorator="['url', { rules: [{ required: true, message: ' ' }, { validator: handleConfirmValue }] }]"
         />
       </a-form-item>
-      <a-form-item
-        label="自定义人群"
-        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
-        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
-      >
-        <a-radio-group buttonStyle="solid" v-model="people" @change="getPeople">
-          <a-radio-button value="2">不限</a-radio-button>
-          <a-radio-button value="3">定向人群</a-radio-button>
-          <!-- <a-radio-button value="4">付费人群</a-radio-button> -->
-        </a-radio-group>
-      </a-form-item>
-      <a-form-item
-        v-if="people == '3'"
-        label="定向逻辑"
-        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
-        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
-      >
-        <a-radio-group buttonStyle="solid" v-model="targeted" @change="radioChange">
-          <a-radio-button value="2">定向</a-radio-button>
-          <a-radio-button value="3">排除</a-radio-button>
-          <a-radio-button value="4">同时定向排除</a-radio-button>
-        </a-radio-group>
-        <div
-          :style="{
-            border: targeted == '4' ? '1px solid #f2f2f2' : '0',
-            padding: targeted == '4' ? '20px' : '0'
-          }"
-        >
-          <div style="display:flex;margin-top:15px">
-            <span style="white-space:nowrap;width:10%" v-if="targeted == '4'">定向池:</span>
-            <a-input
-              placeholder="请至少选择一个自定义人群"
-              @focus="
-                topMiddle = true
-                topMiddleNo = false
-              "
-              v-model="keyValue"
-            />
-          </div>
-
-          <div
-            style="background:white;padding:10px;box-shadow: 0 2px 8px 0 rgba(0,0,0,.15);"
-            :style="{ width: targeted == '4' ? '90%' : '100%', marginLeft: targeted == '4' ? '10%' : '0' }"
-            v-if="topMiddle"
-          >
-            <a-input placeholder="请输入搜索内容" />
-            <a-table
-              :columns="columns"
-              :dataSource="data"
-              bordered
-              :pagination="false"
-              :scroll="{ y: 300 }"
-              :rowSelection="{
-                selectedRowKeys: selectedRowKeys,
-                onChange: onSelectChange,
-                getCheckboxProps: getCheckboxProps
-              }"
-            >
-              <span slot="orientationName" slot-scope="text, record">{{ text }}({{ record.orientationId }})</span>
-              <span slot="populationType" slot-scope="text">{{ text | population_type }}</span>
-              <span slot="createTime" slot-scope="text">{{ text | getDate }}</span>
-            </a-table>
-            <div style="text-align:right">
-              <a-button style="margin-right:5px" @click="topMiddle = false">取消</a-button>
-              <a-button type="primary" @click="okSelect">确定</a-button>
-            </div>
-          </div>
-          <div style="display:flex;margin-top:15px">
-            <span style="white-space:nowrap;width:10%" v-if="targeted == '4'">排除池:</span>
-            <a-input
-              placeholder="请至少选择一个自定义人群"
-              @focus="
-                topMiddleNo = true
-                topMiddle = false
-              "
-              v-model="keyValueNo"
-              v-if="targeted == '4'"
-            />
-          </div>
-
-          <div
-            style="background:white;padding:10px;box-shadow: 0 2px 8px 0 rgba(0,0,0,.15);"
-            :style="{ width: targeted == '4' ? '90%' : '100%', marginLeft: targeted == '4' ? '10%' : '0' }"
-            v-if="topMiddleNo"
-          >
-            <a-input placeholder="请输入搜索内容" />
-            <a-table
-              :columns="columns"
-              :dataSource="data"
-              bordered
-              :pagination="false"
-              :scroll="{ y: 300 }"
-              :rowSelection="{
-                selectedRowKeys: selectedRowKeysNo,
-                onChange: onSelectChangeNo,
-                getCheckboxProps: getCheckboxPropsNo
-              }"
-            >
-              <span slot="orientationName" slot-scope="text, record">{{ text }}({{ record.orientationId }})</span>
-              <span slot="populationType" slot-scope="text">{{ text | population_type }}</span>
-              <span slot="createTime" slot-scope="text">{{ text | getDate }}</span>
-            </a-table>
-            <div style="text-align:right">
-              <a-button style="margin-right:5px" @click="topMiddleNo = false">取消</a-button>
-              <a-button type="primary" @click="okSelectNo">确定</a-button>
-            </div>
-          </div>
-        </div>
-      </a-form-item>
       <div style="text-align:center;font-size:16px;margin-bottom:10px">
         目标人群
       </div>
@@ -655,28 +545,6 @@ export default {
         4: 'iOS网页游戏'
       }
       return data[str]
-    },
-    population_type(str) {
-      var data = {
-        1: '上传人群',
-        2: '广告人群',
-        3: '主题专区',
-        4: '逻辑规则',
-        5: '人群扩展',
-        6: '平台定制',
-        7: '定制付费',
-        8: '网红粉丝类别',
-        9: '内容付费行为',
-        10: '移动应用安装',
-        11: '快手使用活跃度',
-        12: '行业分类',
-        13: '商业兴趣',
-        14: '固化标签',
-        15: '行业偏好',
-        16: '第三方标签',
-        17: '产品关键词'
-      }
-      return data[str]
     }
   },
   methods: {
@@ -888,27 +756,7 @@ export default {
               bidType: item.bidType == '1' ? '2' : '6'
             }
           })
-          var jsonData = {}
-          if (this.targeted == '2') {
-            jsonData.population = this.selectedRowKeysValue.map(item => {
-              return item.orientationId
-            })
-          } else if (this.targeted == '3') {
-            jsonData.excludePopulation = this.selectedRowKeysValueNo.map(item => {
-              return item.orientationId
-            })
-          } else if (this.targeted == '4') {
-            jsonData.population = this.selectedRowKeysValue.map(item => {
-              return item.orientationId
-            })
-            jsonData.excludePopulation = this.selectedRowKeysValueNo.map(item => {
-              return item.orientationId
-            })
-          } else {
-            jsonData = {}
-          }
-          console.log('Received values of form: ', values)
-          var json = { ...values, sceneId: [values.sceneId], dayBudget: values.dayBudget * 1000, ...jsonData }
+          var json = { ...values, sceneId: [values.sceneId], dayBudget: values.dayBudget * 1000 }
           var params = {
             ...this.populationData,
             ...json,
@@ -918,7 +766,10 @@ export default {
             unitType: 4,
             beginTime: moment(this.timeRange[0]).format('YYYY-MM-DD'),
             endTime: this.allForm.time == '2' ? moment(this.timeRange[1]).format('YYYY-MM-DD') : '',
-            scheduleTime: this.allForm.scheduleTimeData
+            scheduleTime:
+              this.allForm.scheduleTime == '2'
+                ? this.allForm.scheduleTimeData
+                : '000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000'
           }
 
           if (this.checkedTrue) {

+ 2 - 2
src/views/modules/kuaishouapp/account/stepForm/Step3.vue

@@ -95,11 +95,11 @@
             >
               <a-select-option v-for="appModel in appList" :key="appModel.id" :value="appModel.actionBarText">
                 {{ appModel.actionBarText }}
-              </a-select-option>
+              </a-select-option>x
             </a-select>
           </a-form-item>
           <a-form-item
-            label="测链接"
+            label="测链接"
             :labelCol="{ lg: { span: 2 }, sm: { span: 2 } }"
             :wrapperCol="{ lg: { span: 18 }, sm: { span: 18 } }"
           >

+ 29 - 20
src/views/modules/kuaishouapp/account/stepForm/stepModule/selectRegion.vue

@@ -174,19 +174,37 @@ export default {
   computed: {},
   mounted() {
     this.$nextTick(() => {
-      this.getData()
-      if (this.dataValue.length > 0) {
-        this.checkData = this.dataValue
-        this.checkMatched = this.dataValue.map(item => {
-          return item.value
-        })
-        this.checkMatchedCity = this.dataValue.map(item => {
-          return item.value
-        })
-        this.$emit('update:checkData', this.checkData)
-      }
+    //   this.getData()
+    //   if (this.dataValue.length > 0) {
+    //     this.checkData = this.dataValue
+    //     this.checkMatched = this.dataValue.map(item => {
+    //       return item.value
+    //     })
+    //     this.checkMatchedCity = this.dataValue.map(item => {
+    //       return item.value
+    //     })
+    //     this.$emit('update:checkData', this.checkData)
+    //   }
     })
   },
+  watch: {
+    dataValue: {
+      immediate: true, // immediate选项可以开启首次赋值监听
+      handler(n, o) {
+        this.getData()
+        if (n.length > 0) {
+          this.checkData = n
+          this.checkMatched = n.map(item => {
+            return item.value
+          })
+          this.checkMatchedCity = n.map(item => {
+            return item.value
+          })
+          this.$emit('update:checkData', this.checkData)
+        }
+      }
+    }
+  },
   methods: {
     getData() {
       this.loading = true
@@ -374,15 +392,6 @@ export default {
 
       this.$emit('update:checkData', this.checkData)
     }
-  },
-  watch: {
-    checkData: {
-      handler(newName, oldName) {
-        console.log(newName, oldName)
-      },
-      // 代表在wacth里声明了firstName这个方法之后立即先去执行handler方法
-      deep: true
-    }
   }
 }
 </script>

+ 508 - 130
src/views/modules/kuaishouapp/account/stepForm/stepModule/targetedPopulation.vue

@@ -37,6 +37,112 @@ li:hover {
 <template>
   <a-form :form="form" class="module-form" @submit="handleSubmit">
     <a-form-item
+      label="自定义人群"
+      :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+      :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+    >
+      <a-radio-group buttonStyle="solid" v-model="people" @change="getPeople">
+        <a-radio-button value="2">不限</a-radio-button>
+        <a-radio-button value="3">定向人群</a-radio-button>
+        <!-- <a-radio-button value="4">付费人群</a-radio-button> -->
+      </a-radio-group>
+    </a-form-item>
+    <a-form-item
+      v-if="people == '3'"
+      label="定向逻辑"
+      :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+      :wrapperCol="{ lg: { span: 17 }, sm: { span: 17 } }"
+    >
+      <a-radio-group buttonStyle="solid" v-model="targeted" @change="radioChange">
+        <a-radio-button value="2">定向</a-radio-button>
+        <a-radio-button value="3">排除</a-radio-button>
+        <a-radio-button value="4">同时定向排除</a-radio-button>
+      </a-radio-group>
+      <div
+        :style="{
+          border: targeted == '4' ? '1px solid #f2f2f2' : '0',
+          padding: targeted == '4' ? '20px' : '0'
+        }"
+      >
+        <div style="display:flex;margin-top:15px" v-if="targeted == '4' || targeted == '2'">
+          <span style="white-space:nowrap;width:10%" v-if="targeted == '4'">定向池:</span>
+          <a-input
+            placeholder="请至少选择一个自定义人群"
+            @focus="
+              topMiddle = true
+              topMiddleNo = false
+            "
+            v-model="keyValue"
+          />
+        </div>
+
+        <div
+          style="background:white;padding:10px;box-shadow: 0 2px 8px 0 rgba(0,0,0,.15);"
+          :style="{ width: targeted == '4' ? '90%' : '100%', marginLeft: targeted == '4' ? '10%' : '0' }"
+          v-show="topMiddle"
+        >
+          <a-table
+            :columns="columns"
+            :dataSource="dataList"
+            bordered
+            :pagination="false"
+            :scroll="{ y: 300 }"
+            :rowSelection="{
+              selectedRowKeys: selectedRowKeys,
+              onChange: onSelectChange,
+              getCheckboxProps: getCheckboxProps
+            }"
+          >
+            <span slot="orientationName" slot-scope="text, record">{{ text }}({{ record.orientationId }})</span>
+            <span slot="populationType" slot-scope="text">{{ text | population_type }}</span>
+            <span slot="createTime" slot-scope="text">{{ text | getDate }}</span>
+          </a-table>
+          <div style="text-align:right">
+            <a-button style="margin-right:5px" @click="topMiddle = false">取消</a-button>
+            <a-button type="primary" @click="okSelect">确定</a-button>
+          </div>
+        </div>
+        <div style="display:flex;margin-top:15px" v-if="targeted == '4' || targeted == '3'">
+          <span style="white-space:nowrap;width:10%" v-if="targeted == '4'">排除池:</span>
+          <a-input
+            placeholder="请至少选择一个自定义人群"
+            @focus="
+              topMiddleNo = true
+              topMiddle = false
+            "
+            v-model="keyValueNo"
+          />
+        </div>
+
+        <div
+          style="background:white;padding:10px;box-shadow: 0 2px 8px 0 rgba(0,0,0,.15);"
+          :style="{ width: targeted == '4' ? '90%' : '100%', marginLeft: targeted == '4' ? '10%' : '0' }"
+          v-show="topMiddleNo"
+        >
+          <a-table
+            :columns="columns"
+            :dataSource="dataList"
+            bordered
+            :pagination="false"
+            :scroll="{ y: 300 }"
+            :rowSelection="{
+              selectedRowKeys: selectedRowKeysNo,
+              onChange: onSelectChangeNo,
+              getCheckboxProps: getCheckboxPropsNo
+            }"
+          >
+            <span slot="orientationName" slot-scope="text, record">{{ text }}({{ record.orientationId }})</span>
+            <span slot="populationType" slot-scope="text">{{ text | population_type }}</span>
+            <span slot="createTime" slot-scope="text">{{ text | getDate }}</span>
+          </a-table>
+          <div style="text-align:right">
+            <a-button style="margin-right:5px" @click="topMiddleNo = false">取消</a-button>
+            <a-button type="primary" @click="okSelectNo">确定</a-button>
+          </div>
+        </div>
+      </div>
+    </a-form-item>
+    <a-form-item
       label="地区"
       :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
       :wrapperCol="{ lg: { span: 17 }, sm: { span: 17 } }"
@@ -73,13 +179,13 @@ li:hover {
       </a-radio-group>
       <div v-if="allForm.ageType == 'ageLimit'">
         <a-checkbox-group v-decorator="['agesRange', { rules: [{ required: true, message: '请选择年龄段' }] }]">
-          <a-checkbox value="0">0-11岁</a-checkbox>
-          <a-checkbox value="12">12-27岁</a-checkbox>
-          <a-checkbox value="18">18-23岁</a-checkbox>
-          <a-checkbox value="24">24-30岁</a-checkbox>
-          <a-checkbox value="31">31-40岁</a-checkbox>
-          <a-checkbox value="41">41-49岁</a-checkbox>
-          <a-checkbox value="50">50+</a-checkbox>
+          <a-checkbox :value="0">0-11岁</a-checkbox>
+          <a-checkbox :value="12">12-27岁</a-checkbox>
+          <a-checkbox :value="18">18-23岁</a-checkbox>
+          <a-checkbox :value="24">24-30岁</a-checkbox>
+          <a-checkbox :value="31">31-40岁</a-checkbox>
+          <a-checkbox :value="41">41-49岁</a-checkbox>
+          <a-checkbox :value="50">50+</a-checkbox>
         </a-checkbox-group>
       </div>
       <div v-if="allForm.ageType == 'ageCustom'">
@@ -108,13 +214,13 @@ li:hover {
         v-decorator="[
           'gender',
           {
-            initialValue: '0'
+            initialValue: 0
           }
         ]"
       >
-        <a-radio-button value="0">不限</a-radio-button>
-        <a-radio-button value="1">女性</a-radio-button>
-        <a-radio-button value="2">男性</a-radio-button>
+        <a-radio-button :value="0">不限</a-radio-button>
+        <a-radio-button :value="1">女性</a-radio-button>
+        <a-radio-button :value="2">男性</a-radio-button>
       </a-radio-group>
     </a-form-item>
     <a-form-item
@@ -139,15 +245,15 @@ li:hover {
         v-decorator="[
           'androidOsv',
           {
-            initialValue: '3'
+            initialValue: 3
           }
         ]"
       >
-        <a-radio value="3">不限</a-radio>
-        <a-radio value="4">4X+</a-radio>
-        <a-radio value="5">5x+</a-radio>
-        <a-radio value="6">6x+</a-radio>
-        <a-radio value="7">7x+</a-radio>
+        <a-radio :value="3">不限</a-radio>
+        <a-radio :value="4">4X+</a-radio>
+        <a-radio :value="5">5x+</a-radio>
+        <a-radio :value="6">6x+</a-radio>
+        <a-radio :value="7">7x+</a-radio>
       </a-radio-group>
     </a-form-item>
     <a-form-item
@@ -161,15 +267,15 @@ li:hover {
         v-decorator="[
           'iosOsv',
           {
-            initialValue: '6'
+            initialValue: 6
           }
         ]"
       >
-        <a-radio value="6">不限</a-radio>
-        <a-radio value="7">7X+</a-radio>
-        <a-radio value="8">8x+</a-radio>
-        <a-radio value="9">9x+</a-radio>
-        <a-radio value="10">10x+</a-radio>
+        <a-radio :value="6">不限</a-radio>
+        <a-radio :value="7">7X+</a-radio>
+        <a-radio :value="8">8x+</a-radio>
+        <a-radio :value="9">9x+</a-radio>
+        <a-radio :value="10">10x+</a-radio>
       </a-radio-group>
     </a-form-item>
     <a-form-item
@@ -187,17 +293,17 @@ li:hover {
           v-decorator="['deviceBrand', { rules: [{ required: true, message: '请选择设备品牌' }] }]"
           style="width:120%"
         >
-          <a-checkbox value="1">OPPO</a-checkbox>
-          <a-checkbox value="2">VIVO</a-checkbox>
-          <a-checkbox value="3">华为</a-checkbox>
-          <a-checkbox value="4">小米</a-checkbox>
-          <a-checkbox value="5">荣耀</a-checkbox>
-          <a-checkbox value="6">三星</a-checkbox>
-          <a-checkbox value="7">金立</a-checkbox>
-          <a-checkbox value="8">魅族</a-checkbox>
-          <a-checkbox value="9">乐视</a-checkbox>
-          <a-checkbox value="10">其他</a-checkbox>
-          <a-checkbox value="11" v-if="allForm.platform_os == '0'">苹果</a-checkbox>
+          <a-checkbox :value="1">OPPO</a-checkbox>
+          <a-checkbox :value="2">VIVO</a-checkbox>
+          <a-checkbox :value="3">华为</a-checkbox>
+          <a-checkbox :value="4">小米</a-checkbox>
+          <a-checkbox :value="5">荣耀</a-checkbox>
+          <a-checkbox :value="6">三星</a-checkbox>
+          <a-checkbox :value="7">金立</a-checkbox>
+          <a-checkbox :value="8">魅族</a-checkbox>
+          <a-checkbox :value="9">乐视</a-checkbox>
+          <a-checkbox :value="10">其他</a-checkbox>
+          <a-checkbox :value="11" v-if="allForm.platform_os == '0'">苹果</a-checkbox>
         </a-checkbox-group>
       </div>
     </a-form-item>
@@ -215,16 +321,16 @@ li:hover {
           v-decorator="['devicePrice', { rules: [{ required: true, message: '请选择设备价格' }] }]"
           style="width:120%"
         >
-          <a-checkbox value="1">1500以下</a-checkbox>
-          <a-checkbox value="2">1501~2000</a-checkbox>
-          <a-checkbox value="3">2001~2500</a-checkbox>
-          <a-checkbox value="4">2501~3000</a-checkbox>
-          <a-checkbox value="5">3001~3500</a-checkbox>
-          <a-checkbox value="6">3501~4000</a-checkbox>
-          <a-checkbox value="7">4001~4500</a-checkbox>
-          <a-checkbox value="8">4501~5000</a-checkbox>
-          <a-checkbox value="9">5001~5500</a-checkbox>
-          <a-checkbox value="10">5500以上</a-checkbox>
+          <a-checkbox :value="1">1500以下</a-checkbox>
+          <a-checkbox :value="2">1501~2000</a-checkbox>
+          <a-checkbox :value="3">2001~2500</a-checkbox>
+          <a-checkbox :value="4">2501~3000</a-checkbox>
+          <a-checkbox :value="5">3001~3500</a-checkbox>
+          <a-checkbox :value="6">3501~4000</a-checkbox>
+          <a-checkbox :value="7">4001~4500</a-checkbox>
+          <a-checkbox :value="8">4501~5000</a-checkbox>
+          <a-checkbox :value="9">5001~5500</a-checkbox>
+          <a-checkbox :value="10">5500以上</a-checkbox>
         </a-checkbox-group>
       </div>
     </a-form-item>
@@ -344,13 +450,13 @@ li:hover {
         v-decorator="[
           'network',
           {
-            initialValue: '0'
+            initialValue: 0
           }
         ]"
       >
-        <a-radio-button value="0">不限</a-radio-button>
-        <a-radio-button value="1">Wi-Fi</a-radio-button>
-        <a-radio-button value="2">移动网络</a-radio-button>
+        <a-radio-button :value="0">不限</a-radio-button>
+        <a-radio-button :value="1">Wi-Fi</a-radio-button>
+        <a-radio-button :value="2">移动网络</a-radio-button>
       </a-radio-group>
     </a-form-item>
 
@@ -487,6 +593,51 @@ const clickoutside = {
   }
 }
 
+const columns = [
+  {
+    title: '人群',
+    dataIndex: 'orientationName',
+    scopedSlots: { customRender: 'orientationName' },
+    width: 150
+  },
+  {
+    title: '属性',
+    dataIndex: 'populationType',
+    filters: [
+      { text: '上传人群', value: '1' },
+      { text: '广告人群', value: '2' },
+      { text: '主题专区', value: '3' },
+      { text: '逻辑规则', value: '4' },
+      { text: '人群扩展', value: '5' },
+      { text: '平台定制', value: '6' },
+      { text: '定制付费', value: '7' },
+      { text: '网红粉丝类别', value: '8' },
+      { text: '内容付费行为', value: '9' },
+      { text: '移动应用安装', value: '10' },
+      { text: '快手使用活跃度', value: '11' },
+      { text: '行业分类', value: '12' },
+      { text: '商业兴趣', value: '13' },
+      { text: '固化标签', value: '14' },
+      { text: '行业偏好', value: '15' },
+      { text: '第三方标签', value: '16' },
+      { text: '产品关键词', value: '17' }
+    ],
+    onFilter: (value, record) =>
+      record.populationType
+        .toString()
+        .toLowerCase()
+        .includes(value.toLowerCase()),
+    scopedSlots: { customRender: 'populationType' },
+    width: 150
+  },
+  {
+    title: '创建时间',
+    dataIndex: 'createTime',
+    scopedSlots: { customRender: 'createTime' },
+    sorter: (a, b) => a.createTime - b.createTime
+  }
+]
+
 export default {
   name: 'BaseForm',
   components: { selectRegion },
@@ -504,6 +655,48 @@ export default {
     },
     populationData: {}
   },
+  filters: {
+    getDate(value) {
+      let date = new Date(value)
+      let y = date.getFullYear()
+      let MM = date.getMonth() + 1
+      MM = MM < 10 ? '0' + MM : MM
+      let d = date.getDate()
+      d = d < 10 ? '0' + d : d
+      return y + '-' + MM + '-' + d
+    },
+    platform(str) {
+      var data = {
+        1: 'Android应用下载',
+        2: 'Android网页游戏',
+        3: 'iOS应用下载',
+        4: 'iOS网页游戏'
+      }
+      return data[str]
+    },
+    population_type(str) {
+      var data = {
+        1: '上传人群',
+        2: '广告人群',
+        3: '主题专区',
+        4: '逻辑规则',
+        5: '人群扩展',
+        6: '平台定制',
+        7: '定制付费',
+        8: '网红粉丝类别',
+        9: '内容付费行为',
+        10: '移动应用安装',
+        11: '快手使用活跃度',
+        12: '行业分类',
+        13: '商业兴趣',
+        14: '固化标签',
+        15: '行业偏好',
+        16: '第三方标签',
+        17: '产品关键词'
+      }
+      return data[str]
+    }
+  },
   watch: {
     platform(n, o) {
       console.log(n, o)
@@ -519,53 +712,96 @@ export default {
         // this.form.setFieldsValue({ platform_os: '0' })
       }
     },
-    populationData(n, o) {
-      if (n.allForm) {
-        this.allForm = n.allForm
-        this.allForm.noAgeBreak = n.noAgeBreak == '0' ? false : true
-        this.allForm.noGenderBreak = n.noGenderBreak == '0' ? false : true
-        this.allForm.noAreaBreak = n.noAreaBreak == '0' ? false : true
-        this.$nextTick(() => {
-          this.form.setFieldsValue(
-            pick(n, [
-              'businessInterestType',
-              'fansStar',
-              'interestVideo',
-              'appInterest',
-              'gender',
-              'network',
-              'agesRange',
-              'androidOsv',
-              'iosOsv',
-              'deviceBrand',
-              'devicePrice',
-              'businessInterest'
-            ])
-          )
-          //   }, 100)
-          //   setTimeout(() => {
-          //     console.log(this.populationData)
-          //     this.form.setFieldsValue(pick(this.populationData, ['app_interest', 'business_interest']))
-          //   }, 100)
-        })
-      } else {
-        this.form.resetFields()
-        this.allForm = {
-          regionType: 'noLimit',
-          region: [],
-          ageType: 'noLimit',
-          age: [],
-          device: '0',
-          price: '0',
-          appType: '0',
-          fansStar: '0',
-          interestVideo: '0',
-          platform_os: '0',
-          businessInterestType: '0',
-          isOpen: '0',
-          noAgeBreak: false,
-          noGenderBreak: false,
-          noAreaBreak: false
+    populationData: {
+      immediate: true, // immediate选项可以开启首次赋值监听
+      handler(n, oldVal) {
+        console.log(n)
+
+        if (n.allForm) {
+          this.allForm = n.allForm
+          this.allForm.noAgeBreak = n.noAgeBreak == '0' ? false : true
+          this.allForm.noGenderBreak = n.noGenderBreak == '0' ? false : true
+          this.allForm.noAreaBreak = n.noAreaBreak == '0' ? false : true
+          this.selectedRowKeys = n.population ? n.population : []
+          this.selectedRowKeysNo = n.excludePopulation ? n.excludePopulation : []
+
+          this.targeted = n.excludePopulation ? (n.population ? '4' : '3') : '2'
+          this.people = n.excludePopulation ? '3' : n.population ? '3' : '2'
+          this.getPeople().then(res => {
+            if (n.excludePopulation) {
+              this.keyValueNo = ''
+              this.selectedRowKeysValueNo = []
+              for (let i = 0; i < res.length; i++) {
+                for (let j = 0; j < n.excludePopulation.length; j++) {
+                  if (res[i].orientationId == n.excludePopulation[j]) {
+                    this.keyValueNo += res[i].orientationName + '   '
+                    this.selectedRowKeysValueNo.push({
+                      orientationId: res[i].orientationId,
+                      orientationName: res[i].orientationName
+                    })
+                    this.selectedRowKeysNo.push()
+                  }
+                }
+              }
+            }
+            if (n.population) {
+              this.keyValue = ''
+              this.selectedRowKeysValue = []
+              for (let i = 0; i < res.length; i++) {
+                for (let j = 0; j < n.population.length; j++) {
+                  if (res[i].orientationId == n.population[j]) {
+                    this.keyValue += res[i].orientationName + '   '
+                    this.selectedRowKeysValue.push({
+                      orientationId: res[i].orientationId,
+                      orientationName: res[i].orientationName
+                    })
+                  }
+                }
+              }
+            }
+          })
+          this.$nextTick(() => {
+            this.form.setFieldsValue(
+              pick(n, [
+                'fansStar',
+                'interestVideo',
+                'appInterest',
+                'gender',
+                'network',
+                'agesRange',
+                'androidOsv',
+                'iosOsv',
+                'deviceBrand',
+                'devicePrice',
+                'businessInterest'
+              ])
+            )
+          })
+        } else {
+          this.form.resetFields()
+          this.selectedRowKeys = []
+          this.selectedRowKeysNo = []
+          this.selectedRowKeysValueNo = []
+          this.selectedRowKeysValue = []
+          this.targeted = '2'
+          this.people = '2'
+          this.allForm = {
+            regionType: 'noLimit',
+            region: [],
+            ageType: 'noLimit',
+            age: [],
+            device: '0',
+            price: '0',
+            appType: '0',
+            fansStar: '0',
+            interestVideo: '0',
+            platform_os: '0',
+            businessInterestType: '0',
+            isOpen: '0',
+            noAgeBreak: false,
+            noGenderBreak: false,
+            noAreaBreak: false
+          }
         }
       }
     }
@@ -606,7 +842,13 @@ export default {
         isOpen: '0',
         noAgeBreak: false,
         noGenderBreak: false,
-        noAreaBreak: false
+        noAreaBreak: false,
+        people: '2',
+        targeted: '2',
+        topMiddle: false,
+        topMiddleNo: false,
+        keyValue: '',
+        keyValueNo: ''
       },
       options: [],
       optionsAll: [],
@@ -634,11 +876,90 @@ export default {
       getApp: '0',
       closeDialog: false,
       indeterminate: false,
-      checkAll: false
+      checkAll: false,
+      people: '2',
+      targeted: '2',
+      topMiddle: false,
+      topMiddleNo: false,
+      keyValue: '',
+      keyValueNo: '',
+      columns,
+      selectedRowKeys: [],
+      selectedRowKeysValue: [],
+      selectedRowKeysNo: [],
+      selectedRowKeysValueNo: [],
+      dataList: []
     }
   },
   computed: {},
   methods: {
+    getPeople() {
+      return new Promise((resolve, reject) => {
+        getAction('/kuaishou/batch/getPopulationList', { accountId: localStorage.getItem('accountId') }).then(res => {
+          if (res.success) {
+            console.log(res)
+            this.dataList = res.result.map((item, index) => {
+              return {
+                ...item,
+                key: index
+              }
+            })
+            resolve(res.result)
+          }
+        })
+      })
+    },
+    radioChange() {
+      this.selectedRowKeys = []
+      this.selectedRowKeysValue = []
+      this.selectedRowKeysNo = []
+      this.selectedRowKeysValueNo = []
+      this.keyValue = ''
+      this.keyValueNo = ''
+    },
+    onSelectChange(selectedRowKeys, selectionRows) {
+      this.selectedRowKeys = selectedRowKeys
+      console.log(selectionRows)
+      this.selectedRowKeysValue = selectionRows.map(item => {
+        return { orientationId: item.orientationId, orientationName: item.orientationName }
+      })
+    },
+    getCheckboxProps(record) {
+      return {
+        props: {
+          disabled: this.selectedRowKeysValueNo.some(item => item.orientationId === record.orientationId)
+        }
+      }
+    },
+    onSelectChangeNo(selectedRowKeys, selectionRows) {
+      this.selectedRowKeysNo = selectedRowKeys
+      console.log(selectionRows)
+      this.selectedRowKeysValueNo = selectionRows.map(item => {
+        return { orientationId: item.orientationId, orientationName: item.orientationName }
+      })
+    },
+    getCheckboxPropsNo(record) {
+      return {
+        props: {
+          disabled: this.selectedRowKeysValue.some(item => item.orientationId === record.orientationId)
+        }
+      }
+    },
+    okSelect() {
+      this.keyValue = ''
+      this.topMiddle = false
+      for (let i = 0; i < this.selectedRowKeysValue.length; i++) {
+        this.keyValue += this.selectedRowKeysValue[i].orientationName + '   '
+      }
+    },
+    okSelectNo() {
+      this.keyValueNo = ''
+      this.topMiddleNo = false
+      for (let i = 0; i < this.selectedRowKeysValueNo.length; i++) {
+        this.keyValueNo += this.selectedRowKeysValueNo[i].orientationName + '   '
+      }
+    },
+
     getAge(e) {
       this.allForm.noAgeBreak = e.target.checked
     },
@@ -726,6 +1047,7 @@ export default {
     },
     handleSubmit() {
       //   e.preventDefault()
+      console.log(this.selectedRowKeysValue)
       this.form.validateFields((err, values) => {
         if (!err) {
           console.log('Received values of form: ', values)
@@ -739,6 +1061,25 @@ export default {
               return item.value
             })
           }
+          var jsonData = {}
+          if (this.targeted == '2') {
+            jsonData.population = this.selectedRowKeysValue.map(item => {
+              return item.orientationId
+            })
+          } else if (this.targeted == '3') {
+            jsonData.excludePopulation = this.selectedRowKeysValueNo.map(item => {
+              return item.orientationId
+            })
+          } else if (this.targeted == '4') {
+            jsonData.population = this.selectedRowKeysValue.map(item => {
+              return item.orientationId
+            })
+            jsonData.excludePopulation = this.selectedRowKeysValueNo.map(item => {
+              return item.orientationId
+            })
+          } else {
+            jsonData = {}
+          }
           var dataJson = {
             ...values,
             platformOs: this.allForm.platform_os,
@@ -748,7 +1089,8 @@ export default {
             noAgeBreak: this.allForm.noAgeBreak ? 1 : 0,
             noGenderBreak: this.allForm.noGenderBreak ? 1 : 0,
             noAreaBreak: this.allForm.noAreaBreak ? 1 : 0,
-            allForm: this.allForm
+            allForm: this.allForm,
+            ...jsonData
           }
           console.log(dataJson)
           this.$emit('update:populationData', dataJson)
@@ -854,44 +1196,80 @@ export default {
       return this.form.getFieldValue(className)
     }
   },
-
   mounted: function() {
     this.getDataType('APP_INTEREST', 'optionsAppActive')
     this.getDataType('BUSINESS_INTEREST', 'businessOptions')
     this.getDataType('FANS_STAR', 'fansStarOptions')
     this.getDataType('INTEREST_VIDEO', 'interestVideoOptions')
-    if (this.populationData.allForm) {
-      this.allForm = this.populationData.allForm
-      this.allForm.noAgeBreak = this.allForm.noAgeBreak == '0' ? false : true
-      this.allForm.noGenderBreak = this.allForm.noGenderBreak == '0' ? false : true
-      this.allForm.noAreaBreak = this.allForm.noAreaBreak == '0' ? false : true
-      this.$nextTick(() => {
-        //   setTimeout(() => {
-        console.log(this.populationData)
 
-        this.form.setFieldsValue(
-          pick(this.populationData, [
-            'businessInterestType',
-            'fansStar',
-            'interestVideo',
-            'appInterest',
-            'gender',
-            'network',
-            'agesRange',
-            'androidOsv',
-            'iosOsv',
-            'deviceBrand',
-            'devicePrice',
-            'businessInterest'
-          ])
-        )
-        //   }, 100)
-        //   setTimeout(() => {
-        //     console.log(this.populationData)
-        //     this.form.setFieldsValue(pick(this.populationData, ['app_interest', 'business_interest']))
-        //   }, 100)
-      })
-    }
+    // if (this.populationData.allForm) {
+    //   this.allForm = this.populationData.allForm
+    //   this.allForm.noAgeBreak = this.allForm.noAgeBreak == '0' ? false : true
+    //   this.allForm.noGenderBreak = this.allForm.noGenderBreak == '0' ? false : true
+    //   this.allForm.noAreaBreak = this.allForm.noAreaBreak == '0' ? false : true
+
+    //   this.selectedRowKeys = this.populationData.population ? this.populationData.population : []
+    //   this.selectedRowKeysNo = this.populationData.excludePopulation ? this.populationData.excludePopulation : []
+    //   this.selectedRowKeysValueNo = []
+    //   this.selectedRowKeysValue = []
+    //   this.keyValueNo = ''
+    //   this.targeted = this.populationData.excludePopulation ? (this.populationData.population ? '4' : '3') : '2'
+    //   this.people = this.populationData.excludePopulation ? '3' : this.populationData.population ? '3' : '2'
+    //   this.getPeople().then(res => {
+    //     if (this.populationData.excludePopulation) {
+    //       for (let i = 0; i < res.length; i++) {
+    //         for (let j = 0; j < this.populationData.excludePopulation.length; j++) {
+    //           if (res[i].orientationId == this.populationData.excludePopulation[j]) {
+    //             this.keyValueNo += res[i].orientationName + '   '
+    //             this.selectedRowKeysValueNo.push({
+    //               orientationId: res[i].orientationId,
+    //               orientationName: res[i].orientationName
+    //             })
+    //           }
+    //         }
+    //       }
+    //     }
+    //     if (this.populationData.population) {
+    //       for (let i = 0; i < res.length; i++) {
+    //         for (let j = 0; j < this.populationData.population.length; j++) {
+    //           if (res[i].orientationId == this.populationData.population[j]) {
+    //             this.keyValue += res[i].orientationName + '   '
+    //             this.selectedRowKeysValue.push({
+    //               orientationId: res[i].orientationId,
+    //               orientationName: res[i].orientationName
+    //             })
+    //           }
+    //         }
+    //       }
+    //     }
+    //   })
+
+    //   this.$nextTick(() => {
+    //     //   setTimeout(() => {
+
+    //     this.form.setFieldsValue(
+    //       pick(this.populationData, [
+    //         'businessInterestType',
+    //         'fansStar',
+    //         'interestVideo',
+    //         'appInterest',
+    //         'gender',
+    //         'network',
+    //         'agesRange',
+    //         'androidOsv',
+    //         'iosOsv',
+    //         'deviceBrand',
+    //         'devicePrice',
+    //         'businessInterest'
+    //       ])
+    //     )
+    //     //   }, 100)
+    //     //   setTimeout(() => {
+    //     //     console.log(this.populationData)
+    //     //     this.form.setFieldsValue(pick(this.populationData, ['app_interest', 'business_interest']))
+    //     //   }, 100)
+    //   })
+    // }
   }
 }
 </script>

+ 24 - 12
src/views/modules/kuaishouapp/account/stepForm/stepModule/test.vue

@@ -38,11 +38,15 @@ export default {
   name: 'calendar-table',
   props: {
     scheduleTime: {
-      type: String
+      type: String,
+      default() {
+        return '000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000'
+      }
     }
   },
   data() {
     return {
+      show: false,
       numData: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23],
       dateTime: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
       timeData: [
@@ -84,17 +88,17 @@ export default {
     }
   },
   methods: {
-    handleClose(item) {
-      var index = Math.floor(item / 24)
-      var key = item % 7
-      if (this.timeData[index].time[key].value == false) {
-        if (this.timeData[index].time[key].isSelected) {
-          this.timeData[index].time[key].isSelected = false
-        } else {
-          this.$set(this.timeData[index].time[key], 'isSelected', true)
-        }
-      }
-    },
+    // handleClose(item) {
+    //   var index = Math.floor(item / 24)
+    //   var key = item % 7
+    //   if (this.timeData[index].time[key].value == false) {
+    //     if (this.timeData[index].time[key].isSelected) {
+    //       this.timeData[index].time[key].isSelected = false
+    //     } else {
+    //       this.$set(this.timeData[index].time[key], 'isSelected', true)
+    //     }
+    //   }
+    // },
     showOne(index, key) {
       //   this.timeData[index].time[key].isSelected = !this.timeData[index].time[key].isSelected
     },
@@ -262,6 +266,14 @@ export default {
         }
       }
     }
+  },
+  watch: {
+    scheduleTime: {
+      immediate: true, // immediate选项可以开启首次赋值监听
+      handler(newVal, oldVal) {
+        this.init()
+      }
+    }
   }
 }
 </script>

+ 109 - 32
src/views/modules/material/materialList.vue

@@ -318,9 +318,10 @@ a {
                     </div>
                     <a href="javascript:;" style="margin-left:20px">驳回</a>
                   </a-popconfirm>
-
-                  <a-popconfirm
-                    @confirm="okEditShow(items, '1')"
+                  <a
+                    @click="okEditShow(items, '1')"
+                    href="javascript:;"
+                    style="margin-left:20px"
                     v-show="active != '1'"
                     v-if="
                       role.roleCode == 'operator' ||
@@ -329,30 +330,9 @@ a {
                         role.roleCode == 'touTiaoOperationManager'
                     "
                   >
-                    <div slot="title">
-                      <div>
-                        广告语:
-                        <a-textarea
-                          placeholder="请输入"
-                          v-model="refuseReason"
-                          :autosize="{ minRows: 3, maxRows: 10 }"
-                        />
-                      </div>
-                    </div>
-                    <a
-                      href="javascript:;"
-                      style="margin-left:20px"
-                      v-show="active != '1'"
-                      v-if="
-                        role.roleCode == 'operator' ||
-                          role.roleCode == 'kuaishouOperationManager' ||
-                          role.roleCode == 'admin' ||
-                          role.roleCode == 'touTiaoOperationManager'
-                      "
-                    >
-                      通过审核</a
-                    >
-                  </a-popconfirm>
+                    通过审核</a
+                  >
+
                   <a-checkbox :value="items.url" v-show="active == '1'" style="float:right"></a-checkbox
                 ></span>
               </div>
@@ -379,6 +359,17 @@ a {
       </a-tab-pane>
     </a-tabs>
     <a-modal title="添加素材" v-model="visible" @ok="handleOk" @cancel="close" :maskClosable="false" :width="800">
+      <template slot="footer">
+        <a-button key="back" @click="close">取消</a-button>
+        <a-button
+          key="submit"
+          type="primary"
+          :disabled="material.filter(item => item == false).length > 0 || urlList.url.length == 0"
+          @click="handleOk"
+        >
+          确定
+        </a-button>
+      </template>
       <a-form :form="form">
         <a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" label="项目选择">
           <a-select
@@ -387,6 +378,9 @@ a {
               { rules: [{ required: true, message: '请选择项目!' }] }
             ]"
             @change="getProjectId"
+            showSearch
+            optionFilterProp="children"
+            :filterOption="filterOption"
           >
             <a-select-option :value="item.projectId" v-for="item of dataElse" :key="item.id">
               {{ item.projectName }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{
@@ -419,6 +413,16 @@ a {
             :dir="activeKey == 'image' ? dirImg : dirVideo"
             @loaded="overUpload"
           ></upload-to-ali>
+          <span v-if="material.filter(item => item == false).length > 0 && urlList.url.length > 0" style="color:red"
+            >上传素材的尺寸不符,请修改(<span v-for="(item, index) of material" :key="index" v-show="!item"
+              >第{{ index + 1 }}张</span
+            >出错)</span
+          >
+          <span
+            v-else-if="urlList.url.length > 0 && material.filter(item => item == false).length == 0"
+            style="color:green"
+            >上传成功</span
+          >
         </a-form-item>
 
         <a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" :label="role.roleName">
@@ -701,7 +705,8 @@ export default {
       key: '0',
       mediaId: null,
       repeat: false,
-      noList: []
+      noList: [],
+      material: []
     }
   },
   filters: {
@@ -1172,10 +1177,82 @@ export default {
     },
     overUpload(urlAll) {
       console.log(urlAll, this.urlList)
-      var index = this.urlList.url.findIndex(item => item === urlAll[0])
-      var data = { url: urlAll[0], code: this.urlList.md5[index], name: this.urlList.name[index] }
-      this.imageArr.push(data)
-      console.log(this.imageArr)
+
+      //   var index = this.urlList.url.findIndex(item => item === urlAll[0])
+      //   var data = { url: urlAll[0], code: this.urlList.md5[index], name: this.urlList.name[index] }
+      //   this.imageArr.push(data)
+      //   console.log(this.imageArr)
+      var that = this
+      var img = null
+      img = new Image()
+      that.material = []
+      for (let i = 0; i < this.urlList.url.length; i++) {
+        img.src = this.urlList.url[i]
+        if (img.complete) {
+          // 打印
+          if (img.width == 720) {
+            if (img.height == 1280) {
+              that.material.push(true)
+            } else {
+              that.material.push(false)
+            }
+          } else if (img.width == 1080) {
+            if (img.height == 1920) {
+              that.material.push(true)
+            } else {
+              that.material.push(false)
+            }
+          } else if (img.width == 1280) {
+            if (img.height == 720) {
+              that.material.push(true)
+            } else {
+              that.material.push(false)
+            }
+          } else if (img.width == 1920) {
+            if (img.height == 1080) {
+              that.material.push(true)
+            } else {
+              that.material.push(false)
+            }
+          } else {
+            that.material.push(false)
+          }
+          console.log(this.material)
+        } else {
+          // 加载完成执行
+          img.onload = function() {
+            // 打印
+            // alert('from:onload : width:' + img.width + ',height:' + img.height)
+            if (img.width == 720) {
+              if (img.height == 1280) {
+                that.material.push(true)
+              } else {
+                that.material.push(false)
+              }
+            } else if (img.width == 1080) {
+              if (img.height == 1920) {
+                that.material.push(true)
+              } else {
+                that.material.push(false)
+              }
+            } else if (img.width == 1280) {
+              if (img.height == 720) {
+                that.material.push(true)
+              } else {
+                that.material.push(false)
+              }
+            } else if (img.width == 1920) {
+              if (img.height == 1080) {
+                that.material.push(true)
+              } else {
+                that.material.push(false)
+              }
+            } else {
+              that.material.push(false)
+            }
+          }
+        }
+      }
     },
     file(file) {
       console.log(file)

+ 68 - 0
src/views/modules/material/videoMaterial.vue

@@ -1252,6 +1252,74 @@ export default {
       this.confirmLoading = true
       this.repeat = false
       this.$message.success('上传成功')
+
+      //   var img = null
+      //   img = new Image()
+      //   img.src = urlAll[0]
+      //   if (img.complete) {
+      //     // 打印
+      //     if (img.width == 720) {
+      //       if (img.height == 1280) {
+      //         that.material.push(true)
+      //       } else {
+      //         that.material.push(false)
+      //       }
+      //     } else if (img.width == 1080) {
+      //       if (img.height == 1920) {
+      //         that.material.push(true)
+      //       } else {
+      //         that.material.push(false)
+      //       }
+      //     } else if (img.width == 1280) {
+      //       if (img.height == 720) {
+      //         that.material.push(true)
+      //       } else {
+      //         that.material.push(false)
+      //       }
+      //     } else if (img.width == 1920) {
+      //       if (img.height == 1080) {
+      //         that.material.push(true)
+      //       } else {
+      //         that.material.push(false)
+      //       }
+      //     } else {
+      //       that.material.push(false)
+      //     }
+      //     console.log(this.material)
+      //   } else {
+      //     // 加载完成执行
+      //     img.onload = function() {
+      //       // 打印
+      //       // alert('from:onload : width:' + img.width + ',height:' + img.height)
+      //       if (img.width == 720) {
+      //         if (img.height == 1280) {
+      //           that.material.push(true)
+      //         } else {
+      //           that.material.push(false)
+      //         }
+      //       } else if (img.width == 1080) {
+      //         if (img.height == 1920) {
+      //           that.material.push(true)
+      //         } else {
+      //           that.material.push(false)
+      //         }
+      //       } else if (img.width == 1280) {
+      //         if (img.height == 720) {
+      //           that.material.push(true)
+      //         } else {
+      //           that.material.push(false)
+      //         }
+      //       } else if (img.width == 1920) {
+      //         if (img.height == 1080) {
+      //           that.material.push(true)
+      //         } else {
+      //           that.material.push(false)
+      //         }
+      //       } else {
+      //         that.material.push(false)
+      //       }
+      //     }
+      //   }
     },
     file(file) {
       var bmf = new BMF()