营销管理解决异步请求的bug

src/views/dev/Dev_Test.vue

@@ -0,0 +1,268 @@
+<template>
+<div>
+  hah
+</div>
+</template>
+
+<script>
+import {
+  sysDeptDemoList,
+  selectCustomerLabelInfo,
+  addAndDelCustomerLabel,
+  selectPhoneList,
+  selectNotCustomerLabelInfo,
+} from "@/api/label/label";
+export default {
+  name: "Dev_Test",
+  data() {
+    return {
+      activeNames: undefined,
+      labelList: {},
+      notCustomerLabelList: [],
+      customerLabelList: [],
+      loading: false,
+      error: false,
+      currentLabelId: undefined,
+      pageStatus: 0,
+      timer: null,
+      leftData: [],
+      rightData: [],
+      leftTotal:100,
+      rightTotal:100,
+      leftQuery: {
+        pageNum: 1,
+        pageSize: 10,
+        labelId:null,
+        customerName: null,
+        phone:null
+      },
+      rightQuery: {
+        pageNum: 1,
+        pageSize: 10,
+        labelId:null,
+        customerName: null,
+        phone:null
+      },
+      moveRightData:[],
+      moveLeftData:[]
+    };
+  },
+  created() {
+    this.init();
+  },
+  computed:{
+    toggleable(){
+      if(this.moveRightData.length === 0 && this.moveLeftData.length === 0){
+        return true;
+      }
+      return false;
+    }
+  },
+  methods: {
+    getLeftData(){
+      // this.leftData = [];
+      selectNotCustomerLabelInfo(this.leftQuery)
+        .then((res) => {
+          if (res.code == 200) {
+            this.leftData = res.rows;
+            this.leftTotal = res.total
+          } else {
+            throw new Error("");
+          }
+        })
+        .catch((err) => {
+          this.leftData = [];
+          this.leftTotal = 0;
+          this.msgError("拉取左边标签用户失败，请刷新~");
+        });
+      
+    },
+    getRightData(){
+      // this.rightData = [];
+      selectPhoneList(this.rightQuery)
+        .then((res) => {
+          if (res.code == 200) {
+            this.rightData = res.rows;
+            this.rightTotal = res.total;
+          } else {
+            throw new Error("");
+          }
+        })
+        .catch(() => {
+          this.rightData = [];
+          this.rightTotal = 0;
+          this.msgError("拉取右边标签用户失败，请刷新~");
+        });
+
+    },
+    handleMoveLabel(direction = 'right', type = 1, row, labelIdArr){  // type 1 传row  type 2 idArr    direction right 向右转移 left 向左转移
+       let changeArr = []
+       if(type == 1){
+          changeArr.push(row.phone)
+       }else if(type == 2){
+         changeArr = labelIdArr
+       }
+      const query = {
+        labelId: direction == 'right' ? this.leftQuery.labelId : this.rightQuery.labelId,
+        flag: "1",
+        phoneList: changeArr,
+      };
+      if (direction == "right") {
+        query.flag = "0";
+      } else if (direction == "left") {
+        query.flag = "1";
+      }
+      addAndDelCustomerLabel(query).then((res) => {
+        if (res.code == 200) {
+          this.getLeftData();
+          this.getRightData();
+        } else {
+          throw new Error("");
+        }
+      }).catch((err)=>{
+        
+      });
+
+    },
+    clearLeftQuery(labelId = this.leftQuery.labelId){
+      this.leftQuery =  {
+        pageNum: 1,
+        pageSize: 10,
+        labelId,
+        customerName: null,
+        phone:null
+      }
+    },
+    clearRightQuery(labelId = this.rightQuery.labelId){
+      console.log(this.rightQuery);
+      this.rightQuery =  {
+        pageNum: 1,
+        pageSize: 10,
+        labelId,
+        customerName: null,
+        phone:null
+      }
+    },
+    handleLeftChange(val) {
+      let changeArr = [];
+      val.map((ele) => {
+        changeArr.push(ele.phone);
+      });
+      this.moveLeftData = []
+      this.moveRightData = changeArr
+      this.$refs.rightTable.map((ele)=>{
+        ele.clearSelection();
+      });
+    },
+    handleRightChange(val) {
+      let changeArr = [];
+      val.map((ele) => {
+        changeArr.push(ele.phone);
+      });
+      this.moveLeftData = changeArr
+      this.moveRightData = []
+      this.$refs.leftTable.map((ele)=>{
+        ele.clearSelection()
+      });
+    },
+    init() {
+      this.setPageStatus();
+      this.getLabelList();
+    },
+    setPageStatus() {
+      this.queryPageStatus([2]).then((res) => {
+        this.pageStatus = res;
+      });
+    },
+    openLabel(id) {
+      this.clearLeftQuery(id);
+      this.clearRightQuery(id);
+      this.getLeftData();
+      this.getRightData();
+    },
+    // getLabelUser(id) {
+    //   this.loading = true;
+    //   selectCustomerLabelInfo({
+    //     labelId: id,
+    //   })
+    //     .then((res) => {
+    //       if (res.code == 200) {
+    //         this.notCustomerLabelList = res.data.notCustomerLabelList;
+    //         this.customerLabelList = res.data.phoneList;
+    //       } else {
+    //         throw new Error("");
+    //       }
+    //     })
+    //     .catch(() => {
+    //       this.loading = false;
+    //       this.error = true;
+    //       this.msgError("拉取标签下用户信息失败");
+    //     });
+    // },
+    toggleLabel(){
+      console.log(this.moveLeftData);
+      console.log(this.moveRightData);
+      if(this.moveLeftData.length !== 0){
+        this.handleMoveLabel('left',2,null,this.moveLeftData)
+        return;
+      }
+      if(this.moveRightData.length !== 0){
+        this.handleMoveLabel('right',2,null,this.moveRightData)
+        return;
+      }
+      return;
+    },
+
+    getLabelList() {
+      return sysDeptDemoList().then((res) => {
+        if (res.code == 200) {
+          this.labelList = res.data;
+        } else {
+          this.msgError("初始化数据失败");
+        }
+      });
+    },
+
+    // transfer(originlArr, direction, changeArr) {
+    //   const query = {
+    //     labelId: this.activeNames,
+    //     flag: "1",
+    //     phoneList: changeArr,
+    //   };
+    //   if (direction == "right") {
+    //     query.flag = "0";
+    //   } else if (direction == "left") {
+    //     query.flag = "1";
+    //   }
+    //   addAndDelCustomerLabel(query).then((res) => {
+    //     if (res.code == 200) {
+    //       this.getRightUser();
+    //     } else {
+    //     }
+    //   });
+    // },
+  },
+};
+</script>
+
+<style lang="scss">
+.Label_AddUser {
+  .collapse {
+    width: 1200px;
+    margin: 0 auto;
+
+    //.el-collapse-item__wrap {
+    // border-bottom: 1px solid;
+    //}
+
+    .el-transfer-panel {
+      width: 300px;
+      height: 600px;
+    }
+
+    .el-transfer-panel__list.is-filterable {
+      height: 465px;
+    }
+  }
+}
+</style>

