feat:“添加分销撤销申请功能，优化分销设置”

src/assets/language/zh.json

@@ -317,6 +317,7 @@
     "delete": "删除",
     "continueToAddDistributors": "继续添加分销人",
     "submitForApproval": "提交审批",
+    "cancelForApproval": "撤销审批",
     "timeSwitch": "定时开关",
     "addAlarmClock": "添加闹钟",
     "modify": "修改",
@@ -670,7 +671,7 @@
   },
   "distributionSet": {
     "distributionSettings": "分销设置",
-    "total": "共 ",
+    "total": "共",
     "leftTitle": " 条分销设置",
     "rightAdd": "添加设备分销人",
     "equipName": "设备名称",
@@ -678,6 +679,11 @@
     "distProp": "分销比例",
     "applTime": "申请时间",
     "reviewed": "已审核",
+    "agree": "通过",
+    "rejected": "拒绝",
+    "cancel": "撤销",
+    "changeTips":"确认撤销此条分销申请吗？",
+    "cancelSuccess": "撤销成功",
     "apprPend": "待审批",
     "addDist": {
       "title": "添加分销人",
@@ -687,9 +693,11 @@
       "clientIdPlace": "请选择设备编码",
       "myDistProport": "我的分销比例",
       "distInof": "分销信息",
+      "pendingRecord": "待审批记录",
       "platDistRange": "平台分销比例范围为1-100",
-      "distPropRange": "分销比例范围为0-100",
+      "distPropRange": "分销比例范围为1-99",
       "noZero": "平台分销比例最低为1%",
+      "zeroDis": "分账人分销比例不能为0%",
       "notDelMore": "不能再删除了",
       "submitSuccess": "提交成功",
       "submitFailed": "提交失败",
@@ -1208,7 +1216,7 @@
     "proportion": "比例",
     "fail": "不通过",
     "adopt": "通过",
-    "cancel": "取消",
+    "cancel": "撤销",
     "operationSucceeded": "操作成功",
     "taskMessage": "任务消息",
     "toViewAppro": "查看待审批的申请",

src/service/distributionSet/index.js

@@ -1,10 +1,23 @@
-import axios from '../../utils/axios';
+import axios from "../../utils/axios";
+import { stringToUrl } from '@/common/js/utils';
 
 // 获取分销列表
 export function Api_getPageProportion(params) {
-  return axios.get(`/SZWL-SERVER/tProportion/pageProportion`,{params});
+  return axios.get(`/SZWL-SERVER/tProportion/pageProportion`, { params });
 }
+
 // 获取单个分销
 export function Api_getDistriDetail(params) {
-  return axios.get(`/SZWL-SERVER/tProportion/getById`,{params});
+  return axios.get(`/SZWL-SERVER/tProportion/getById`, { params });
+}
+
+// 撤销分销申请
+
+export function Api_cancelDistri(params) {
+  return axios.post(`/SZWL-SERVER/tProportionCheck/update?${stringToUrl(params)}`, { params });
+}
+
+// 获取待审核记录
+export function Api_getCheckPending(params) {
+  return axios.get(`/SZWL-SERVER/tProportionCheck/getCheckPending`, { params });
 }

src/styles/distributionSet/index.less

@@ -60,10 +60,23 @@
             .effective {
                 color: #4dc193;
             }
+
+            .cancel {
+                color: #f5b33a;
+            }
+
+            .rejected {
+                color: #df5e4c;
+            }
         }
 
         .approval {
-            color: #df5e4c;
+            color: #f5b33a;
+        }
+
+        .cancelBtn {
+            height: 25px;
+            padding: 0 5px;
         }
     }
 }

src/views/distributionSet/detail.vue

@@ -1,35 +1,100 @@
 <template>
   <div class="distributionDetailIdx">
     <s-header :name="title" :noback="false"></s-header>
