syh пре 5 година
родитељ
комит
38423e8255

+ 2 - 2
src/components/ctop/vm-card.vue

@@ -43,10 +43,10 @@ li {
 }
 </style>
 <template>
-  <div :class="[type === 'horizantal' ? 'vm-card-horizantal' : 'vm-card-vertical' , 'vm-panel']">
+  <div :class="[type === 'horizantal' ? 'vm-card-horizantal' : 'vm-card-vertical' , 'vm-panel']" style="border:1px solid black">
     <div
       class="card-img"
-      style="height:250px"
+      style="height:250px;border-bottom:1px solid #f2f2f2"
       :style="{backgroundImage: img?'url(' +img+')':'url('+noImgUrl+')', backgroundSize:'contain', backgroundRepeat: 'no-repeat',backgroundPosition:'center center'}"
     >
       <!-- <img :src="img" alt="" height="250"> -->

+ 3 - 2
src/components/ctop/vm-image-list.vue

@@ -72,9 +72,10 @@
         </a-row>
       </a-row>
     </a-row>
-    <a-row class="image-list" :gutter="16">
-      <a-col :lg="6" :sm="12" class="vm-margin" v-for="(item,index) of dataShow" :key="index">
+    <a-row class="image-list" :gutter="16" style="padding:0 8px">
+      <a-col :lg="6" :sm="12" class="vm-margin" v-for="(item,index) of dataShow" :key="index" style="padding:0">
         <vm-card
+          style="margin: 0 15px;"
           :editable="true"
           :title="item.name"
           :img="item.coverUrl"

+ 185 - 0
src/views/modules/advertiser/BindAccountLoginList.vue

@@ -0,0 +1,185 @@
+<template>
+  <a-card :bordered="false">
+
+    <!-- 查询区域 -->
+    <div class="table-page-search-wrapper">
+      <a-form layout="inline">
+        <a-row :gutter="24">
+
+          <a-col :md="6" :sm="8">
+            <a-form-item label="账号">
+              <a-input placeholder="请输入账号" v-model="queryParam.accountName"></a-input>
+            </a-form-item>
+          </a-col>
+
+          <a-col :md="6" :sm="8">
+            <a-form-item label="广告主名称">
+              <a-input placeholder="请输入广告主名称" v-model="queryParam.advertiserName"></a-input>
+            </a-form-item>
+          </a-col>
+
+
+          </a-col>
+
+
+          <a-col :md="6" :sm="8">
+            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
+              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
+
+            </span>
+          </a-col>
+
+        </a-row>
+      </a-form>
+    </div>
+
+    <!-- 操作按钮区域 -->
+    <div class="table-operator">
+      <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
+      <a-button type="primary" icon="download" @click="handleExportXls('绑定账号密码')">导出</a-button>
+      <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl"
+                @change="handleImportExcel">
+        <a-button type="primary" icon="import">导入</a-button>
+      </a-upload>
+      <a-dropdown v-if="selectedRowKeys.length > 0">
+        <a-menu slot="overlay">
+          <a-menu-item key="1" @click="batchDel">
+            <a-icon type="delete"/>
+            删除
+          </a-menu-item>
+        </a-menu>
+        <a-button style="margin-left: 8px"> 批量操作
+          <a-icon type="down"/>
+        </a-button>
+      </a-dropdown>
+    </div>
+
+    <!-- table区域-begin -->
+    <div>
+      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
+        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{
+        selectedRowKeys.length }}</a>项
+        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
+      </div>
+
+      <a-table
+        ref="table"
+        size="middle"
+        bordered
+        rowKey="id"
+        :columns="columns"
+        :dataSource="dataSource"
+        :pagination="ipagination"
+        :loading="loading"
+        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+        @change="handleTableChange">
+
+        <span slot="action" slot-scope="text, record">
+          <a @click="handleEdit(record)">编辑</a>
+
+          <a-divider type="vertical"/>
+          <a-dropdown>
+            <a class="ant-dropdown-link">更多 <a-icon type="down"/></a>
+            <a-menu slot="overlay">
+              <a-menu-item>
+                <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
+                  <a>删除</a>
+                </a-popconfirm>
+              </a-menu-item>
+            </a-menu>
+          </a-dropdown>
+        </span>
+
+        <div
+          slot="loginTypeShow"
+          slot-scope="text, record"
+        >{{typeJson[record.loginType]}}</div>
+      </a-table>
+    </div>
+    <!-- table区域-end -->
+
+    <!-- 表单区域 -->
+    <bindAccountLogin-modal ref="modalForm" @ok="modalFormOk"></bindAccountLogin-modal>
+  </a-card>
+</template>
+
+<script>
+  import BindAccountLoginModal from './modules/BindAccountLoginModal'
+  import {JeecgListMixin} from '@/mixins/JeecgListMixin'
+
+  export default {
+    name: "BindAccountLoginList",
+    mixins: [JeecgListMixin],
+    components: {
+      BindAccountLoginModal
+    },
+    data() {
+      return {
+
+        typeJson: {"kuaishou": "快手", "bytedance": "头条"},
+
+        description: '绑定账号密码管理页面',
+        // 表头
+        columns: [
+          {
+            title: '#',
+            dataIndex: '',
+            key: 'rowIndex',
+            width: 60,
+            align: "center",
+            customRender: function (t, r, index) {
+              return parseInt(index) + 1;
+            }
+          },
+          {
+            title: '广告主名称',
+            align: "center",
+            dataIndex: 'advertiserName'
+          },
+          {
+            title: '账号',
+            align: "center",
+            dataIndex: 'accountName'
+          },
+
+          {
+            title: '媒体类型',
+            align: "center",
+            dataIndex: 'loginTypeShow',
+            scopedSlots: { customRender: 'loginTypeShow' },
+          },
+
+          {
+            title: '账号标识',
+            align: "center",
+            dataIndex: 'accountId'
+
+          },
+          {
+            title: '操作',
+            dataIndex: 'action',
+            align: "center",
+            scopedSlots: {customRender: 'action'},
+          }
+        ],
+        url: {
+          list: "/ctop/bindAccountLogin/list",
+          delete: "/ctop/bindAccountLogin/delete",
+          deleteBatch: "/ctop/bindAccountLogin/deleteBatch",
+          exportXlsUrl: "ctop/bindAccountLogin/exportXls",
+          importExcelUrl: "ctop/bindAccountLogin/importExcel",
+        },
+      }
+    },
+    computed: {
+      importExcelUrl: function () {
+        return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
+      }
+    },
+    methods: {}
+  }
+</script>
+<style scoped>
+  @import '~@assets/less/common.less'
+</style>

+ 28 - 37
src/views/modules/advertiser/UserAllocationList.vue

@@ -6,41 +6,31 @@
       <a-form layout="inline">
         <a-row :gutter="24">
 
-          <a-col :md="6" :sm="8">
-            <a-form-item label="登陆人id">
-              <a-input placeholder="请输入登陆人id" v-model="queryParam.userId"></a-input>
-            </a-form-item>
-          </a-col>
-          <a-col :md="6" :sm="8">
-            <a-form-item label="账户id --授权">
-              <a-input placeholder="请输入账户id --授权" v-model="queryParam.accountId"></a-input>
-            </a-form-item>
-          </a-col>
-          <template v-if="toggleSearchStatus">
+
+          <template>
             <a-col :md="6" :sm="8">
               <a-form-item label="广告主ID">
                 <a-input placeholder="请输入广告主ID" v-model="queryParam.advertiserId"></a-input>
               </a-form-item>
             </a-col>