src/views/label/Label_AddUser.vue

@@ -1,90 +1,202 @@
 <template>
-  <div>
-    <div class="accordion" id="accordionExample">
-      <div class="card">
-        <div class="card-header" id="headingOne">
-          <h2 class="mb-0">
-            <button
-              class="btn btn-link btn-block text-left"
-              type="button"
-              data-toggle="collapse"
-              data-target="#collapseOne"
-              aria-expanded="true"
-              aria-controls="collapseOne"
-            >
-              Collapsible Group Item #1
-            </button>
-          </h2>
-          导出标签
-        </div>
-
-        <div
-          id="collapseOne"
-          class="collapse show"
-          aria-labelledby="headingOne"
-          data-parent="#accordionExample"
-        >
-          <div class="card-body">
-            Some placeholder content for the first accordion panel. This panel
-            is shown by default, thanks to the <code>.show</code> class.
-          </div>
-        </div>
+  <div v-if="pageStatus == 0">配置加载中...</div>
+  <div v-else-if="pageStatus == 1">此页面只对站点用户开发</div>
+  <div v-else-if="pageStatus == 4">
+    <div  class="Label_AddUser" v-if="labelList.labelFlag == 1">
+      <div v-if="(labelList.labelArr||[]).length == 0">
+        你未添加标签，请先添加标签后再来设置规则
       </div>