-    <van-form show-error-message @submit="onSubmit">
-      <div class="cust_vantBorder">
-        <div class="kBordBott">
-          <template v-if="clientId">
-            <van-field disabled colon :border="false" v-model="cofficentForm.clientId" clearable label-width="110"
-              name="clientId" :label="$t('distributionSet.addDist.clientId')"
-              :placeholder="$t('distributionSet.addDist.autoBrought')" />
-          </template>
-          <template v-else>
-            <van-field colon :border="false" required @click-input="busiInpClk" readonly clearable label-width="110"
-              v-model="cofficentForm.clientId" :placeholder="$t('distributionSet.addDist.clientIdPlace')"
-              :label="$t('distributionSet.addDist.clientId')" name="clientId"
-              :rules="[{ required: true, message: $t('distributionSet.addDist.clientIdPlace') }]">
-              <template #right-icon>
-                <div class="l-flex-RC">
-                  <van-icon v-if="cofficentForm.clientId" @click="cofficentForm.clientId = ''" class="o-mr-6"
-                    name="clear" />
-                  <van-icon @click="busiInpClk" name="arrow-down" />
-                </div>
-              </template>
-            </van-field>
-          </template>
-          <div class="l-flex-RC o-p-5 c-text-13 c-text-b">
-            <div style="padding: var(--van-cell-vertical-padding) var(--van-cell-horizontal-padding);">
-              {{ $t('distributionSet.addDist.distInof') }}
+    <div class="cust_vantBorder">
+      <div class="kBordBott">
+        <template v-if="clientId">
+          <van-field disabled colon :border="false" v-model="cofficentForm.clientId" clearable label-width="110"
+            name="clientId" :label="$t('distributionSet.addDist.clientId')"
+            :placeholder="$t('distributionSet.addDist.autoBrought')" />
+        </template>
+        <template v-else>
+          <van-field colon :border="false" required @click-input="busiInpClk" readonly clearable label-width="110"
+            v-model="cofficentForm.clientId" :placeholder="$t('distributionSet.addDist.clientIdPlace')"
+            :label="$t('distributionSet.addDist.clientId')" name="clientId"
+            :rules="[{ required: true, message: $t('distributionSet.addDist.clientIdPlace') }]">
+            <template #right-icon>
+              <div class="l-flex-RC">
+                <van-icon v-if="cofficentForm.clientId" @click="cofficentForm.clientId = ''" class="o-mr-6"
+                  name="clear" />
+                <van-icon @click="busiInpClk" name="arrow-down" />
+              </div>
+            </template>
+          </van-field>
+        </template>
+        <div class="l-flex-RC o-p-5 c-text-13 c-text-b">
+          <div v-if="proportionCheck"
+            style="padding: var(--van-cell-vertical-padding) var(--van-cell-horizontal-padding);">
+            {{ $t('distributionSet.addDist.pendingRecord') }}
+          </div>
+          <div v-else style="padding: var(--van-cell-vertical-padding) var(--van-cell-horizontal-padding);">
+            {{ $t('distributionSet.addDist.distInof') }}
+          </div>
+        </div>
+      </div>
+      <div v-if="proportionCheck">
+        <div class="l-flex-RC" style="padding: var(--van-cell-vertical-padding) var(--van-cell-horizontal-padding);">
+          <div class="c-text-13">
+            &nbsp;&nbsp;{{ $t('device.proportionOfPlatformDistributionLabel') }}：
+          </div>
+          <div class="c-text-14 c-text-b c-text-color">{{ proportionCheck.adminProportion }}%</div>
+        </div>
+        <div class="l-flex-RC" style="padding: var(--van-cell-vertical-padding) var(--van-cell-horizontal-padding);">
+          <div class="c-text-13">
+            &nbsp;&nbsp;{{ $t('distributionSet.addDist.myDistProport') }}：
+          </div>
+          <div class="c-text-14 c-text-b c-text-color">{{ proportionCheck.proportion }}%</div>
+        </div>
+        <div v-if="proportionCheck.agencyId" class="l-flex-RC" style="padding: var(--van-cell-vertical-padding) var(--van-cell-horizontal-padding);">
+          <div class="l-flex-RC o-pr-20">
+            <div class="c-text-13">
+              &nbsp;&nbsp;{{ $t('device.accountNoOfDistributorLabel') }}：
+            </div>
+            <div class="c-text-14 c-text-b c-text-color">{{ proportionCheck.agencyName }}</div>
+          </div>
+          <div class="l-flex-RC">
+            <div class="c-text-13" >
+              &nbsp;&nbsp;{{ $t('device.distributionProportionLabel') }}：
             </div>
-            <!-- <div class="c-text-13 c-text-b" style="color: #A8A8C5;">{{ $t('distributionSet.addDist.distInof') }}
-            </div> -->
+            <div class="c-text-14 c-text-b c-text-color">{{ proportionCheck.agencyProportion }}%</div>
           </div>
