1

src/pages/activity/ActivityPlan.vue

@@ -1,92 +1,90 @@
 <template>
   <div>
-    <Spin v-if="saving"
-          fix>加载中...</Spin>
-    <Form ref="formValidate"
-          :model="formValidate"
-          :label-width="80">
+    <Spin v-if="saving" fix>加载中...</Spin>
+    <Form ref="formValidate" :model="formValidate" :label-width="80">
       <Row :gutter="10">
-        <i-col span="4">
-          <FormItem label="选择日期"
-                    prop="">
-            <Date-picker v-model="formValidate.date"
-                         type="daterange"
-                         placement="bottom-end"
-                         placeholder="选择日期区间"></Date-picker>
+        <i-col span="6">
+          <FormItem label="选择日期" prop>
+            <Date-picker
+              v-model="formValidate.date"
+              type="daterange"
+              placement="bottom-end"
+              placeholder="选择日期区间"
+            ></Date-picker>
           </FormItem>
         </i-col>
         <i-col span="6">
-          <FormItem label="零售公司"
-                    prop="">
-            <Select v-model="formValidate.organizationId"
-                    filterable
-                    @on-change="selectCompany"
-                    placeholder="全部"
-                    clearable>
-              <Option v-for="(item, index) in companyList"
-                      :key="index"
-                      :value="item.value">{{ item.label }}
-              </Option>
+          <FormItem label="零售公司" prop>
+            <Select
+              v-model="formValidate.organizationId"
+              filterable
+              @on-change="selectCompany"
+              placeholder="全部"
+              clearable
+            >
+              <Option
+                v-for="(item, index) in companyList"
+                :key="index"
+                :value="item.value"
+              >{{ item.label }}</Option>
             </Select>
           </FormItem>
         </i-col>
         <i-col span="6">
-          <FormItem label="店铺"
-                    prop="">
-            <Select v-model="formValidate.storeId"
-                    filterable
-                    placeholder="全部"
-                    clearable>
-              <Option v-for="(item, index) in shopList"
-                      :key="index"
-                      :value="item.value">{{ item.label }}
-              </Option>
+          <FormItem label="店铺" prop>
+            <Select v-model="formValidate.storeId" filterable placeholder="全部" clearable>
+              <Option
+                v-for="(item, index) in shopList"
+                :key="index"
+                :value="item.value"
+              >{{ item.label }}</Option>
             </Select>
           </FormItem>
         </i-col>
-        <i-col span="4">
-          <FormItem label="活动状态"
-                    prop="">
+        <i-col span="3">
+          <FormItem label="活动状态" prop>
             <Select v-model="formValidate.status">
-              <Option v-for="(item, index) in activityStatusList"
-                      :key="index"
-                      :value="item.value">{{ item.label }}
-              </Option>
+              <Option
+                v-for="(item, index) in activityStatusList"
+                :key="index"
+                :value="item.value"
+              >{{ item.label }}</Option>
             </Select>
           </FormItem>
         </i-col>
-        <i-col span="4">
-          <Button type="primary"
-                  @click="searchTable">查询</Button>
+        <i-col span="3">
+          <Button type="primary" @click="() => {pageNum = 1;searchTable()}">查询</Button>
         </i-col>
       </Row>
       <Row style="margin-top:50px">
-        <Table :loading="loading"
-               border
-               @on-row-dblclick="showDetail"
-               :columns="columns1"
-               :data="data"></Table>
-        <Page :total="totalSize"
-              :current="pageNum"
-              :page-size="pageSize"
-              show-elevator
-              show-total
-              placement="top"
-              @on-change="handlePage"
-              class-name="ks-page"></Page>
+        <Table
+          :loading="loading"
+          border
+          @on-row-dblclick="showDetail"
+          :columns="columns1"
+          :data="data"
+        ></Table>
+        <Page
+          :total="totalSize"
+          :current="pageNum"
+          :page-size="pageSize"
+          show-elevator
+          show-total
+          placement="top"
+          @on-change="handlePage"
+          class-name="ks-page"
+        ></Page>
       </Row>
     </Form>
-    <useTable ref="useTable"
-              @doShow="doShow"
-              :show="showUse"
-              :isModify="true"
-              :schedule="activityInstance.scheduleVO"></useTable>
-    <Modal v-model="isShowDetail"
-           title="活动计划详情"
-           width="70%"
-           :footer-hide="true">
-      <planDetail v-if="isShowDetail"
-                  :detail="detail"></planDetail>
+    <useTable
+      ref="useTable"
+      @doShow="doShow"
+      :show="showUse"
+      :isModify="true"
+      :schedule="activityInstance.scheduleVO"
+    ></useTable>
+    <Modal v-model="isShowDetail" title="活动计划详情" width="70%" :footer-hide="true">
+      <planDetail v-if="isShowDetail" :detail="detail"></planDetail>
     </Modal>
   </div>
 </template>