+
+
             <a-col :md="6" :sm="8">
-              <a-form-item label="指定分配人">
-                <a-input placeholder="请输入指定分配人" v-model="queryParam.distributionName"></a-input>
-              </a-form-item>
-            </a-col>
-            <a-col :md="6" :sm="8">
-              <a-form-item label="部门id">
-                <a-input placeholder="请输入部门id" v-model="queryParam.departmentId"></a-input>
+              <a-form-item label="广告主名称">
+                <a-input placeholder="请输入广告主名称" v-model="queryParam.advertiserName"></a-input>
               </a-form-item>
             </a-col>
+
+
           </template>
           <a-col :md="6" :sm="8">
             <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
               <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
               <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
-              <a @click="handleToggleSearch" style="margin-left: 8px">
-                {{ toggleSearchStatus ? '收起' : '展开' }}
-                <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
-              </a>
+              <!-- <a @click="handleToggleSearch" style="margin-left: 8px">
+                 {{ toggleSearchStatus ? '收起' : '展开' }}
+                 <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
+               </a>-->
             </span>
           </a-col>
 
@@ -105,6 +95,12 @@
           </a-dropdown>
         </span>
 
+
+        <div
+          slot="mediaIdShow"
+          slot-scope="text, record"
+        >{{typeArr[record.mediaId]}}</div>
+
       </a-table>
     </div>
     <!-- table区域-end -->