+        </div>
+        <div v-if="proportionCheck.merchantId" class="l-flex-RC" style="padding: var(--van-cell-vertical-padding) var(--van-cell-horizontal-padding);">
+          <div class="l-flex-RC o-pr-20">
+            <div class="c-text-13">
+              &nbsp;&nbsp;{{ $t('device.accountNoOfDistributorLabel') }}：
+            </div>
+            <div class="c-text-14 c-text-b c-text-color">{{ proportionCheck.merchantName }}</div>
+          </div>
+          <div class="l-flex-RC">
+            <div class="c-text-13" >
+              &nbsp;&nbsp;{{ $t('device.distributionProportionLabel') }}：
+            </div>
+            <div class="c-text-14 c-text-b c-text-color">{{ proportionCheck.merchantProportion }}%</div>
+          </div>
+        </div>
+        <div v-if="proportionCheck.personageId" class="l-flex-RC" style="padding: var(--van-cell-vertical-padding) var(--van-cell-horizontal-padding);">
+          <div class="l-flex-RC o-pr-20">
+            <div class="c-text-13">
+              &nbsp;&nbsp;{{ $t('device.accountNoOfDistributorLabel') }}：
+            </div>
+            <div class="c-text-14 c-text-b c-text-color">{{ proportionCheck.personageName }}</div>
+          </div>
+          <div class="l-flex-RC">
+            <div class="c-text-13" >
+              &nbsp;&nbsp;{{ $t('device.distributionProportionLabel') }}：
+            </div>
+            <div class="c-text-14 c-text-b c-text-color">{{ proportionCheck.personageProportion }}%</div>
+          </div>
+        </div>
+        <div style="margin: 50px;">
+          <van-button round block type="primary" @click="cancelDistri(proportionCheck.id)">
+            {{ $t('device.cancelForApproval') }}
+          </van-button>
+        </div>
+      </div>
+      <div v-else>
+        <van-form show-error-message @submit="onSubmit">
           <div class="noPaddingTopCell l-flex-RC">
             <van-field type="digit" colon :border="false" required v-model="cofficentForm.distProp" clearable
               label-width="110" name="distProp" :label="$t('device.proportionOfPlatformDistributionLabel')"
@@ -38,41 +103,43 @@
             <span class="o-pl-10 c-text-18 c-text-b" style="color: #434D74;">%</span>
           </div>
           <div class="l-flex-RC">
-            <div class="c-text-14" style="padding: var(--van-cell-vertical-padding) var(--van-cell-horizontal-padding);">
+            <div class="c-text-13"
+              style="padding: var(--van-cell-vertical-padding) var(--van-cell-horizontal-padding);">
               &nbsp;&nbsp;{{ $t('distributionSet.addDist.myDistProport') }}：
             </div>
             <div class="c-text-13 c-text-b c-text-color">{{ myDistProp }}%</div>
           </div>
-        </div>
-        <div v-for="(item, index) in distPropList" :key="index" class="kBordBott">
-          <van-field colon :border="false" required v-model="item.name1" clearable label-width="110" name="name1"
-            :label="$t('device.accountNoOfDistributorLabel')"
-            :placeholder="$t('device.accountNoOfDistributorPlaceholder')"
-            :rules="[{ required: true, message: $t('device.accountNoOfDistributorPlaceholder') }]" />
-          <div class="l-flex-between noPaddingRCell">
-            <div class="l-flex-RC">
-              <van-field type="digit" colon :border="false" required v-model="item.name2" clearable label-width="110"
-                name="name2" :label="$t('device.distributionProportionLabel')"
-                :placeholder="$t('device.distributionProportionPlaceholder')"
-                :rules="[{ required: true, message: $t('device.distributionProportionPlaceholder') }, { required: true, validator: distPropVali, message: $t('distributionSet.addDist.distPropRange'), trigger: ['onChange', 'onBlur', 'onSubmit'] }]" />
-              <span class="o-pl-10 c-text-18 c-text-b" style="color: #434D74;">%</span>
-            </div>
-            <div @click="toDele(index)" class="l-flex-RC" style="color: #FE5D55;">
-              <van-icon size="18" name="delete-o" />
-              <span class="c-text-12">{{ $t('device.delete') }}</span>
+          <div v-for="(item, index) in distPropList" :key="index" class="kBordBott">
+            <van-field colon :border="false" required v-model="item.name1" clearable label-width="110" name="name1"
+              :label="$t('device.accountNoOfDistributorLabel')"
+              :placeholder="$t('device.accountNoOfDistributorPlaceholder')"
+              :rules="[{ required: true, message: $t('device.accountNoOfDistributorPlaceholder') }]" />
+            <div class="l-flex-between noPaddingRCell">
+              <div class="l-flex-RC">
+                <van-field type="digit" colon :border="false" required v-model="item.name2" clearable label-width="110"
+                  name="name2" :label="$t('device.distributionProportionLabel')"
+                  :placeholder="$t('device.distributionProportionPlaceholder')"
+                  :rules="[{ required: true, message: $t('device.distributionProportionPlaceholder') }, { required: true, validator: distPropVali, message: $t('distributionSet.addDist.distPropRange'), trigger: ['onChange', 'onBlur', 'onSubmit'] }]" />
+                <span class="o-pl-10 c-text-18 c-text-b" style="color: #434D74;">%</span>
+              </div>
+              <div @click="toDele(index)" class="l-flex-RC" style="color: #FE5D55;">
+                <van-icon size="18" name="delete-o" />
+                <span class="c-text-12">{{ $t('device.delete') }}</span>
+              </div>
             </div>
           </div>