@@ -103,9 +101,9 @@ export default {
   inject: ["setMenuName"],
   components: {
     useTable,
-    planDetail,
+    planDetail
   },
-  data () {
+  data() {
     const _this = this;
     return {
       loading: false,
@@ -125,139 +123,146 @@ export default {
         date: null,
         organizationId: null,
         storeId: null,
-        status: 2,
+        status: 2
       },
       activityData: [
         {
-          activityStatus: "进行中",
+          activityStatus: "进行中"
         },
         {
-          activityStatus: "已结束",
-        },
+          activityStatus: "已结束"
+        }
       ],
       activityStatusList: [
         {
           label: "全部",
-          value: 0,
+          value: 0
         },
         {
           label: "进行中",
-          value: 2,
+          value: 2
         },
         {
           label: "未开始",
-          value: 1,
+          value: 1
         },
         {
           label: "已结束",
-          value: 3,
-        },
+          value: 3
+        }
       ],
       columns1: [
         {
-          type: "index",
           width: 60,
           align: "center",
           title: "序号",
+          render(h, params) {
+            let num = parseInt(params.index) + 1;
+            console.log(_this.pageSize);
+            if (_this.pageSize > 1) {
+              num += (_this.pageNum - 1) * _this.pageSize;
+            }
+            return h("span", num);
+          }
         },
         {
           title: "活动名称",
-          key: "name",
+          key: "name"
         },
         {
           title: "活动类型",
           key: "scheduleVO.name",
-          render (h, params) {
-            return h("span", params.row["params"][0]["defaultVal"]);
-          },
+          render(h, params) {
+            return h("span", params.row["params"][0]["name"]);
+          }
         },
         {
           title: "活动时间",
           key: "beginTime",
           width: 230,
-          render (h, params) {
+          render(h, params) {
             return h("span", params.row.beginTime + " - " + params.row.endTime);
-          },
+          }
         },
         {
           title: "零售公司",
           key: "shop",
-          render (h, params) {
+          render(h, params) {
             return h(
               "span",
               params.row.companyName +
-              "等" +
-              (params.row.companyCount || 0) +
-              "家公司"
+                "等" +
+                (params.row.companyCount || 0) +
+                "家公司"
             );
-          },
+          }
         },
         {
           title: "店铺",
           key: "shop",
-          render (h, params) {
+          render(h, params) {
             return h(
               "span",
               params.row.storeName +
-              "等" +
-              (params.row.storeCount || 0) +
-              "家店铺"
+                "等" +
+                (params.row.storeCount || 0) +
+                "家店铺"
             );
-          },
+          }
         },
         {
           title: "添加好友数",
           key: "addFriendNum",
-          render (h, params) {
+          render(h, params) {
             return h("span", (params.row.friends || 0) + "人");
-          },
+          }
         },
         {
           title: "参与活动客户数",
           key: "joinActivityClientNum",
-          render (h, params) {
+          render(h, params) {
             return h("span", (params.row.friends || 0) + "人");
-          },
+          }
         },
         {
           title: "活动码",
           key: "activityCode",
-          render (h, p) {
+          render(h, p) {
             return h(
               "Button",
               {
                 props: { type: "primary", size: "small" },
-                on: { click: () => _this.navigateCode(p.row) },
+                on: { click: () => _this.navigateCode(p.row) }
               },
               "查看详情"
             );
-          },
+          }
         },
         {
           title: "活动状态",
           key: "status",
-          render (h, p) {
+          render(h, p) {
             const status = p.row.status;
             if (status === 1) return h("span", "未开始");
             if (status === 2) return h("span", "进行中");
             if (status === 3) return h("span", "已结束");
             if (status === 4) return h("span", "取消");
-          },
+          }
         },
         {
           title: "操作",
           key: "action",
           width: 200,
-          render (h, p) {
-            return h("div", [
+          render(h, p) {
+            let r = [
               h(
                 "Button",
                 {
                   props: { type: "primary", size: "small" },
                   style: { marginRight: "8px" },
                   on: {
-                    click: () => _this.stop(p.row),
-                  },
+                    click: () => _this.stop(p.row)
+                  }
                 },
                 "终止"
               ),
@@ -265,74 +270,79 @@ export default {
                 "Button",
                 {
                   props: { type: "primary", size: "small" },
-                  on: { click: () => _this.modify(p.row) },
+                  on: { click: () => _this.modify(p.row) }
                 },
                 "修改"
-              ),
-            ]);
-          },
-        },
-      ],
+              )
+            ];
+            if (p.row.status > 2) {
+              delete r[0];
+            }
+            return h("div", r);
+          }
+        }
+      ]
     };
   },