@@ -126,6 +122,8 @@
     },
     data() {
       return {
+        typeArr: ['', '头条', '快手'],
+
         description: '用户分配管理页面',
         // 表头
         columns: [
@@ -141,29 +139,18 @@
           },
 
           {
-            title: '账户id',
-            align: "center",
-            dataIndex: 'accountId'
-          },
-
-          {
             title: '指定分配人',
             align: "center",
             dataIndex: 'distributionName'
           },
 
           {
-            title: '管理员名称',
-            align: "center",
-            dataIndex: 'adminName'
-          },
-          {
             title: '广告主名称',
             align: "center",
             dataIndex: 'advertiserName'
           },
           {
-            title: '输入账号',
+            title: '登录账号',
             align: "center",
             dataIndex: 'accountName'
           },
@@ -172,15 +159,19 @@
             align: "center",
             dataIndex: 'operationName'
           },
+
           {
-            title: '授权称',
+            title: '授权账户昵称',
             align: "center",
             dataIndex: 'authName'
           },
+
           {
             title: '平台类型',
-            align: "center",
-            dataIndex: 'mediaId'
+            align: 'center',
+            dataIndex: 'mediaIdShow',
+            scopedSlots: { customRender: 'mediaIdShow' },
+           // dataIndex: 'mediaId'
           },
           {
             title: '操作',

+ 160 - 0
src/views/modules/advertiser/modules/BindAccountLoginModal.vue

@@ -0,0 +1,160 @@
+<template>
+  <a-modal
+    :title="title"
+    :width="800"
+    :visible="visible"
+    :confirmLoading="confirmLoading"
+    @ok="handleOk"
+    @cancel="handleCancel"
+    cancelText="关闭">
+    
+    <a-spin :spinning="confirmLoading">
+      <a-form :form="form">
+      
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label="广告id">
+          <a-input placeholder="请输入广告id" v-decorator="['advertiserId', {}]" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label="账号">
+          <a-input placeholder="请输入账号" v-decorator="['accountName', {}]" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label="密码">
+          <a-input placeholder="请输入密码" v-decorator="['password', {}]" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label="登录方式">
+          <a-input placeholder="请输入登录方式" v-decorator="['loginType', {}]" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label="1未登陆 2已登陆">
+          <a-input placeholder="请输入1未登陆 2已登陆" v-decorator="['status', {}]" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label="userId">
+          <a-input placeholder="请输入userId" v-decorator="['userId', {}]" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label="用户平台ID">
+          <a-input placeholder="请输入用户平台ID" v-decorator="['accountId', {}]" />
+        </a-form-item>
+		
+      </a-form>
+    </a-spin>
+  </a-modal>
+</template>
+
+<script>
+  import { httpAction } from '@/api/manage'
+  import pick from 'lodash.pick'
+  import moment from "moment"
+
+  export default {
+    name: "BindAccountLoginModal",
+    data () {
+      return {
+        title:"操作",
+        visible: false,
+        model: {},
+        labelCol: {
+          xs: { span: 24 },
+          sm: { span: 5 },
+        },
+        wrapperCol: {
+          xs: { span: 24 },
+          sm: { span: 16 },
+        },
+
+        confirmLoading: false,
+        form: this.$form.createForm(this),
+        validatorRules:{
+        },
+        url: {
+          add: "/ctop/bindAccountLogin/add",
+          edit: "/ctop/bindAccountLogin/edit",
+        },
+      }
+    },
+    created () {
+    },
+    methods: {
+      add () {
+        this.edit({});
+      },
+      edit (record) {
+        this.form.resetFields();
+        this.model = Object.assign({}, record);
+        this.visible = true;
+        this.$nextTick(() => {
+          this.form.setFieldsValue(pick(this.model,'advertiserId','accountName','password','loginType','status','userId','accountId'))
+		  //时间格式化
+        });
+
+      },
+      close () {
+        this.$emit('close');
+        this.visible = false;
+      },
+      handleOk () {
+        const that = this;
+        // 触发表单验证
+        this.form.validateFields((err, values) => {
+          if (!err) {
+            that.confirmLoading = true;
+            let httpurl = '';
+            let method = '';
+            if(!this.model.id){
+              httpurl+=this.url.add;
+              method = 'post';
+            }else{
+              httpurl+=this.url.edit;
+               method = 'put';
+            }
+            let formData = Object.assign(this.model, values);
+            //时间格式化
+            
+            console.log(formData)
+            httpAction(httpurl,formData,method).then((res)=>{
+              if(res.success){
+                that.$message.success(res.message);
+                that.$emit('ok');
+              }else{
+                that.$message.warning(res.message);
+              }
+            }).finally(() => {
+              that.confirmLoading = false;
+              that.close();
+            })
+
+
+
+          }
+        })
+      },
+      handleCancel () {
+        this.close()
+      },
+
+
+    }
+  }
+</script>
+
+<style lang="less" scoped>
+
+</style>

+ 167 - 0
src/views/modules/advertiser/modules/BindAccountLoginModal__Style#Drawer.vue

@@ -0,0 +1,167 @@
+<template>
+  <a-drawer
+      :title="title"
+      :width="800"
+      placement="right"
+      :closable="false"
+      @close="close"
+      :visible="visible"
+  >
+
+    <a-spin :spinning="confirmLoading">
+      <a-form :form="form">
+      
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label="广告id">
+          <a-input placeholder="请输入广告id" v-decorator="['advertiserId', {}]" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label="账号">
+          <a-input placeholder="请输入账号" v-decorator="['accountName', {}]" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label="密码">
+          <a-input placeholder="请输入密码" v-decorator="['password', {}]" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label="登录方式">
+          <a-input placeholder="请输入登录方式" v-decorator="['loginType', {}]" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label="1未登陆 2已登陆">
+          <a-input placeholder="请输入1未登陆 2已登陆" v-decorator="['status', {}]" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label="userId">
+          <a-input placeholder="请输入userId" v-decorator="['userId', {}]" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label="用户平台ID">
+          <a-input placeholder="请输入用户平台ID" v-decorator="['accountId', {}]" />
+        </a-form-item>
+		
+      </a-form>
+    </a-spin>
+    <a-button type="primary" @click="handleOk">确定</a-button>
+    <a-button type="primary" @click="handleCancel">取消</a-button>
+  </a-drawer>
+</template>
+
+<script>
+  import { httpAction } from '@/api/manage'
+  import pick from 'lodash.pick'
+  import moment from "moment"
+
+  export default {
+    name: "BindAccountLoginModal",
+    data () {
+      return {
+        title:"操作",
+        visible: false,
+        model: {},
+        labelCol: {
+          xs: { span: 24 },
+          sm: { span: 5 },
+        },
+        wrapperCol: {
+          xs: { span: 24 },
+          sm: { span: 16 },
+        },
+
+        confirmLoading: false,
+        form: this.$form.createForm(this),
+        validatorRules:{
+        },
+        url: {
+          add: "/ctop/bindAccountLogin/add",
+          edit: "/ctop/bindAccountLogin/edit",
+        },
+      }
+    },
+    created () {
+    },
+    methods: {
+      add () {
+        this.edit({});
+      },
+      edit (record) {
+        this.form.resetFields();
+        this.model = Object.assign({}, record);
+        this.visible = true;
+        this.$nextTick(() => {
+          this.form.setFieldsValue(pick(this.model,'advertiserId','accountName','password','loginType','status','userId','accountId'))
+		  //时间格式化
+        });
+
+      },
+      close () {
+        this.$emit('close');
+        this.visible = false;
+      },
+      handleOk () {
+        const that = this;
+        // 触发表单验证
+        this.form.validateFields((err, values) => {
+          if (!err) {
+            that.confirmLoading = true;
+            let httpurl = '';
+            let method = '';
+            if(!this.model.id){
+              httpurl+=this.url.add;
+              method = 'post';
+            }else{
+              httpurl+=this.url.edit;
+               method = 'put';
+            }
+            let formData = Object.assign(this.model, values);
+            //时间格式化
+            
+            console.log(formData)
+            httpAction(httpurl,formData,method).then((res)=>{
+              if(res.success){
+                that.$message.success(res.message);
+                that.$emit('ok');
+              }else{
+                that.$message.warning(res.message);
+              }
+            }).finally(() => {
+              that.confirmLoading = false;
+              that.close();
+            })
+
+
+
+          }
+        })
+      },
+      handleCancel () {
+        this.close()
+      },
+
+
+    }
+  }
+</script>
+
+<style lang="less" scoped>
+/** Button按钮间距 */
+  .ant-btn {
+    margin-left: 30px;
+    margin-bottom: 30px;
+    float: right;
+  }
+</style>

+ 56 - 19
src/views/modules/bytedance/model/InternalModel.vue

@@ -12,7 +12,7 @@
             optionFilterProp="children"
             style="width: 200px"
           >
-            <a-select-option v-for="user in userList" :key="user.id" :value="user.id">{{user.accountName}}</a-select-option>
+            <a-select-option v-for="user in userList" :key="user.accountId" :value="user.accountId">{{user.accountName}}</a-select-option>
           </a-select>
       </a-form-item>
 
@@ -57,19 +57,6 @@
         </a-select>
       </a-form-item>
 
-
-      <!--<a-form-item
-        label="广告类别"
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol">
-        <a-radio-group v-model="adCategory">
-          <a-radio-button value="1">售卖</a-radio-button>
-          <a-radio-button value="2">换量</a-radio-button>
-          <a-radio-button value="4">配送</a-radio-button>
-          <a-radio-button value="5">内广</a-radio-button>
-          <a-radio-button value="7">补量</a-radio-button>
-        </a-radio-group>
-      </a-form-item>-->
       <a-form-item
         label="投放目标"
         :labelCol="labelCol"
@@ -144,8 +131,8 @@
           optionFilterProp="children"
           style="width: 200px"
         >
-          <a-select-option value="AD_CONVERT_TYPE_INSTALL_FINISH">安装完成</a-select-option>
-          <a-select-option value="AD_CONVERT_TYPE_DOWNLOAD_FINiSH">下载完成</a-select-option>
+          <a-select-option value="15">安装完成</a-select-option>
+          <a-select-option value="4">下载完成</a-select-option>
         </a-select>
       </a-form-item>
 
@@ -273,6 +260,27 @@
         </a-select>
       </a-form-item>
 
+      <a-form-item label="创意方式" :labelCol="labelCol" :wrapperCol="wrapperCol">
+        <a-radio-group v-model="creativeType">
+          <a-radio-button value="customize">自定义创意</a-radio-button>
+          <a-radio-button value="program">程序化创意</a-radio-button>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item label="素材添加方式" :labelCol="labelCol" :wrapperCol="wrapperCol">
+        <a-radio-group v-model="materialAddType">
+          <a-radio-button value="customize">自定义上传</a-radio-button>
+          <!--<a-radio-button value="program">程序化创意</a-radio-button>-->
+        </a-radio-group>
+      </a-form-item>
+      <material :creativeType.sync="creativeType" :accountId.sync="accountId" ref="material"></material>
+
+      <a-form-item label="应用下载详情页" :labelCol="labelCol" :wrapperCol="wrapperCol">
+        <a-input v-model="webUrl"></a-input>
+      </a-form-item>
+      <a-form-item label="应用名" :labelCol="labelCol" :wrapperCol="wrapperCol">
+        <a-input v-model="appName"></a-input>
+      </a-form-item>
+
       <a-form-item
         label="迭代数量"
         :labelCol="labelCol"
@@ -294,10 +302,12 @@
 
 <script>
   import {deleteAction, postAction, getAction} from '@/api/manage'
+  import UploadToAli from '@femessage/upload-to-ali'
   import pick from 'lodash.pick'
   import jq from 'jquery'
   import moment from 'moment';
   import AFormItem from "ant-design-vue/es/form/FormItem";
+  import material from '../../../template/creative/modules/material'
 
   let dateQuantumRangeConst = '';
   export default {
@@ -305,6 +315,10 @@
     components: {AFormItem},
     data() {
       return {
+        webUrl:'',
+        appName:'',
+        creativeType:'customize',
+        materialAddType:'customize',
         userOrientationId:null,
         userOrientationList:[],
         loading:false,
@@ -380,16 +394,21 @@
           userAllocationList:'/template/bind/login/list',
           dictListUrl: 'toutiao/dictitem/list',
           insertUrl: 'test/create',
-          convertList:'template/convert/list/url/ng',
+          convertList:'template/convert/list/url',
           userOrentationList:'ctop/byteDanceUserOrientationTemplate/list',
           creativeTemplateList:'/ctop/bytedanceCreativeLaunchTemplate/list'
         }
       }
     },
+    components: {
+      AFormItem,
+      UploadToAli,
+      material
+    },
     methods: {
       refreshConvertApiId(){
         let params = {};
-        getAction(this.url.convertList+'?bindAccountId='+this.accountId+'&urlId='+this.urlId ,params).then((res)=>{
+        getAction(this.url.convertList+'?accountId='+this.accountId+'&urlId='+this.urlId ,params).then((res)=>{
           console.log(res);
           if(res.code == 0){
             this.activeConvertList = res.data.active_convert_list;
@@ -575,11 +594,29 @@
         params.itratorNum = this.itratorNum;
         params.templateName = this.templateName;
         params.convertId = this.convertId;
+        params.simpleDeliverytarget = this.simpleDeliverytarget;
+        params.convertType = this.convertType;
         if (this.time != [] && this.time.length == 2) {
           params.startDate = moment(this.time[0]).format('YYYY-MM-DD HH:mm')
           params.endDate = moment(this.time[1]).format('YYYY-MM-DD HH:mm')
         }
-
+        params.creativeTemplateId = this.creativeTemplateId;
+        params.creativeType = this.creativeType;
+        params.materialAddType = this.materialAddType;
+        var dataCreatives = this.$refs.material.HorizontalLargeImageListBig.concat(
+          this.$refs.material.HorizontalLargeImageListHeng,
+          this.$refs.material.HorizontalLargeImageListShu,
+          this.$refs.material.HorizontalLargeImageListZu,
+          this.$refs.material.HorizontalLargeImageListSmall,
+          this.$refs.material.HorizontalLargeImageListBigShu
+        )
+        console.log(dataCreatives)
+        params.creatives = dataCreatives
+        if (this.creativeType == 'program') {
+          params.titles = this.$refs.material.titleData
+        }
+        params.webUrl = this.webUrl;
+        params.appName = this.appName;
         params.dateQuantumRange = this.dateQuantumRange;
         params.urlId = this.urlId;
         e.preventDefault()

+ 57 - 203
src/views/template/creative/create.vue

@@ -185,165 +185,10 @@
       <a-form-item label="素材添加方式" :labelCol="labelCol" :wrapperCol="wrapperCol">
         <a-radio-group v-model="materialAddType">
           <a-radio-button value="customize">自定义上传</a-radio-button>
-          <!--<a-radio-button value="program">程序化创意</a-radio-button>-->
-        </a-radio-group>
-      </a-form-item>
-      <a-form-item label="选择素材类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
-        <a-radio-group v-model="materialType" @change="materialTypeChange">
-          <a-badge
-            :count="HorizontalLargeImageListBig.length"
-            :numberStyle="{backgroundColor: '#52c41a'} "
-          >
-            <a-radio-button value="CREATIVE_IMAGE_MODE_LARGE">大图横图</a-radio-button>
-          </a-badge>
-          <a-badge
-            :count="HorizontalLargeImageListShu.length"
-            :numberStyle="{backgroundColor: '#52c41a'} "
-          >
-            <a-radio-button value="CREATIVE_IMAGE_MODE_VIDEO">横版视频</a-radio-button>
-          </a-badge>
-          <a-badge
-            :count="HorizontalLargeImageListHeng.length"
-            :numberStyle="{backgroundColor: '#52c41a'} "
-          >
-            <a-radio-button value="CREATIVE_IMAGE_MODE_VIDEO_VERTICAL">竖版视频</a-radio-button>
-          </a-badge>
-          <a-badge
-            :count="HorizontalLargeImageListZu.length"
-            :numberStyle="{backgroundColor: '#52c41a'} "
-          >
-            <a-radio-button value="CREATIVE_IMAGE_MODE_GROUP">组图</a-radio-button>
-          </a-badge>
-          <a-badge
-            :count="HorizontalLargeImageListSmall.length"
-            :numberStyle="{backgroundColor: '#52c41a'} "
-          >
-            <a-radio-button value="CREATIVE_IMAGE_MODE_SMALL">小图</a-radio-button>
-          </a-badge>
-          <a-badge
-            :count="HorizontalLargeImageListBigShu.length"
-            :numberStyle="{backgroundColor: '#52c41a'} "
-          >
-            <a-radio-button value="CREATIVE_IMAGE_MODE_LARGE_VERTICAL">大图竖图</a-radio-button>
-          </a-badge>
+          <a-radio-button value="program">程序化创意</a-radio-button>
         </a-radio-group>
       </a-form-item>
-      <!-- 创建大图横图创意 -->
-      <a-form-item
-        label="创建创意"
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-        v-if="createLargeImageCreativeCon"
-      >
-        <a-layout>
-          <a-layout-content style="padding:10px;">
-            <div :style="{ marginBottom: '16px' }">
-              <a-button @click="addCreative()" :disabled="count">添加创意</a-button>
-              <span
-                style="color:black;margin-left:10px"
-                v-if="creativeType == 'customize'"
-              >{{countMany}}/10</span>
-              <span
-                style="color:black;margin-left:10px"
-                v-else-if="creativeType == 'program'"
-              >视频数量:{{vadioMany}}/12 图片数量:{{imgMany}}/10</span>
-            </div>
-            <a-row>
-              <a-col :span="8" v-for="(item,index) of HorizontalLargeImageList" :key="index">
-                <a-card title :ref="item">
-                  <a-icon
-                    type="close"
-                    style="float:right;cursor: pointer;"
-                    @click="deleteCreative(index)"
-                  />
-                  <div style="clear:both"></div>
-                  <div class="dynamically_add_form_item">
-                    <a-form-item class label="素材上传" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                      <upload-to-ali
-                        v-model="item.vadioUrl"
-                        :customDomain="customDomain"
-                        preview
-                        :region="region"
-                        :bucket="bucket"
-                        :accept="acceptImage"
-                        :size="102400"
-                        :accessKeyId="accessKeyId"
-                        :accessKeySecret="accessKeySecret"
-                      ></upload-to-ali>
-                    </a-form-item>
-                    <a-form-item
-                      label="创意标题"
-                      :labelCol="labelCol"
-                      :wrapperCol="wrapperCol"
-                      v-if="creativeType == 'customize'"
-                    >
-                      <a-input v-model="item.text" class="rending" @change="judge(item)"></a-input>
-                    </a-form-item>
-                    <a-form-item
-                      label="动态词包"
-                      :labelCol="labelCol"
-                      :wrapperCol="wrapperCol"
-                      v-if="creativeType == 'customize'"
-                    >
-                      <a-tag
-                        v-for="(itemTag,indexTag) of tags"
-                        :key="indexTag"
-                        v-show="indexTag<item.many"
-                        @click="getChange(item,itemTag,index)"
-                      >{{itemTag.name}}</a-tag>
-                      <span @click="showElseClick(item)">{{item.showElse?"更多":"收起"}}</span>
-                    </a-form-item>
-                    <a-form-item
-                      label="封面上传"
-                      :labelCol="labelCol"
-                      :wrapperCol="wrapperCol"
-                      v-if="creativeType == 'program'&&(materialType=='CREATIVE_IMAGE_MODE_VIDEO_VERTICAL'||materialType=='CREATIVE_IMAGE_MODE_VIDEO')"
-                    >
-                      <upload-to-ali
-                        v-model="item.imageUrl"
-                        :customDomain="customDomain"
-                        preview
-                        :region="region"
-                        :bucket="bucket"
-                        :accept="acceptImage"
-                        :size="102400"
-                        :accessKeyId="accessKeyId"
-                        :accessKeySecret="accessKeySecret"
-                      ></upload-to-ali>
-                    </a-form-item>
-                  </div>
-                </a-card>
-              </a-col>
-            </a-row>
-          </a-layout-content>
-        </a-layout>
-      </a-form-item>
-
-      <a-form-item
-        v-if="creativeType == 'program'"
-        label="程序化创意标题"
-        :labelCol="labelCol"
-        :wrapperCol="wrapperCol"
-      >
-        <a-button @click="addTitle">添加创意标题</a-button>
-        <br />
-        <div v-for="(item,index) of titleData" :key="index">
-          <a-input style="width:55%" v-model="item.text" class="rending-all"></a-input>
-          <a-icon
-            type="delete"
-            style="margin-left:20px;cursor: pointer;"
-            v-show="titleData.length>1"
-            @click="tetleDetele(index)"
-          />
-          <br />
-          <a-tag
-            v-for="(itemTag,indexTag) of tags"
-            :key="indexTag"
-            @click="getChangeAllTitle(item,itemTag,index)"
-          >{{itemTag.name}}</a-tag>
-        </div>
-      </a-form-item>
-
+      <material :creativeType.sync="creativeType" :accountId.sync="accountId" ref="material"></material>
       <a-form-item label="应用下载详情页" :labelCol="labelCol" :wrapperCol="wrapperCol">
         <a-input v-model="webUrl"></a-input>
       </a-form-item>
@@ -394,6 +239,7 @@ import UploadToAli from '@femessage/upload-to-ali'
 import { postAction, getAction, getPackage } from '@/api/manage'
 import moment from 'moment'
 import AFormItem from 'ant-design-vue/es/form/FormItem'
+import material from './modules/material'
 import $ from 'jquery'
 
 export default {
@@ -514,7 +360,8 @@ export default {
   },
   components: {
     AFormItem,
-    UploadToAli
+    UploadToAli,
+    material
   },
   methods: {
     handleCancel() {
@@ -765,55 +612,62 @@ export default {
       return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
     },
     handleSubmit(e) {
-      e.preventDefault()
+      e.preventDefault();
       this.form.validateFields((err, values) => {
         if (!err) {
-          console.log('Received values of form: ', values)
-          let params = {}
-          params.campaignId = this.campaignId
-          params.deliveryRange = this.deliveryRange
-          params.userorentationId = this.userorentationId
-          params.budgetId = this.budgetId
-          params.deliverytargetId = this.deliverytargetId
-          params.horizonImageUrl = this.horizonImageUrl
-          params.horizonImageCreativeText = this.horizonImageCreativeText
-          params.horizonVideoUrl = this.horizonVideoUrl
-          params.horizonVideoCoverImageUrl = this.horizonVideoCoverImageUrl
-          params.horizonVideoCreativeText = this.horizonVideoCreativeText
-          params.verticalVideoUrl = this.verticalVideoUrl
-          params.verticalVideoCoverImageUrl = this.verticalVideoCoverImageUrl
-          params.verticalVideoCreativeText = this.verticalVideoCreativeText
-          params.groupImageUrl = this.groupImageUrl
-          params.groupImageCreativeText = this.groupImageCreativeText
-          params.smallImageUrl = this.smallImageUrl
-          params.smallImageCreativeText = this.smallImageCreativeText
-          params.verticalImageUrl = this.verticalImageUrl
-          params.verticalImageCreativeText = this.verticalImageCreativeText
-          params.planId = this.planId
-          params.accountId = this.accountId
-          params.advertiseLocation = this.advertiseLocation
-          params.inventoryType = this.inventoryType
-          params.sceneInventory = this.sceneInventory
-          params.creativeType = this.creativeType
-          params.customize = this.customize
-          params.webUrl = this.webUrl
-          params.appName = this.appName
-          params.isCommentDisable = this.isCommentDisable
-          params.creativeDisplayMode = this.creativeDisplayMode
-          params.adCategory = this.adCategory
-          params.adKeywords = this.adKeywords
-          params.name = this.name
-          params.convertId = this.convertId
-          params.iteratorNum = this.iteratorNum
-          var dataCreatives = this.HorizontalLargeImageListBig.concat(
-            this.HorizontalLargeImageListHeng,
-            this.HorizontalLargeImageListShu,
-            this.HorizontalLargeImageListZu,
-            this.HorizontalLargeImageListSmall,
-            this.HorizontalLargeImageListBigShu
+          console.log('Received values of form: ', values);
+          let params = {};
+          params.campaignId = this.campaignId;
+          params.deliveryRange = this.deliveryRange;
+          params.userorentationId = this.userorentationId;
+          params.budgetId = this.budgetId;
+          params.deliverytargetId = this.deliverytargetId;
+          params.horizonImageUrl = this.horizonImageUrl;
+          params.horizonImageCreativeText = this.horizonImageCreativeText;
+          params.horizonVideoUrl = this.horizonVideoUrl;
+          params.horizonVideoCoverImageUrl = this.horizonVideoCoverImageUrl;
+          params.horizonVideoCreativeText = this.horizonVideoCreativeText;
+          params.verticalVideoUrl = this.verticalVideoUrl;
+          params.verticalVideoCoverImageUrl = this.verticalVideoCoverImageUrl;
+          params.verticalVideoCreativeText = this.verticalVideoCreativeText;
+          params.groupImageUrl = this.groupImageUrl;
+          params.groupImageCreativeText = this.groupImageCreativeText;
+          params.smallImageUrl = this.smallImageUrl;
+          params.smallImageCreativeText = this.smallImageCreativeText;
+          params.verticalImageUrl = this.verticalImageUrl;
+          params.verticalImageCreativeText = this.verticalImageCreativeText;
+          params.planId = this.planId;
+          params.accountId = this.accountId;
+          params.advertiseLocation = this.advertiseLocation;
+          params.inventoryType = this.inventoryType;
+          params.sceneInventory = this.sceneInventory;
+          params.creativeType = this.creativeType;
+          params.customize = this.customize;
+          params.webUrl = this.webUrl;
+          params.appName = this.appName;
+          params.isCommentDisable = this.isCommentDisable;
+          params.creativeDisplayMode = this.creativeDisplayMode;
+          params.adCategory = this.adCategory;
+          params.adKeywords = this.adKeywords;
+          params.name = this.name;
+          params.convertId = this.convertId;
+          params.iteratorNum = this.iteratorNum;
+          params.simpleDeliverytarget = this.simpleDeliverytarget;
+          params.convertType = this.convertType;
+          var dataCreatives = this.$refs.material.HorizontalLargeImageListBig.concat(
+            this.$refs.material.HorizontalLargeImageListHeng,
+            this.$refs.material.HorizontalLargeImageListShu,
+            this.$refs.material.HorizontalLargeImageListZu,
+            this.$refs.material.HorizontalLargeImageListSmall,
+            this.$refs.material.HorizontalLargeImageListBigShu
           )
+          console.log(dataCreatives)
           params.creatives = dataCreatives
-          params.titles = this.titleData
+          if (this.creativeType == 'program') {
+            //   params.titles = this.titleData
+            params.titles = this.$refs.material.titleData
+          }
+
           console.log(params)
           postAction(this.url.insertUrl, params).then(res => {
             console.log(res)

+ 589 - 0
src/views/template/creative/modules/material.vue

@@ -0,0 +1,589 @@
+<template>
+  <a-form :form="form">
+    <a-form-item label="选择素材类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
+      <a-radio-group v-model="materialType" @change="materialTypeChange">
+        <a-badge
+          :count="HorizontalLargeImageListBig.length"
+          :numberStyle="{backgroundColor: '#52c41a'} "
+        >
+          <a-radio-button value="CREATIVE_IMAGE_MODE_LARGE">大图横图</a-radio-button>
+        </a-badge>
+        <a-badge
+          :count="HorizontalLargeImageListShu.length"
+          :numberStyle="{backgroundColor: '#52c41a'} "
+        >
+          <a-radio-button value="CREATIVE_IMAGE_MODE_VIDEO">横版视频</a-radio-button>
+        </a-badge>
+        <a-badge
+          :count="HorizontalLargeImageListHeng.length"
+          :numberStyle="{backgroundColor: '#52c41a'} "
+        >
+          <a-radio-button value="CREATIVE_IMAGE_MODE_VIDEO_VERTICAL">竖版视频</a-radio-button>
+        </a-badge>
+        <a-badge
+          :count="HorizontalLargeImageListZu.length"
+          :numberStyle="{backgroundColor: '#52c41a'} "
+        >
+          <a-radio-button value="CREATIVE_IMAGE_MODE_GROUP">组图</a-radio-button>
+        </a-badge>
+        <a-badge
+          :count="HorizontalLargeImageListSmall.length"
+          :numberStyle="{backgroundColor: '#52c41a'} "
+        >
+          <a-radio-button value="CREATIVE_IMAGE_MODE_SMALL">小图</a-radio-button>
+        </a-badge>
+        <a-badge
+          :count="HorizontalLargeImageListBigShu.length"
+          :numberStyle="{backgroundColor: '#52c41a'} "
+        >
+          <a-radio-button value="CREATIVE_IMAGE_MODE_LARGE_VERTICAL">大图竖图</a-radio-button>
+        </a-badge>
+      </a-radio-group>
+    </a-form-item>
+    <!-- 创建大图横图创意 -->
+    <a-form-item
+      label="创建创意"
+      :labelCol="labelCol"
+      :wrapperCol="wrapperCol"
+      v-if="createLargeImageCreativeCon"
+    >
+      <a-layout>
+        <a-layout-content style="padding:10px;">
+          <div :style="{ marginBottom: '16px' }">
+            <a-button @click="addCreative()" :disabled="count">添加创意</a-button>
+            <span
+              style="color:black;margin-left:10px"
+              v-if="creativeType == 'customize'"
+            >{{countMany}}/10</span>
+            <span
+              style="color:black;margin-left:10px"
+              v-else-if="creativeType == 'program'"
+            >视频数量:{{vadioMany}}/12 图片数量:{{imgMany}}/10</span>
+          </div>
+          <a-row>
+            <a-col :span="8" v-for="(item,index) of HorizontalLargeImageList" :key="index">
+              <a-card title :ref="item">
+                <a-icon
+                  type="close"
+                  style="float:right;cursor: pointer;"
+                  @click="deleteCreative(index)"
+                />
+                <div style="clear:both"></div>
+                <div class="dynamically_add_form_item">
+                  <a-form-item class label="素材上传" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                    <upload-to-ali
+                      v-model="item.vadioUrl"
+                      :customDomain="customDomain"
+                      preview
+                      :region="region"
+                      :bucket="bucket"
+                      :accept="acceptImage"
+                      :size="102400"
+                      :accessKeyId="accessKeyId"
+                      :accessKeySecret="accessKeySecret"
+                    ></upload-to-ali>
+                  </a-form-item>
+                  <a-form-item
+                    label="创意标题"
+                    :labelCol="labelCol"
+                    :wrapperCol="wrapperCol"
+                    v-if="creativeType == 'customize'"
+                  >
+                    <a-input v-model="item.text" class="rending" @change="judge(item)"></a-input>
+                  </a-form-item>
+                  <a-form-item
+                    label="动态词包"
+                    :labelCol="labelCol"
+                    :wrapperCol="wrapperCol"
+                    v-if="creativeType == 'customize'"
+                  >
+                    <a-tag
+                      v-for="(itemTag,indexTag) of tags"
+                      :key="indexTag"
+                      v-show="indexTag<item.many"
+                      @click="getChange(item,itemTag,index)"
+                    >{{itemTag.name}}</a-tag>
+                    <span @click="showElseClick(item)">{{item.showElse?"更多":"收起"}}</span>
+                  </a-form-item>
+                  <a-form-item
+                    label="封面上传"
+                    :labelCol="labelCol"
+                    :wrapperCol="wrapperCol"
+                    v-if="creativeType == 'program'&&(materialType=='CREATIVE_IMAGE_MODE_VIDEO_VERTICAL'||materialType=='CREATIVE_IMAGE_MODE_VIDEO')"
+                  >
+                    <upload-to-ali
+                      v-model="item.imageUrl"
+                      :customDomain="customDomain"
+                      preview
+                      :region="region"
+                      :bucket="bucket"
+                      :accept="acceptImage"
+                      :size="102400"
+                      :accessKeyId="accessKeyId"
+                      :accessKeySecret="accessKeySecret"
+                    ></upload-to-ali>
+                  </a-form-item>
+                </div>
+              </a-card>
+            </a-col>
+          </a-row>
+        </a-layout-content>
+      </a-layout>
+    </a-form-item>
+    <a-form-item
+      v-if="creativeType == 'program'"
+      label="程序化创意标题"
+      :labelCol="labelCol"
+      :wrapperCol="wrapperCol"
+    >
+      <a-button @click="addTitle">添加创意标题</a-button>
+      <br />
+      <div v-for="(item,index) of titleData" :key="index">
+        <a-input style="width:55%" v-model="item.text" class="rending-all"></a-input>
+        <a-icon
+          type="delete"
+          style="margin-left:20px;cursor: pointer;"
+          v-show="titleData.length>1"
+          @click="tetleDetele(index)"
+        />
+        <br />
+        <a-tag
+          v-for="(itemTag,indexTag) of tags"
+          :key="indexTag"
+          @click="getChangeAllTitle(item,itemTag,index)"
+        >{{itemTag.name}}</a-tag>
+      </div>
+    </a-form-item>
+  </a-form>
+</template>
+
+<script>
+import UploadToAli from '@femessage/upload-to-ali'
+import { postAction, getAction, getPackage } from '@/api/manage'
+import moment from 'moment'
+import AFormItem from 'ant-design-vue/es/form/FormItem'
+import $ from 'jquery'
+
+export default {
+  name: 'BaseForm',
+  props: {
+    accountId: {
+      default() {
+        return ''
+      }
+    },
+    creativeType: {
+      type: String,
+      default() {
+        return 'customize'
+      }
+    }
+  },
+  components: {
+    AFormItem,
+    UploadToAli
+  },
+  data() {
+    return {
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 5 }
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 }
+      },
+      accessKeyId: 'LTAIbNbqWzSOklQV',
+      accessKeySecret: '1rkPz7JNoXk8sJevPaeYHWqfkQXBGh',
+      bucket: 'ctop-media',
+      region: 'oss-cn-beijing',
+      acceptImage: 'image/jpeg,image/png',
+      acceptVideo: 'video/mpeg,video/mp4',
+      customDomain: '',
+      form: this.$form.createForm(this),
+      url: {
+        userAllocationList: '/template/allocation/list',
+        insertUrl: '/template/creative/insert',
+        industryListUrl: '/template/bytedance/industry/list',
+        campaignListUrl: '/template/campaign/list',
+        budgetTemplateListUrl: '/template/budget/list',
+        deliverytargetTemplateListUrl: '/template/deliverytarget/list',
+        userorentationTemplateListUrl: '/template/userorentation/list',
+        deliverytargetTemplateGetUrl: '/template/deliveryTarget/get',
+        convertList: 'template/convert/list'
+      },
+      materialType: 'CREATIVE_IMAGE_MODE_LARGE',
+      // 创建大图横图创意
+      createLargeImageCreativeCon: true,
+      HorizontalLargeImageList: [],
+      HorizontalLargeImageListBig: [],
+      HorizontalLargeImageListHeng: [],
+      HorizontalLargeImageListShu: [],
+      HorizontalLargeImageListZu: [],
+      HorizontalLargeImageListSmall: [],
+      HorizontalLargeImageListBigShu: [],
+      horizonImageUrlColl: [], // 大图横图图片素材集合
+      horizonImageCreativeTextColl: [], // 创意标题集合
+      itemIndex: null,
+      tags: [],
+      range: null,
+      countTag: 0,
+      titleData: [{ text: '', showElse: true, titleMany: 0 }]
+    }
+  },
+  methods: {
+    judge(item) {
+      var left = item.text.split('{')
+      var right = item.text.split('}')
+      console.log(left)
+      if (item.countTag == 0) {
+        return
+      } else {
+        if (left.length != 3 && right.lenght != 3) {
+          item.countTag -= 1
+        }
+      }
+    },
+    getChange(item, tag, index) {
+      item.countTag++
+      if (item.text == '') {
+        item.countTag = 0
+      }
+      if (item.countTag >= 2) {
+        this.$message.error('最多插入两条词包')
+        item.countTag = 2
+        return
+      }
+      var node = document.getElementsByClassName('rending')[index]
+      var v = '{' + tag.name + '}'
+      if (document.selection) {
+        //IE
+        node.focus()
+        var sel = document.selection.createRange()
+        sel.text = v
+        sel.select()
+      } else if (node.selectionStart || node.selectionStart == '0') {
+        //MOZILLA/GOOGLE
+        var startPos = node.selectionStart
+        var endPos = node.selectionEnd
+        var restoreTop = node.scrollTop
+        node.value = node.value.substring(0, startPos) + v + node.value.substring(endPos, node.value.length)
+        if (restoreTop > 0) {
+          node.scrollTop = restoreTop
+        }
+        item.text = node.value
+        node.focus()
+        node.selectionStart = startPos + v.length
+        node.selectionEnd = startPos + v.length
+      } else {
+        //OTHER
+        node.value += v
+        item.text = node.value
+        node.focus()
+      }
+    },
+    getChangeAllTitle(item, tag, index) {
+      item.titleMany++
+      if (item.text == '') {
+        item.titleMany = 0
+      }
+      if (item.titleMany >= 2) {
+        this.$message.error('最多插入两条词包')
+        item.titleMany = 2
+        return
+      }
+      var node = document.getElementsByClassName('rending-all')[index]
+      var v = '{' + tag.name + '}'
+      if (document.selection) {
+        //IE
+        node.focus()
+        var sel = document.selection.createRange()
+        sel.text = v
+        sel.select()
+      } else if (node.selectionStart || node.selectionStart == '0') {
+        //MOZILLA/GOOGLE
+        var startPos = node.selectionStart
+        var endPos = node.selectionEnd
+        var restoreTop = node.scrollTop
+        node.value = node.value.substring(0, startPos) + v + node.value.substring(endPos, node.value.length)
+        if (restoreTop > 0) {
+          node.scrollTop = restoreTop
+        }
+        item.text = node.value
+        node.focus()
+        node.selectionStart = startPos + v.length
+        node.selectionEnd = startPos + v.length
+      } else {
+        //OTHER
+        node.value += v
+        item.text = node.value
+        node.focus()
+      }
+    },
+    showElseClick(item) {
+      item.showElse = !item.showElse
+      if (!item.showElse) {
+        item.many = this.tags.length
+      } else {
+        item.many = 3
+      }
+    },
+    materialTypeChange() {
+      let type = this.materialType
+      if (type === 'CREATIVE_IMAGE_MODE_SMALL') {
+        // this.createLargeImageCreativeCon = false
+        this.showLargeImage = false
+        this.showLargeVerticalImage = false
+        this.showHorizonVideo = false
+        this.showVerticalVideo = false
+        this.showGroupImage = false
+        this.showSmallImage = true
+        this.HorizontalLargeImageList = this.HorizontalLargeImageListSmall
+      }
+      if (type === 'CREATIVE_IMAGE_MODE_LARGE') {
+        // this.createLargeImageCreativeCon = true
+        this.showLargeImage = false
+        this.showLargeVerticalImage = false
+        this.showHorizonVideo = false
+        this.showVerticalVideo = false
+        this.showGroupImage = false
+        this.showSmallImage = false
+        this.HorizontalLargeImageList = this.HorizontalLargeImageListBig
+      }
+      if (type === 'CREATIVE_IMAGE_MODE_GROUP') {
+        // this.createLargeImageCreativeCon = false
+        this.showLargeImage = false
+        this.showLargeVerticalImage = false
+        this.showHorizonVideo = false
+        this.showVerticalVideo = false
+        this.showGroupImage = true
+        this.showSmallImage = false
+        this.HorizontalLargeImageList = this.HorizontalLargeImageListZu
+      }
+      if (type === 'CREATIVE_IMAGE_MODE_VIDEO') {
+        // this.createLargeImageCreativeCon = false
+        this.showLargeImage = false
+        this.showLargeVerticalImage = false
+        this.showHorizonVideo = true
+        this.showVerticalVideo = false
+        this.showGroupImage = false
+        this.showSmallImage = false
+        this.HorizontalLargeImageList = this.HorizontalLargeImageListShu
+      }
+      if (type === 'CREATIVE_IMAGE_MODE_LARGE_VERTICAL') {
+        // this.createLargeImageCreativeCon = false
+        this.showLargeImage = false
+        this.showLargeVerticalImage = true
+        this.showHorizonVideo = false
+        this.showVerticalVideo = false
+        this.showGroupImage = false
+        this.showSmallImage = false
+        this.HorizontalLargeImageList = this.HorizontalLargeImageListBigShu
+      }
+      if (type === 'CREATIVE_IMAGE_MODE_VIDEO_VERTICAL') {
+        // this.createLargeImageCreativeCon = false
+        this.showLargeImage = false
+        this.showLargeVerticalImage = false
+        this.showHorizonVideo = false
+        this.showVerticalVideo = true
+        this.showGroupImage = false
+        this.showSmallImage = false
+        this.HorizontalLargeImageList = this.HorizontalLargeImageListHeng
+      }
+    },
+    //   创建大图横图创意
+    addCreative() {
+      let type = this.materialType
+      if (type === 'CREATIVE_IMAGE_MODE_SMALL') {
+        this.HorizontalLargeImageListSmall.push({
+          typeCode: type,
+          imageUrl: '',
+          text: '',
+          vadioUrl: '',
+          multiple: [],
+          countTag: 0,
+          many: 3,
+          showElse: true
+        })
+        this.HorizontalLargeImageList = this.HorizontalLargeImageListSmall
+      }
+      if (type === 'CREATIVE_IMAGE_MODE_LARGE') {
+        this.HorizontalLargeImageListBig.push({
+          typeCode: type,
+          imageUrl: '',
+          text: '',
+          vadioUrl: '',
+          multiple: [],
+          countTag: 0,
+          many: 3,
+          showElse: true
+        })
+        this.HorizontalLargeImageList = this.HorizontalLargeImageListBig
+      }
+      if (type === 'CREATIVE_IMAGE_MODE_GROUP') {
+        this.HorizontalLargeImageListZu.push({
+          creativeType: this.creativeType,
+          typeCode: type,
+          imageUrl: '',
+          text: '',
+          vadioUrl: '',
+          multiple: [],
+          countTag: 0,
+          many: 3,
+          showElse: true
+        })
+        this.HorizontalLargeImageList = this.HorizontalLargeImageListZu
+      }
+      if (type === 'CREATIVE_IMAGE_MODE_VIDEO') {
+        this.HorizontalLargeImageListShu.push({
+          creativeType: this.creativeType,
+          typeCode: type,
+          imageUrl: '',
+          text: '',
+          vadioUrl: '',
+          multiple: [],
+          countTag: 0,
+          many: 3,
+          showElse: true
+        })
+        this.HorizontalLargeImageList = this.HorizontalLargeImageListShu
+      }
+      if (type === 'CREATIVE_IMAGE_MODE_LARGE_VERTICAL') {
+        this.HorizontalLargeImageListBigShu.push({
+          creativeType: this.creativeType,
+          typeCode: type,
+          imageUrl: '',
+          text: '',
+          vadioUrl: '',
+          multiple: [],
+          countTag: 0,
+          many: 3,
+          showElse: true
+        })
+        this.HorizontalLargeImageList = this.HorizontalLargeImageListBigShu
+      }
+      if (type === 'CREATIVE_IMAGE_MODE_VIDEO_VERTICAL') {
+        this.HorizontalLargeImageListHeng.push({
+          creativeType: this.creativeType,
+          typeCode: type,
+          imageUrl: '',
+          text: '',
+          vadioUrl: '',
+          multiple: [],
+          countTag: 0,
+          many: 3,
+          showElse: true
+        })
+        this.HorizontalLargeImageList = this.HorizontalLargeImageListHeng
+      }
+    },
+    deleteCreative(index) {
+      console.log(index)
+      console.log(this.HorizontalLargeImageList)
+      this.HorizontalLargeImageList.splice(index, 1)
+    },
+    getTags() {
+      getPackage({ accountId: this.accountId }).then(res => {
+        if (res.code == '0') {
+          this.tags = res.creative_word
+        }
+      })
+    },
+    addTitle() {
+      this.titleData.push({ text: '', titleMany: 0 })
+    },
+    tetleDetele(index) {
+      this.titleData.splice(index, 1)
+    }
+  },
+  created: function() {},
+  watch: {
+    creativeType: function(n, o) {
+      console.log(n, o)
+      this.HorizontalLargeImageListBig = []
+      this.HorizontalLargeImageListHeng = []
+      this.HorizontalLargeImageListShu = []
+      this.HorizontalLargeImageListZu = []
+      this.HorizontalLargeImageListSmall = []
+      this.HorizontalLargeImageListBigShu = []
+      this.HorizontalLargeImageList = []
+    },
+    accountId: function(n, o) {
+      if (n != '') {
+        this.getTags()
+      }
+    },
+    materialType: function(n, o) {
+      this.materialTypeChange()
+    }
+  },
+  computed: {
+    count: function() {
+      var bool
+      if (this.creativeType == 'customize') {
+        bool =
+          this.HorizontalLargeImageListBig.length +
+            this.HorizontalLargeImageListHeng.length +
+            this.HorizontalLargeImageListShu.length +
+            this.HorizontalLargeImageListZu.length +
+            this.HorizontalLargeImageListSmall.length +
+            this.HorizontalLargeImageListBigShu.length >=
+          10
+            ? true
+            : false
+      } else {
+        if (
+          this.materialType == 'CREATIVE_IMAGE_MODE_VIDEO_VERTICAL' ||
+          this.materialType == 'CREATIVE_IMAGE_MODE_VIDEO'
+        ) {
+          bool = this.HorizontalLargeImageListHeng.length + this.HorizontalLargeImageListShu.length >= 12 ? true : false
+        } else {
+          bool =
+            this.HorizontalLargeImageListBig.length +
+              this.HorizontalLargeImageListZu.length +
+              this.HorizontalLargeImageListSmall.length +
+              this.HorizontalLargeImageListBigShu.length >=
+            10
+              ? true
+              : false
+        }
+      }
+      return bool
+    },
+    countMany: function() {
+      var bool =
+        this.HorizontalLargeImageListBig.length +
+        this.HorizontalLargeImageListHeng.length +
+        this.HorizontalLargeImageListShu.length +
+        this.HorizontalLargeImageListZu.length +
+        this.HorizontalLargeImageListSmall.length +
+        this.HorizontalLargeImageListBigShu.length
+      return bool
+    },
+    vadioMany: function() {
+      var bool = this.HorizontalLargeImageListHeng.length + this.HorizontalLargeImageListShu.length
+      return bool
+    },
+    imgMany: function() {
+      var bool =
+        this.HorizontalLargeImageListBig.length +
+        this.HorizontalLargeImageListZu.length +
+        this.HorizontalLargeImageListSmall.length +
+        this.HorizontalLargeImageListBigShu.length
+      return bool
+    }
+  }
+}
+</script>
+
+
+<style lang="scss">
+.dynamically_add_form_item {
+  .ant-form-item-label {
+    width: auto !important;
+  }
+  .ant-form-item-control-wrapper {
+    width: auto !important;
+  }
+}
+</style>

+ 1 - 0
src/views/template/userorientation/list.vue

@@ -12,6 +12,7 @@
 
           <a-col :md="6" :sm="8">
             <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+
               <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
               <a-button
                 type="primary"

+ 1 - 1
src/views/template/userorientation/modules/IntrestCategory.vue

@@ -197,7 +197,7 @@ export default {
         this.checkMatchedCity = this.dataValue.map(item => {
           return item.value;
         })
-        console.log(this.checkMatchedCity)
+        
         this.$emit('update:checkData', this.checkData)
       }
     })