-      <div class="card">
-        <div class="card-header" id="headingTwo">
-          <h2 class="mb-0">
-            <button
-              class="btn btn-link btn-block text-left collapsed"
-              type="button"
-              data-toggle="collapse"
-              data-target="#collapseTwo"
-              aria-expanded="false"
-              aria-controls="collapseTwo"
-            >
-              Collapsible Group Item #2
-            </button>
-          </h2>
-        </div>
-        <div
-          id="collapseTwo"
-          class="collapse"
-          aria-labelledby="headingTwo"
-          data-parent="#accordionExample"
+      
+      <el-collapse
+        v-model="activeNames"
+        @change="openLabel"
+        class=""
+        accordion
+      >
+        <el-collapse-item
+          :name="ele.id"
+          v-for="(ele, index) in labelList.labelArr"
+          :key="ele.id"
         >
-          <div class="card-body">
-            Some placeholder content for the second accordion panel. This panel
-            is hidden by default.
-          </div>
-        </div>
-      </div>
-      <div class="card">
-        <div class="card-header" id="headingThree">
-          <h2 class="mb-0">
-            <button
-              class="btn btn-link btn-block text-left collapsed"
-              type="button"
-              data-toggle="collapse"
-              data-target="#collapseThree"
-              aria-expanded="false"
-              aria-controls="collapseThree"
-            >
-              Collapsible Group Item #3
-            </button>
-          </h2>
-        </div>
-        <div
-          id="collapseThree"
-          class="collapse"
-          aria-labelledby="headingThree"
-          data-parent="#accordionExample"
-        >
-          <div class="card-body">
-            And lastly, the placeholder content for the third and final
-            accordion panel. This panel is hidden by default.
-          </div>
-        </div>
-      </div>
+          <template slot="title">
+            标签{{ index + 1 }} <i class="header-icon el-icon-info"></i>
+            <b>{{ ele.labelName }}</b>
+          </template>
+            <el-col :span="11">
+              <div>
+                <el-input
+                  v-model="leftQuery.customerName"
+                  placeholder="输入姓名"
+                  style="width: 150px"
+                  size="mini"
+                  clearable
+                />
+                <el-input
+                  v-model="leftQuery.phone"
+                  placeholder="输入手机号"
+                  style="width: 150px; margin-left: 3px"
+                  size="mini"
+                  clearable
+                />
+                <el-button
+                  type="primary"
+                  size="mini"
+                  icon="el-icon-search"
+                  style="margin-left: 6px"
+                  @click="getLeftData"
+                  >查询</el-button
+                >
+                <el-button
+                  type="danger"
+                  size="mini"
+                  icon="el-icon-delete"
+                  style="margin-left: 6px"
+                  @click="clearLeftQuery()"
+                  >清空</el-button
+                >
+              </div>
+              <el-table
+                :data="leftData"
+                border
+                size="mini"
+                :resizable="false"
+                highlight-current-row
+                height="500"
+                @selection-change="handleLeftChange"
+                disabled
+                ref="leftTable"
+              >
+                >
+                <el-table-column label="可选">
+                  <el-table-column
+                    prop="phone"
+                    label="姓名"
+                    type="selection"
+                  ></el-table-column>
+                  <el-table-column
+                    prop="customerName"
+                    label="姓名"
+                  ></el-table-column>
+                  <el-table-column
+                    prop="phone"
+                    label="手机号"
+                  ></el-table-column>
+                  <el-table-column label="添加" width="60px">
+                    <template slot-scope="scope">
+                      <el-button
+                        type="text"
+                        icon="el-icon-circle-plus-outline"
+                        class="underline btn24"
+                        size="mini"
+                        @click="handleMoveLabel('right', 1, scope.row)"
+                      >添加</el-button>
+                    </template>
+                  </el-table-column>
+                </el-table-column>
+              </el-table>
+  
+              <pagination
+                v-show="leftTotal > 0"
+                :total="leftTotal"
+                :page.sync="leftQuery.pageNum"
+                :limit.sync="leftQuery.pageSize"
+                @pagination="getLeftData"
+                style="margin-bottom:30px"
+                :pagerCount="5"
+                layout="total, prev, pager, next"
+              />
+              
+            </el-col>
+            <el-col :span="2" style="text-align: center;">
+               <el-button type="primary" size="mini" @click="toggleLabel" style="margin-top:200px" :disabled="toggleable">切换</el-button>
+            </el-col>
+            <el-col :span="11">
+              <div>
+                <el-input
+                  v-model="rightQuery.customerName"
+                  placeholder="输入姓名"
+                  style="width: 150px"
+                  size="mini"
+                  clearable
+                />
+                <el-input
+                  v-model="rightQuery.phone"
+                  placeholder="输入手机号"
+                  style="width: 150px; margin-left: 3px"
+                  size="mini"
+                  clearable
+                />
+                <el-button
+                  type="primary"
+                  size="mini"
+                  icon="el-icon-search"
+                  style="margin-left: 6px"
+                  @click="getRightData"
+                  >查询</el-button
+                >
+                <el-button
+                  type="danger"
+                  size="mini"
+                  icon="el-icon-delete"
+                  style="margin-left: 6px"
+                  @click="clearRightQuery()"
+                  >清空</el-button
+                >
+              </div>
+              <el-table
+                :data="rightData"
+                border
+                size="mini"
+                highlight-current-row
+                :resizable="false"
+                height="500"
+                @selection-change="handleRightChange"
+                :loading="true"
+                ref="rightTable"
+              >
+                <el-table-column label="已选" :resizable="false">
+                  <el-table-column
+                    prop="phone"
+                    type="selection"
+                  ></el-table-column>
+                  <el-table-column
+                    prop="customerName"
+                    label="姓名"
+                  ></el-table-column>
+                  <el-table-column
+                    prop="phone"
+                    label="手机号"
+                  ></el-table-column>
+                  <el-table-column label="移除" width="60px">
+                    <template slot-scope="scope">
+                      <el-button
+                        type="text"
+                        icon="el-icon-remove-outline"
+                        class="underline btn24"
+                        size="mini"
+                        @click="handleMoveLabel('left', 1, scope.row)"
+                        >移除</el-button
+                      >
+                    </template>
+                  </el-table-column>
+                </el-table-column>
+              </el-table>
+              <pagination
+                v-show="rightTotal > 0"
+                :total="rightTotal"
+                :page.sync="rightQuery.pageNum"
+                :limit.sync="rightQuery.pageSize"
+                @pagination="getRightData"
+                style="margin-bottom:30px"
+                :pagerCount="5"
+                layout="total, prev, pager, next"
+              />
+            </el-col>
+          
+        </el-collapse-item>
+      </el-collapse>
     </div>