-  mounted () {
+  mounted() {
     this.setMenuName("活动管理", "活动计划");
     this.getCompanyInfo();
     this.getShopInfo();
     this.searchTable();
   },
   methods: {
-    doShow (show) {
+    doShow(show) {
       this.showUse = show;
       this.searchTable();
     },
-    showDetail (detail) {
+    showDetail(detail) {
       let _this = this;
-      this.getDetail(detail.id).then((res) => {
+      this.getDetail(detail.id).then(res => {
         _this.detail = res;
         _this.isShowDetail = true;
       });
     },
-    getCompanyInfo () {
+    getCompanyInfo() {
       let that = this;
       let data = {
-        userId: JSON.parse(sessionStorage.getItem("loginInfo")).userId,
+        userId: JSON.parse(sessionStorage.getItem("loginInfo")).userId
       };
-      ActivityManager.getCompany(data, function (data) {
+      ActivityManager.getCompany(data, function(data) {
         that.companyList = [];
-        data.data.results.forEach((element) => {
+        data.data.results.forEach(element => {
           that.companyList.push({
             label: element.name,
-            value: element.id,
+            value: element.id
           });
         });
       });
     },
-    selectCompany (value) {
+    selectCompany(value) {
       this.customerId = value;
       this.getShopInfo();
     },
-    getShopInfo () {
+    getShopInfo() {
       let that = this;
       let data = {
         userId: JSON.parse(sessionStorage.getItem("loginInfo")).userId,
         customerIds: this.customerId,
+        scheduleId: null
       };
-      ActivityManager.getShop(data, function (data) {
+      ActivityManager.getShop(data, function(data) {
         that.shopList = [];
-        data.data.results.forEach((element) => {
+        data.data.results.forEach(element => {
           that.shopList.push({
             label: element.name,
-            value: element.id,
+            value: element.id
           });
         });
       });
     },
-    handlePage: function (value) {
+    handlePage: function(value) {
       this.pageNum = value;
       this.searchTable();
     },
-    stop (instance) {
+    stop(instance) {
       let _this = this;
       this.$Modal.confirm({
         title: "您确认要终止?",
@@ -341,7 +351,7 @@ export default {
           this.saving = true;
           ActivityManager.instanceTerminate(
             { instanceId: instance.id },
-            (res) => {
+            res => {
               _this.saving = false;
               if (res.data.success == undefined || !res.data.success) {
                 _this.$Message.error("终止失败!");
@@ -351,36 +361,36 @@ export default {
             }
           );
         },
-        onCancel: () => { },
+        onCancel: () => {}
       });
     },
-    getDetail (instanceId) {
+    getDetail(instanceId) {
       return new Promise((resolve, reject) => {
         ActivityManager.instanceDetail(
           {
-            instanceId,
+            instanceId
           },
-          (res) => {
+          res => {
             resolve(res.data.results);
           }
         );
       });
     },
-    modify (instance) {
+    modify(instance) {
       let _this = this;
-      this.getDetail(instance.id).then((res) => {
+      this.getDetail(instance.id).then(res => {
         store.commit("SET_useData", res);
         _this.activityInstance = res;
         _this.showUse = true;
       });
     },
-    navigateCode (instance) {
+    navigateCode(instance) {
       this.$router.push({
         path: "/activity/plan/code",
-        query: { instanceId: instance.id },
+        query: { instanceId: instance.id }
       });
     },
-    searchTable (params = {}) {
+    searchTable(params = {}) {
       this.loading = true;
       if (
         this.formValidate.date !== null &&
@@ -405,14 +415,14 @@ export default {
         params.status = undefined;
       }
       params.date = undefined;
-      http.get("/activity/instance/list", params).then((res) => {
+      http.get("/activity/instance/list", params).then(res => {
         const data = res.data.results.this || {};
         this.data = data.list || [];
         this.totalSize = data.total || 0;
         this.loading = false;
       });
-    },
-  },
+    }
+  }
 };
 </script>