-        </div>
-      </div>
-      <div v-if="distPropList.length <= 2" @click="toAdd" class="kBordBott l-flex-center o-ptb-20 c-text-14 c-text-w6">
-        +{{ $t('device.continueToAddDistributors') }}
-      </div>
-      <div style="margin: 16px;">
-        <van-button round block type="primary" native-type="submit">
-          {{ $t('device.submitForApproval') }}
-        </van-button>
+          <div v-if="distPropList.length <= 2" @click="toAdd"
+            class="kBordBott l-flex-center o-ptb-20 c-text-14 c-text-w6">
+            +{{ $t('device.continueToAddDistributors') }}
+          </div>
+          <div style="margin: 50px;">
+            <van-button round block type="primary" native-type="submit">
+              {{ $t('device.submitForApproval') }}
+            </van-button>
+          </div>
+        </van-form>
       </div>
-    </van-form>
+    </div>
     <!-- 设备编码选择框 -->
     <van-popup v-model:show="busiPopShow" position="bottom">
       <van-picker :title="$t('distributionSet.addDist.clientIdPlace')" :columns="busiPopList"
@@ -83,28 +150,31 @@
 
 <script>
 import { getEquipmentList } from '@/service/typeSelectList';
-import { Api_getDistriDetail } from "@/service/distributionSet";
+import { Api_getDistriDetail, Api_getCheckPending, Api_cancelDistri } from "@/service/distributionSet";
 import { saveProportion, getProportion } from '@/service/device';
 import sHeader from "@/components/SimpleHeader";
-import { showToast } from 'vant';
 import { computed, onMounted, reactive, ref } from 'vue';
 import { getLoginUser } from "@/common/js/utils";
 import { useRoute, useRouter } from "vue-router";
 import { useI18n } from 'vue-i18n';
 import { styleUrl } from '../../common/js/utils';