+    <div v-else>你未启用标签功能</div>
   </div>
 </template>
 
@@ -107,54 +219,49 @@ export default {
       loading: false,
       error: false,
       currentLabelId: undefined,
-      pageStatus: 4,
+      pageStatus: 0,
       timer: null,
       leftData: [],
       rightData: [],
-      leftTotal: 100,
-      rightTotal: 100,
+      leftTotal:100,
+      rightTotal:100,
       leftQuery: {
         pageNum: 1,
         pageSize: 10,
-        labelId: null,
+        labelId:null,
         customerName: null,
-        phone: null,
+        phone:null
       },
       rightQuery: {
         pageNum: 1,
         pageSize: 10,
-        labelId: null,
+        labelId:null,
         customerName: null,
-        phone: null,
-      },
-      props: {
-        lazy: true,
-        lazyLoad(node, resolve) {
-          const { level } = node;
-          setTimeout(() => {
-            const nodes = Array.from({ length: level + 1 }).map((item) => ({
-              value: ++id,
-              label: `选项${id}`,
-              leaf: level >= 2,
-            }));
-            // 通过调用resolve将子节点数据返回，通知组件数据加载完成
-            resolve(nodes);
-          }, 1000);
-        },
+        phone:null
       },
+      moveRightData:[],
+      moveLeftData:[]
     };
   },
   created() {
     this.init();
   },
