update: 弹窗推广接口联调

src/router/modules/pop.js

@@ -14,13 +14,14 @@ export default {
       }
     },
     {
-      path: ':type',
+      path: 'add',
       name: '新建计划',
-      component: () => import(/* webpackChunkName: "pop" */ '../../views/pop/form.vue'),
-      meta: {
-        type: 'add',
-        path: ':type'
-      }
+      component: () => import(/* webpackChunkName: "pop" */ '../../views/pop/form.vue')
+    },
+    {
+      path: 'edit',
+      name: '编辑计划',
+      component: () => import(/* webpackChunkName: "pop" */ '../../views/pop/form.vue')
     }
   ]
 };

src/service/api/popApi.js

@@ -4,14 +4,15 @@ const PREFIX = 'api-marketing/';
 import config from '@/config';
 export const url = config.api + PREFIX;
 
+// (url, data = {}, contentTypeIsJSON = false, isSilence = false, method = 'POST', alertError = true) => {
 // 弹窗计划分页列表
-export const popPlanList = params => requests(PREFIX + 'query-popup-plan-page-list', params);
+export const popPlanList = params => requests(PREFIX + 'query-popup-plan-page-list', params, true);
 
 // 弹窗计划详情
 export const getPopupPlan = params => requests(PREFIX + 'get-popup-plan', params);
 
 // 保存或更新弹窗计划
-export const saveOrUpdatePopupPlan = params => requests(PREFIX + 'save-or-update-popup-plan', params);
+export const saveOrUpdatePopupPlan = params => requests(PREFIX + 'save-or-update-popup-plan', params, true);
 
 // 投放页面列表
 export const queryPopupLinkList = params => requests(PREFIX + 'query-popup-link-list', params);

src/views/pop/list.vue

@@ -9,12 +9,12 @@
         <el-option v-for="item in putonTypeOpt" :key="item.value" :label="item.label" :value="item.value"></el-option>
       </el-select>
       <el-date-picker class="w300" v-model="listParams.dateTime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="refresh"></el-date-picker>
-      <el-checkbox v-model="listParams.onlySelf" :true-label="1" :false-label="0">仅看本人</el-checkbox>
+      <el-checkbox v-model="listParams.onlySelf" :true-label="1" :false-label="0" @change="refresh">仅看本人</el-checkbox>
       <div class="fr">
-        <el-button type="primary" @click="goForm({}, 'add')">新建计划（{{ tableList.length }}/30）</el-button>
+        <el-button type="primary" :disabled="tableList.length >= 30" @click="goForm({}, 'add')">新建计划（{{ tableList.length }}/30）</el-button>
       </div>
     </div>
-    <el-table tooltipEffect="light" style="width: 100%" class="emptyTable">
+    <el-table tooltipEffect="light" style="width: 100%" :class="{ emptyTable: Array.isArray(tableList) && tableList.length > 0 }">
       <el-table-column align="left" label="弹窗内容"></el-table-column>
       <el-table-column align="left" label="定向人群" width="250"></el-table-column>
       <el-table-column align="left" label="投放页面"></el-table-column>
@@ -33,11 +33,11 @@
         <el-table-column align="left" label="弹窗内容">
           <template slot-scope="scope">
             <el-popover placement="top" width="246" trigger="click">
-              <el-image fill="contain" :src="scope.row.popupImageDetails.imageUrl"></el-image>
+              <el-image fill="contain" :src="scope.row.popupImageDetails ? scope.row.popupImageDetails.imageUrl : ''"></el-image>
               <template slot="reference">
                 <div class="demo-image__preview">
                   <i class="iconfont icon-yulan"></i>
-                  <el-image fit="cover" :src="scope.row.popupImageDetails.imageUrl"></el-image>
+                  <el-image fit="cover" :src="scope.row.popupImageDetails ? scope.row.popupImageDetails.imageUrl : ''"></el-image>
                 </div>
               </template>
             </el-popover>
@@ -60,7 +60,7 @@
         </el-table-column>
         <el-table-column label="操作" align="left" width="170">
           <template slot-scope="scope">
-            <el-button v-if="scope.row.activeStatus === 2 || scope.row.activeStatus === 3" type="text" @click="goForm(group, 'info')">查看</el-button>
+            <el-button v-if="scope.row.activeStatus === 2 || scope.row.activeStatus === 3" type="text" @click="goForm(group, 'edit')">查看</el-button>
             <dm-delete v-if="scope.row.activeStatus === 2" @confirm="delData(scope.row)" tips="是否停止该条数据?">
               <el-button type="text">停止</el-button>
             </dm-delete>
@@ -103,10 +103,13 @@ export default {
       loading: false,
       tableList: [],
       listParams: {
+        dateTime: ['', ''],
+        activeStatus: '', // 弹窗活动状态（1：未开始，2：进行中，3：已结束）
+        putonType: '', // 投放类型（1：图片，2：卡券）
+        onlySelf: 0, // 仅看本人（0：否，1：是）
         currentPage: 1,
         pageSize: 20
       },
-      dateTime: ['', ''],
       total: 0
     };
   },
@@ -151,11 +154,12 @@ export default {
     formatDateTimeByType,
     async getTableList() {
       let params = { ...this.listParams };
-      if (params.dateTime) {
-        params.beginTime = new Date(params.dateTime[0]).getTime();
-        params.endTime = new Date(params.dateTime[1]).getTime();
-        delete params.dateTime;
+      const [beginTime, endTime] = params.dateTime || [];
+      if (beginTime && endTime) {
+        params.beginTime = new Date(beginTime).getTime();
+        params.endTime = new Date(endTime).getTime();
       }
+      delete params.dateTime;
       console.log(params);
       const res = await popPlanList(params);
       if (res.errorCode === 0 && res.result) {
@@ -166,7 +170,7 @@ export default {
       if (type === 'add') {
         this.$router.push(`/pop/add`);
       } else {
-        this.$router.push(`/pop/detail?id=${group.id}`);
+        this.$router.push(`/pop/edit?id=${group.id}`);
       }
     },
     async removePop(popupId) {