+import { showToast, showConfirmDialog, showSuccessToast, showFailToast } from "vant";
+
 export default {
   components: { sHeader },
   setup() {
     const route = useRoute();
     // 定义设备id，如果路由中有，那就是设备编辑里面进来的
     const clientId = ref('');
+    // 待审核记录
+    const proportionCheck = ref(null);
+    const id = route.query.id || '';
+    const type = route.query.type || '';
     onMounted(() => {
       // 加载样式
       styleUrl('distributionSet');
 
       clientId.value = route.query.clientId || '';
-      const id = route.query.id || '';
-      const type = route.query.type || '';
       cofficentForm.clientId = clientId.value;
       // 如果没有携带编码进来，那就请求接口让用户选择机器编码
       if (!clientId.value) {
@@ -117,7 +187,9 @@ export default {
           // 如果设备操作里进来的
           getProportionFun(2, clientId.value);
         }
+        getCheckPending();
       }
+      console.log("待审核记录1", proportionCheck.value);
     });
     // 获取分销详情填充信息
     // 获取分销信息填充
@@ -128,7 +200,7 @@ export default {
       } else {
         res = await getProportion({ adminId: user.id, clientId: id });
       }
-      console.log('res', res)
+      // console.log('res', res)
       const data = res.data;
       if (data.code === '00000') {
         cofficentForm.clientId = data.data.clientId;
@@ -149,7 +221,7 @@ export default {
           distPropList[2]['name1'] = data.data.personageName;
           distPropList[2]['name2'] = data.data.personageProportion;
         }
-        console.log('distPropList1111', distPropList)
+        // console.log('distPropList1111', distPropList)
       }
     }
     const { t } = useI18n();
@@ -180,6 +252,21 @@ export default {
         showToast(t('distributionSet.addDist.noZero'));
         return;
       }
+      if (distPropList.length > 0) {
+        if (distPropList[0] && distPropList[0]['name2'] == '0') {
+          showToast(t('distributionSet.addDist.zeroDis'));
+          return;
+        }
+        if (distPropList[1] && distPropList[1]['name2'] == '0') {
+          showToast(t('distributionSet.addDist.zeroDis'));
+          return;
+        }
+        if (distPropList[2] && distPropList[2]['name2'] == '0') {
+          showToast(t('distributionSet.addDist.zeroDis'));
+          return;
+        }
+      }
+      console.log("分销比例", cofficentForm.distProp)
       let param = {
         adminId: user.id,
         clientId: cofficentForm.clientId,
@@ -234,7 +321,7 @@ export default {
         busiPopList.value = data.data.map(item => {
           return { name: item.name != null ? item.name : item.clientId, clientId: item.clientId }
         });
-        console.log(busiPopList.value);
+        // console.log(busiPopList.value);
       }
     }
     // 设备编码选择框
@@ -249,16 +336,60 @@ export default {
     };
     // 点击确定按钮
     const busiPopConfirm = ({ selectedOptions }) => {
-      console.log(selectedOptions[0]);
+      // console.log(selectedOptions[0]);
       busiPopShow.value = false;
       cofficentForm.clientId = selectedOptions[0].clientId;
 
       // 重新获取当前设备的分销情况
       getProportionFun(2, selectedOptions[0].clientId);
+      getCheckPending();
     };
     const busiPopCancel = () => {
       busiPopShow.value = false;
     };
+
+    // 获取已提交的审核记录
+    const getCheckPending = async () => {
+      const { data } = await Api_getCheckPending({ adminId: user.id, clientId: cofficentForm.clientId });
+      if (data.code === '00000') {
+        // 存在审核记录，则不能再提交
+        proportionCheck.value = data.data;
+        console.log("待审核记录", proportionCheck.value);
+      }
+    }
+
+    // 撤销分销申请
+    const cancelDistri = (value) => {
+      showConfirmDialog({
+        title: t('user.tips'),
+        message: t('distributionSet.changeTips'),
+      }).then(async () => {
+        const { data } = await Api_cancelDistri({ id: value });
+        if (data.code == "00000") {
+          showSuccessToast(t('distributionSet.cancelSuccess'));
+          setTimeout(() => {
+            proportionCheck.value = [];
+            if (!clientId.value) {
+              getDeviceListFun();
+            } else {
+              if (id) {
+                // 如果是从分销列表进来的
+                getProportionFun(1, id, type);
+              } else {
+                // 如果设备操作里进来的
+                getProportionFun(2, clientId.value);
+              }
+              getCheckPending();
+            }
+          }, 1000);
+        } else {
+          showFailToast(data.message);
+        }
+      }).catch((error) => {
+        console.error(error);
+      })
+    }
+
     return {
       onSubmit,
       cofficentForm,
@@ -275,6 +406,8 @@ export default {
       busiPopConfirm,
       busiPopCancel,
       clientId,
+      proportionCheck,
+      cancelDistri,
     };
   }
 }

src/views/distributionSet/index.vue

@@ -23,7 +23,7 @@
       <van-pull-refresh disabled v-model="refreshing" @refresh="onRefresh">
         <van-list v-model="loading" :finished="finished" :finished-text="$t('common.noMoreTxt')" @load="onLoad"
           :offset="300" :immediate-check="false">
-          <div v-for="item in tableData" :key="item.id" @click="toDetail(item)"
+          <div v-for="item in tableData" :key="item.id"
             class="o-plr-14 o-ptb-16 contentCon kBordBott">
             <div class="content l-flex-between">
               <div>