+  computed:{
+    toggleable(){
+      if(this.moveRightData.length === 0 && this.moveLeftData.length === 0){
+        return true;
+      }
+      return false;
+    }
+  },
   methods: {
-    getLeftData() {
+    getLeftData(){
       // this.leftData = [];
       selectNotCustomerLabelInfo(this.leftQuery)
         .then((res) => {
           if (res.code == 200) {
             this.leftData = res.rows;
-            this.leftTotal = res.total;
+            this.leftTotal = res.total
           } else {
             throw new Error("");
           }
@@ -164,8 +271,9 @@ export default {
           this.leftTotal = 0;
           this.msgError("拉取左边标签用户失败，请刷新~");
         });
+      
     },
-    getRightData() {
+    getRightData(){
       // this.rightData = [];
       selectPhoneList(this.rightQuery)
         .then((res) => {
@@ -181,20 +289,17 @@ export default {
           this.rightTotal = 0;
           this.msgError("拉取右边标签用户失败，请刷新~");
         });
+
     },
-    handleMoveLabel(direction = "right", type = 1, row, labelIdArr) {
-      // type 1 传row  type 2 idArr    direction right 向右转移 left 向左转移
-      const changeArr = [];
-      if (type == 1) {
-        changeArr.push(row.phone);
-      } else if (type == 2) {
-        changeArr = labelIdArr;
-      }
+    handleMoveLabel(direction = 'right', type = 1, row, labelIdArr){  // type 1 传row  type 2 idArr    direction right 向右转移 left 向左转移
+       let changeArr = []
+       if(type == 1){
+          changeArr.push(row.phone)
+       }else if(type == 2){
+         changeArr = labelIdArr
+       }
       const query = {
-        labelId:
-          direction == "right"
-            ? this.leftQuery.labelId
-            : this.rightQuery.labelId,
+        labelId: direction == 'right' ? this.leftQuery.labelId : this.rightQuery.labelId,
         flag: "1",
         phoneList: changeArr,
       };
@@ -203,44 +308,61 @@ export default {
       } else if (direction == "left") {
         query.flag = "1";
       }
-      addAndDelCustomerLabel(query)
-        .then((res) => {
-          if (res.code == 200) {
-            this.getLeftData();
-            this.getRightData();
-          } else {
-            throw new Error("");
-          }
-        })
-        .catch((err) => {});
+      addAndDelCustomerLabel(query).then((res) => {
+        if (res.code == 200) {
+          this.getLeftData();
+          this.getRightData();
+        } else {
+          throw new Error("");
+        }
+      }).catch((err)=>{
+        
+      });
+
     },
-    clearLeftQuery(labelId = this.leftQuery.labelId) {
-      this.leftQuery = {
+    clearLeftQuery(labelId = this.leftQuery.labelId){
+      this.leftQuery =  {
         pageNum: 1,
         pageSize: 10,
         labelId,
         customerName: null,
-        phone: null,
-      };
+        phone:null
+      }
     },
-    clearRightQuery(labelId = this.rightQuery.labelId) {
+    clearRightQuery(labelId = this.rightQuery.labelId){
       console.log(this.rightQuery);
-      this.rightQuery = {
+      this.rightQuery =  {
         pageNum: 1,
         pageSize: 10,
         labelId,
         customerName: null,
-        phone: null,
-      };
+        phone:null
+      }
     },
-    handleSelectionChange(val) {
+    handleLeftChange(val) {
       let changeArr = [];
       val.map((ele) => {
         changeArr.push(ele.phone);
       });
+      this.moveLeftData = []
+      this.moveRightData = changeArr
+      this.$refs.rightTable.map((ele)=>{
+        ele.clearSelection();
+      });
+    },
+    handleRightChange(val) {
+      let changeArr = [];
+      val.map((ele) => {
+        changeArr.push(ele.phone);
+      });
+      this.moveLeftData = changeArr
+      this.moveRightData = []
+      this.$refs.leftTable.map((ele)=>{
+        ele.clearSelection()
+      });
     },
-
     init() {
+      this.setPageStatus();
       this.getLabelList();
     },
     setPageStatus() {
@@ -273,8 +395,18 @@ export default {
     //       this.msgError("拉取标签下用户信息失败");
     //     });
     // },
-    toggleLabel() {
-      console.log("hahaha");
+    toggleLabel(){
+      console.log(this.moveLeftData);
+      console.log(this.moveRightData);
+      if(this.moveLeftData.length !== 0){
+        this.handleMoveLabel('left',2,null,this.moveLeftData)
+        return;
+      }
+      if(this.moveRightData.length !== 0){
+        this.handleMoveLabel('right',2,null,this.moveRightData)
+        return;
+      }
+      return;
     },
 
     getLabelList() {
@@ -288,7 +420,6 @@ export default {
     },
 
     // transfer(originlArr, direction, changeArr) {
-
     //   const query = {
     //     labelId: this.activeNames,
     //     flag: "1",

src/views/market/Market_Discount.vue

@@ -27,6 +27,7 @@
           <el-option label="满减" value="1"></el-option>
           <el-option label="立减" value="2"></el-option>
           <el-option label="直降" value="3"></el-option>
+          <el-option label="阶梯直降" value="4"></el-option>
         </el-select>
         <el-button size="mini" @click="save" type="primary"
           >确定执行该优惠方案</el-button
@@ -270,21 +271,10 @@
       v-show="discountSetting != 0"
     >
       <div>
-        <span style="color: #ff9955; font-size: 25px">|</span
-        ><span style="font-size: 25px">
-          {{
-            this.discountSetting == 1
-              ? "满减方案"
-              : this.discountSetting == 2
-              ? "立减方案"
-              : this.discountSetting == 3
-              ? "直降方案"
-              : "无"
-          }}
-        </span>
         <el-button
           icon="el-icon-plus"
-          size="mini"
+          size="small"
+          class="mb-3 mr-4"
           @click="handleUpdateClick"
           style="float: right"
           type="warning"
@@ -581,49 +571,61 @@ export default {
       this.$refs["ruleForm"].validate((valid) => {
         if (valid) {
           if (this.ruleForm.deptId != null) {
+            let upPromise = null
             let e = this.ruleForm.discountSetting;
             if (e == "0") {
-              updatePay(this.ruleForm).then((response) => {
+              upPromise = updatePay(this.ruleForm).then((response) => {
                 this.msgSuccess("优惠方案设置成功");
               });
             } else if (e == "1") {
               if (this.discountList.length > 0) {
-                updatePay(this.ruleForm).then((response) => {
+                upPromise = updatePay(this.ruleForm).then((response) => {
                   this.msgSuccess("优惠方案设置成功");
                 });
               } else {
                 this.msgError("满减规则下无方案");
+                return;
               }
             } else if (e == "2") {
               if (this.discountList.length > 0) {
-                updatePay(this.ruleForm).then((response) => {
+                upPromise = updatePay(this.ruleForm).then((response) => {
                   this.msgSuccess("优惠方案设置成功");
                 });
               } else {
                 this.msgError("立减规则下无方案");
+                return;
               }
             } else if (e == "3") {
               if (this.discountList.length > 0) {
-                updatePay(this.ruleForm).then((response) => {
+                upPromise = updatePay(this.ruleForm).then((response) => {
                   this.msgSuccess("优惠方案设置成功");
                 });
               } else {
                 this.msgError("直降规则下无方案");
+                return;
               }
             }
+            upPromise.catch((err)=>{
+              this.msgError("设置时出错，请刷新后重试~")
+            }).then((res) => {
+              this.getPay();
+            })
+          }else{
+            this.getPay();
           }
-          this.getPay();
+          
         }
       });
     },
     discountSettingChang(e) {
+      console.log(e)
       this.discountSetting = e;
       this.getList();
     },
     getList() {
       const query = {
         pageNum: 1,
-        pageSize: 10,
+        pageSize: 100,
         discountPlanType: this.discountSetting,
       };
       listPlan(query).then((response) => {