@@ -32,7 +32,16 @@
                   item.equipmentName
                 }}</span>
               </div>
-              <van-icon color="#B9BAD0" size="20" name="arrow" />
+              <!-- <van-icon color="#B9BAD0" size="20" name="arrow" /> -->
+            </div>
+            <div v-if="item.proportion" class="content l-flex-RC">
+              <div class="l-flex-RC">
+                <span class="titleName c-text-13">机主</span>
+              </div>
+              <div class="o-ml-30">
+                <span class="titleName c-text-13">{{ $t('distributionSet.distProp') }}：</span>
+                <span class="valueName c-text-13">{{ item.proportion }}%</span>
+              </div>
             </div>
             <div v-if="item.agencyProportion" class="content l-flex-RC">
               <div class="l-flex-RC">
@@ -70,15 +79,24 @@
                 <span class="valueName c-text-13">{{ item.personageProportion }}%</span>
               </div>
             </div>
-            <div class="content l-flex-RC">
+            <div class="content l-flex-between">
               <div>
                 <span class="titleName c-text-13">{{ $t('distributionSet.applTime') }}：</span>
                 <span class="valueName c-text-13">{{
-                  Format_time(item.createDate, "YYYY-MM-DD HH:MM")
+                  Format_time(item.createDate)
                 }}</span>
               </div>
-              <div v-if="tabActive === 1" class="effective c-text-15 c-text-w5 o-ml-20">
-                {{ $t('distributionSet.reviewed') }}
+              <van-button @click="cancelDistribution(item.id)" v-if="item.checkType === '0'" class="cancelBtn" type="warning" icon="revoke">
+                {{ $t('distributionSet.cancel') }}
+              </van-button>
+              <div v-if="item.checkType === '1'" class="effective c-text-15 c-text-w5 o-ml-20">
+                {{ $t('distributionSet.agree') }}
+              </div>
+              <div v-if="item.checkType === '2'" class="cancel c-text-15 c-text-w5 o-ml-20">
+                {{ $t('distributionSet.cancel') }}
+              </div>
+              <div v-if="item.checkType === '3'" class="rejected c-text-15 c-text-w5 o-ml-20">
+                {{ $t('distributionSet.rejected') }}
               </div>
             </div>
             <div v-if="tabActive === 0" class="approval c-text-15 c-text-w5 o-mt-6">
@@ -95,13 +113,14 @@
 // 导入公用方法
 import { Format_time } from "../../common/js/utils";
 // 导入接口
-import { Api_getPageProportion } from "../../service/distributionSet";
+import { Api_getPageProportion, Api_cancelDistri } from "../../service/distributionSet";
 import { onMounted, toRefs, ref, reactive } from "vue";
 import sHeader from "../../components/SimpleHeader";
 import { useRouter } from "vue-router";
 import { getLoginUser, styleUrl } from "../../common/js/utils";
 import kTabs from "../../components/commom/kTabs/index.vue";
 import { useI18n } from 'vue-i18n';
+import { showConfirmDialog, showSuccessToast, showFailToast } from "vant";
 
 export default {
   components: { sHeader, kTabs },
@@ -194,7 +213,6 @@ export default {
           });
         }
         ruleData.tableData.push(...data.records);
-        console.log(ruleData.tableData);
         // 加载状态结束
         loading.value = false;
         // // 总共
@@ -205,6 +223,32 @@ export default {
       });
     };
 
+    // 撤销分销申请
+    const cancelDistribution = (id)=> {
+      const params = {
+        id: id,
+      }
+      showConfirmDialog({
+        title: t('user.tips'),
+        message: t('distributionSet.changeTips'),
+      }).then(async() => {
+        const { data } = await Api_cancelDistri(params);
+        if (data.code == "00000") {
+          showSuccessToast(t('distributionSet.cancelSuccess'));
+          setTimeout(() => {
+            ruleData.tableData = [];
+            pageNo.value = 1;
+            pageSize.value = 20;
+            getList();
+          }, 1000);
+        } else {
+          showFailToast(data.message);
+        }
+      }).catch((error) => {
+        console.error(error);
+      })
+    }
+
     return {
       toDetail,
       pageNo,
@@ -221,6 +265,7 @@ export default {
       tabList,
       Format_time,
       total,
+      cancelDistribution,
     };
   },
 };