目录格式改了一下

src/App.vue

@@ -112,29 +112,30 @@ body {
   letter-spacing: 2px;
   font-weight: 600;
 }
+.van-submit-bar__button {
+  width: unset !important;
+  padding: 0 12px !important;
+  --van-submit-bar-button-height: 28px;
+  --van-font-weight-bold: 500;
+  .van-button__text {
+    font-size: 14px;
+  }
+}
 .save_btn {
-  position: fixed;
-  bottom: 0;
-  width: 100%;
-  padding: 8px 16px;
   background-color: #ffffff;
-  box-shadow: 0px -2px 10px 0px rgba(0, 0, 0, 0.2);
-  .van-button {
-    width: calc(100% - 32px);
-  }
+  --van-submit-bar-height: 60px;
 }
 .van-tab--active,
 .van-cascader {
   --van-font-weight-bold: 500;
 }
 .van-empty {
-  padding: 16px 0!important;
+  padding: 16px 0 !important;
   .van-empty__description {
-    margin-top: 10px!important;
+    margin-top: 10px !important;
   }
 }
 :root {
-  --van-gray-3: unset;
   --van-gray-5: #999999;
   --van-gray-6: #999999;
   --van-gray-7: #666666;

src/assets/close.svg

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>矩形</title>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="租户-线上报修" transform="translate(-16.000000, -54.000000)">
+            <rect fill="#F8F8F8" x="0" y="0" width="375" height="812"></rect>
+            <g id="标题" transform="translate(0.000000, 44.000000)">
+                <g id="矩形" fill="#FFFFFF">
+                    <rect x="0" y="0" width="375" height="44"></rect>
+                </g>
+                <g id="编组" transform="translate(16.000000, 10.000000)" stroke="#666666" stroke-linecap="round">
+                    <g>
+                        <line x1="5.5" y1="4.5" x2="18.6066017" y2="19.5934668" id="路径-8"></line>
+                        <polyline id="路径-8备份" points="18.6066017 4.5 11.8251139 12.3095118 5.5 19.5934668"></polyline>
+                    </g>
+                </g>
+                <g id="返回" transform="translate(16.000000, 10.000000)" stroke="#666666" stroke-linecap="round">
+                    <line x1="5.5" y1="4.5" x2="18.6066017" y2="19.5934668" id="路径-8"></line>
+                    <polyline id="路径-8备份" points="18.6066017 4.5 11.8251139 12.3095118 5.5 19.5934668"></polyline>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

src/assets/unchecked.svg

@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>矩形</title>
+    <defs>
+        <rect id="path-1" x="16" y="350" width="343" height="112" rx="4"></rect>
+        <filter x="-2.6%" y="-8.0%" width="105.2%" height="116.1%" filterUnits="objectBoundingBox" id="filter-2">
+            <feOffset dx="0" dy="0" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0.2   0 0 0 0 0.2   0 0 0 0 0.2  0 0 0 0.0801020269 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+        </filter>
+    </defs>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="租户-账单待缴" transform="translate(-24.000000, -365.000000)">
+            <rect fill="#F8F8F8" x="0" y="0" width="375" height="812"></rect>
+            <g id="矩形备份">
+                <use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
+                <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-1"></use>
+            </g>
+            <g id="椭圆形" transform="translate(24.000000, 365.000000)" fill="#E6E7EA" stroke="#D8D8D8">
+                <circle cx="12" cy="12" r="7.5"></circle>
+            </g>
+            <g id="返回备份" transform="translate(24.000000, 365.000000)" fill="#E6E7EA" stroke="#D8D8D8">
+                <circle id="椭圆形" cx="12" cy="12" r="7.5"></circle>
+            </g>
+        </g>
+    </g>
+</svg>

src/router/index.js

@@ -30,44 +30,114 @@ const routes = [
     },
   },
   {
-    name: 'repairOnline',
-    path: '/repairOnline',
-    component: () => import('../views/repairOnline'),
-    meta: {
-      title: '线上报修',
-    },
+    path: '/repair',
+    component: () => import('../views/repair/index.vue'),
+    children: [
+      {
+        name: 'repairOnline',
+        path: 'create',
+        component: () => import('../views/repair/create.vue'),
+        meta: {
+          title: '线上报修',
+        },
+      },
+      {
+        name: 'repairList',
+        path: 'list',
+        component: () => import('../views/repair/list.vue'),
+        meta: {
+          title: '工单待办',
+        },
+      },
+      {
+        name: 'repairDetail',
+        path: 'detail',
+        component: () => import('../views/repair/detail.vue'),
+        meta: {
+          title: '工单详情',
+        },
+      },
+    ]
   },
   {
-    name: 'reviewRecord',
-    path: '/reviewRecord',
-    component: () => import('../views/reviewRecord'),
-    meta: {
-      title: '巡检记录',
-    },
+    path: '/review',
+    component: () => import('../views/review/index.vue'),
+    children: [
+      {
+        name: 'reviewRecord',
+        path: 'list',
+        component: () => import('../views/review/list.vue'),
+        meta: {
+          title: '巡检记录',
+        },
+      },
+      {
+        name: 'repairClock',
+        path: 'create',
+        component: () => import('../views/review/create.vue'),
+        meta: {
+          title: '巡检打卡',
+        },
+      },
+    ]
   },
   {
-    name: 'reduceRecord',
-    path: '/reduceRecord',
-    component: () => import('../views/reduceRecord'),
-    meta: {
-      title: '扣缴记录',
-    },
+    path: '/bill',
+    component: () => import('../views/bill/index.vue'),
+    children: [
+      {
+        name: 'billList',
+        path: 'list',
+        component: () => import('../views/bill/list.vue'),
+        meta: {
+          title: '租户账单',
+        },
+      },
+      {
+        name: 'billDetail',
+        path: 'detail',
+        component: () => import('../views/bill/detail.vue'),
+        meta: {
+          title: '账单明细',
+        },
+      },
+    ]
   },
   {
-    name: 'deviceAlarm',
-    path: '/deviceAlarm',
-    component: () => import('../views/deviceAlarm'),
-    meta: {
-      title: '设备异常',
-    },
+    path: '/pay',
+    component: () => import('../views/pay/index.vue'),
+    children: [
+      {
+        name: 'payRecord',
+        path: 'record',
+        component: () => import('../views/pay/record.vue'),
+        meta: {
+          title: '扣缴记录',
+        },
+      },
+      {
+        name: 'payFee',
+        path: 'fee',
+        component: () => import('../views/pay/fee.vue'),
+        meta: {
+          title: '欠费待收',
+        },
+      },
+    ]
   },
   {
-    name: 'lackFee',
-    path: '/lackFee',
-    component: () => import('../views/lackFee'),
-    meta: {
-      title: '欠费待收',
-    },
+    path: '/device',
+    component: () => import('../views/device/index.vue'),
+    children: [
+      {
+        name: 'deviceAlarm',
+        path: 'list',
+        component: () => import('../views/device/list.vue'),
+        meta: {
+          title: '设备异常',
+        },
+      },
+    ]
   },
   {
     name: 'remoteControl',
@@ -77,53 +147,6 @@ const routes = [
       title: '远程管控',
     },
   },
-  {
-    name: 'repairList',
-    path: '/repairList',
-    component: () => import('../views/repairList'),
-    meta: {
-      title: '工单待办',
-    },
-  },
-  {
-    name: 'repairDetail',
-    path: '/repairDetail',
-    component: () => import('../views/repairDetail'),
-    meta: {
-      title: '工单详情',
-    },
-  },
-  {
-    name: 'rentBill',
-    path: '/rentBill',
-    component: () => import('../views/rentBill'),
-    meta: {
-      title: '租户账单',
-    },
-  }
-  ,
-  {
-    name: 'rentBillDetail',
-    path: '/rentBillDetail',
-    component: () => import('../views/rentBillDetail'),
-    meta: {
-      title: '账单明细',
-    },
-  }
-  ,
-  {
-    name: 'checkClock',
-    path: '/checkClock',
-    component: () => import('../views/checkClock'),
-    meta: {
-      title: '巡检打卡',
-    },
-  }
-  // {
-  //   path: '/alllist',
-  //   name: '全部人员列表',
-  //   component: () => import(/* webpackChunkName: "about" */ '../views/alllist.vue')
-  // },
 ]
 
 const router = createRouter({

src/utils/api.js

@@ -52,11 +52,12 @@ export default {
 
     // 设备异常列表
     deviceAlarmInfoQuery: (params) => service.get("/app/home/actualAlertList", { params: params }),
-    
+
     //空调下发指令
-    setControl:(params) => service.post("/app/airconditioner/command", params),
+    setControl: (params) => service.post("/app/airconditioner/command", params),
+
     //继电器下发指令
-    setControlElec:(params) => service.post("/app/relay/control/command", params),
+    setControlElec: (params) => service.post("/app/relay/control/command", params),
 
     // 欠费待收--列表
     lackFeeInfoQuery: (params) => service.get("/app/expeditrecord/apppage", { params: params }),
@@ -73,6 +74,15 @@ export default {
     //租户账单明细--列表
     rentBillDetail: (params) => service.post("/app/billinfo/billDetail", params),
 
+    //获取缴费账户
+    getTenantAccount: (params) => service.get(`/app/accountinfo/detail/${params}`),
+
+    //预存缴费
+    tenantPay: (params) => service.post('/app/accountinfo/pay', params),
+
+    //立即支付
+    billPay: (params) => service.post('/app/billinfo/billPay', params),
+
     //巡检记录
     reviewCheckList: (params) => service.post("/app/circuitrecord", params),
 }

src/utils/request.js

@@ -9,8 +9,8 @@ export const getBaseURI = () => {
 
   //    开发环境
   if (env === "dev" || env == "development") {
-    // return 'http://192.168.1.10:9013/witcarbon-app';
-    return "http://gpu.ringzle.com:8082/witcarbon-app";
+    return 'http://192.168.1.51:9013/witcarbon-app';
+    // return "http://gpu.ringzle.com:8082/witcarbon-app";
   }
 
   // 集成测试环境

src/utils/vant.config.js

@@ -6,7 +6,7 @@ import {
     SwipeCell, Badge, Circle, Collapse, CollapseItem, CountDown, Divider, Empty, ImagePreview, List, NoticeBar,
     Popover, Progress, Skeleton, Step, Steps, Sticky, Swipe, SwipeItem, Tag, ActionBar, ActionBarIcon,
     ActionBarButton, Grid, GridItem, IndexBar, IndexAnchor, NavBar, Pagination, Sidebar, SidebarItem, Tab,
-    Tabs, Tabbar, TabbarItem, TreeSelect, NumberKeyboard
+    Tabs, Tabbar, TabbarItem, TreeSelect, NumberKeyboard,SubmitBar 
 } from 'vant';
 export function vant(app) {
     app.use(Button);
@@ -78,4 +78,5 @@ export function vant(app) {
     app.use(TabbarItem);
     app.use(TreeSelect);
     app.use(NumberKeyboard);
+    app.use(SubmitBar);
 }

src/views/rentBillDetail.vue

@@ -15,8 +15,9 @@
           v-model:active="activeTab"
           title-active-color="#2E69EB"
           title-inactive-color="#0C1935"
+          @change="handleChangeTab"
         >
-          <van-tab name="rentBill" title="账单明细">
+          <van-tab name="bill" title="账单明细">
             <van-dropdown-menu active-color="#2E69EB">
               <van-dropdown-item
                 v-model="dataForm.costCycle"
@@ -26,35 +27,35 @@
               />
               <van-dropdown-item
                 v-model="dataForm.costType"
-                @change="handelChange('costType', costType)"
+                @change="handelChange('costType', dataForm.costType)"
                 :title="costTypeTitle"
-                :options="costTypeList"
+                :options="payTypeList"
               />
               <van-dropdown-item
                 v-model="dataForm.status"
-                @change="handelChange('status', status)"
+                @change="handelChange('status', dataForm.status)"
                 :title="statusTitle"
-                :options="statusList"
+                :options="payStatusList"
               />
             </van-dropdown-menu>
           </van-tab>
-          <van-tab name="reduceRecord" title="扣缴记录">
+          <van-tab name="record" title="扣缴记录">
             <van-dropdown-menu active-color="#2E69EB">
               <van-dropdown-item
                 v-model="dataForm.reduceDate"
-                @change="handelChange('reduceDate', reduceDate)"
+                @change="handelChange('reduceDate', dataForm.reduceDate)"
                 :title="reduceDateTitle"
                 :options="reduceDateList"
               />
               <van-dropdown-item
                 v-model="dataForm.type"
-                @change="handelChange('type', type)"
+                @change="handelChange('type', dataForm.type)"
                 :title="typeTitle"
-                :options="typeList"
+                :options="payTypeList"
               />
               <van-dropdown-item
                 v-model="dataForm.operator"
-                @change="handelChange('operator', operator)"
+                @change="handelChange('operator', dataForm.operator)"
                 :title="operatorTitle"
                 :options="operatorList"
               />
@@ -67,12 +68,12 @@
         <v-count-up
           :end-val="dataList.length"
           class="count_up"
-          options="{ separator: ',' }"
+          :options="{ separator: ',' }"
         />
         <van-col>条记录</van-col>
       </van-row>
-      <template v-if="activeTab == 'rentBill'">
-        <div class="info_list" key="rentBill">
+      <template v-if="activeTab == 'bill'">
+        <div class="info_list" key="bill">
           <van-list
             v-model:loading="loading"
             :finished="finished"
@@ -81,72 +82,88 @@
             finished-text="没有更多了"
             @load="onLoad"
           >
-            <div
-              v-for="(item, index) in dataList"
-              :key="item.id"
-              class="list_item"
+            <van-checkbox-group
+              ref="checkboxGroup"
+              v-model="checkedCollapse"
+              style="width: 100%"
             >
-              <van-collapse
-                v-model="activeCollapse"
-                :border="false"
-                style="width: 100%"
-                accordion
+              <div
+                v-for="item in dataList"
+                :key="item.id"
+                class="list_item"
+                style="flex-direction: row; align-items: baseline"
               >
-                <van-collapse-item :name="index">
-                  <template #title>
-                    <van-row class="collapse_title">
-                      <van-checkbox-group v-model="checked">
-                        <van-checkbox :name="a"></van-checkbox>
-                        <van-checkbox :name="b"></van-checkbox>
-                      </van-checkbox-group>
-                      <van-col class="label"
-                        >{{ `${costType_filter(item.costType)}` }}：</van-col
-                      >
-                      <van-col style="font-weight: 600; color: #fa5555"
-                        >￥{{
-                          (parseInt(item.amount * 100) / 100).toFixed(2)
-                        }}</van-col
-                      >
-                    </van-row>
-                  </template>
-                  <div class="collapse_info">
-                    <template
-                      v-if="item.costType == 'Water' || item.costType == 'Elec'"
-                    >
+                <van-checkbox
+                  :name="item.id"
+                  :disabled="item.status == 1"
+                  style="margin-left: 16px"
+                ></van-checkbox>
+                <van-collapse
+                  v-model="activeCollapse"
+                  :border="false"
+                  style="flex: 1"
+                  accordion
+                >
+                  <van-collapse-item :name="item.id">
+                    <template #title>
+                      <van-row class="collapse_title">
+                        <van-col class="label"
+                          >{{
+                            `${
+                              dict_filter(item.costType, "payTypeList")[
+                                "dictLabel"
+                              ]
+                            }`
+                          }}：</van-col
+                        >
+                        <van-col style="font-weight: 600; color: #fa5555"
+                          >￥{{
+                            (parseInt(item.amount * 100) / 100).toFixed(2)
+                          }}</van-col
+                        >
+                      </van-row>
+                    </template>
+                    <div class="collapse_info">
                       <van-row
                         class="info_item"
-                        v-for="ele in billLists"
+                        v-for="ele in item.billLists"
                         :key="ele.id"
                       >
-                        <van-col
-                          >{{ ele.deviceName }}费用：￥{{ ele.amount }}</van-col
+                        <template
+                          v-if="
+                            item.costType == 'Water' || item.costType == 'Elec'
+                          "
                         >
-                      </van-row>
-                    </template>
-                    <template v-if="item.costType == 'PropertyFee'">
-                      <div class="info_item">
-                        <van-row>
-                          <van-col>管理费：￥{{ item.manageMoney }}</van-col>
-                        </van-row>
-                        <van-row>
-                          <van-col>电梯费：￥{{ item.elevatorMoney }}</van-col>
-                        </van-row>
-                        <van-row>
                           <van-col
-                            >中央空调使用费：￥{{ item.AirMoney }}</van-col
+                            >{{ ele.equipName }}费用：￥{{
+                              (parseInt(ele.amount * 100) / 100).toFixed(2)
+                            }}</van-col
                           >
-                        </van-row>
-                      </div>
-                    </template>
-                  </div>
-                </van-collapse-item>
-              </van-collapse>
-            </div>
+                        </template>
+                        <template v-if="item.costType == 'PropertyFee'">
+                          <van-col
+                            >{{
+                              `${
+                                dict_filter(ele.costType, "propertyTypeList")[
+                                  "dictLabel"
+                                ]
+                              }`
+                            }}：￥{{
+                              (parseInt(ele.amount * 100) / 100).toFixed(2)
+                            }}</van-col
+                          >
+                        </template>
+                      </van-row>
+                    </div>
+                  </van-collapse-item>
+                </van-collapse>
+              </div>
+            </van-checkbox-group>
           </van-list>
         </div>
       </template>
-      <template v-if="activeTab == 'reduceRecord'">
-        <div class="info_list" key="reduceRecord">
+      <template v-if="activeTab == 'record'">
+        <div class="info_list" key="record">
           <van-list
             v-model:loading="loading"
             :finished="finished"
@@ -166,12 +183,12 @@
                 class="reduce_type"
                 :style="{
                   'background-color': `${
-                    reduceType_filter(item.type)['color']
+                    dict_filter(item.type, 'payTypeList')['color']
                   }`,
                 }"
               >
                 <van-col>{{
-                  `${reduceType_filter(item.type)["label"]}`
+                  `${dict_filter(item.type, "payTypeList")["dictLabel"]}`
                 }}</van-col>
               </van-row>
               <van-row class="header">
@@ -208,65 +225,77 @@
     </div>
   </van-pull-refresh>
   <template v-if="role == 'admin'">
-    <van-tabbar
-      v-model="activeTabBar"
-      :safe-area-inset-bottom="true"
-      class="tab_bar"
-    >
+    <van-tabbar v-model="activeTabBar" class="tab_bar">
       <van-tabbar-item @click="handleChangeTabBar(1)">预存</van-tabbar-item>
       <van-tabbar-item @click="handleChangeTabBar(2)">补助</van-tabbar-item>
       <van-tabbar-item @click="handleChangeTabBar(3)">退费</van-tabbar-item>
     </van-tabbar>
   </template>
-
+  <template v-if="role == 'Tenant' && activeTab == 'record'">
+    <van-submit-bar class="save_btn">
+      <template #button>
+        <van-button block type="primary" @click="handleClick('fee')">
+          预存充值
+        </van-button>
+      </template>
+    </van-submit-bar>
+  </template>
+  <template
+    v-if="role == 'Tenant' && activeTab == 'bill' && checkedCollapse.length"
+  >
+    <van-submit-bar
+      :price="parseInt(amount * 100)"
+      button-text="立即支付"
+      button-color="#2E69EB"
+      @submit="handleClick('bill')"
+    >
+      <van-checkbox v-model="checkedAll" :disabled="disabledAll"
+        >全选</van-checkbox
+      >
+    </van-submit-bar>
+  </template>
   <van-popup
-    v-model:show="showPopup"
+    v-model:show="showPayPopup"
     position="bottom"
-    :style="{ height: '30%' }"
+    :safe-area-inset-bottom="true"
+    :overlay-style="{ background: 'unset' }"
     class="popup_info"
   >
-    <van-row class="popup_title">
-      <van-col :span="24">{{ popupTitle }}</van-col>
-    </van-row>
-    <van-divider
-      style="border-color: #d8d8d8; border-bottom-width: 1px; margin: 0"
-    />
-    <van-form input-align="left" error-message-align="left" @submit="onSubmit">
-      <van-cell-group :border="false">
-        <van-field
-          v-model="money"
-          type="number"
-          label="￥"
-          required
-          clearable
-          :rules="[{ required: true, message: '请输入金额' }]"
-          placeholder="请输入金额"
-        />
-      </van-cell-group>
-      <div class="save_btn">
-        <van-button block type="primary" native-type="submit">
-          立即缴费
-        </van-button>
-      </div>
-    </van-form>
+    <component
+      :is="currComponent"
+      :pay-info="payInfo"
+      @close="close"
+      v-if="showPayPopup"
+    ></component>
   </van-popup>
 </template>
 <script>
-import Api from "../utils/api";
-import { isEmpty } from "@/utils/index.js";
-import VCountUp from "./CountUp";
+import Api from "@/utils/api";
+import { isEmpty, getDictDataList } from "@/utils/index";
+import VCountUp from "../CountUp";
+import payFee from "./fee.vue";
+import payBill from "./pay.vue";
 export default {
   components: {
     "v-count-up": VCountUp,
+    "pay-fee": payFee,
+    "pay-bill": payBill,
   },
   data() {
     return {
+      showPayPopup: false,
+      payInfo: {},
+      currComponent: "",
       role: "",
       title: "",
+      disabledAll: false,
       showPopup: false,
       popupTitle: "",
-      money: "",
-      activeTab: "rentBill",
+      flag: false,
+      checkedAll: false,
+      checkedCollapse: [],
+      amount: 0,
+      activeTab: "",
       activeTabBar: 0,
       activeCollapse: "",
       costCycleTitle: "计费周期",
@@ -276,26 +305,11 @@ export default {
       typeTitle: "扣缴类型",
       operatorTitle: "操作人",
       costCycleList: [],
-      costTypeList: [
-        { text: "电费", value: "Elec" },
-        { text: "水费", value: "Water" },
-        { text: "物业费", value: "PropertyFee" },
-      ],
-      statusList: [
-        { text: "已支付", value: 1 },
-        { text: "待支付", value: 2 },
-        { text: "支付失败", value: 3 },
-      ],
+      payStatusList: [],
       reduceDateList: [],
-      typeList: [
-        { text: "预存", value: "PreStorage" },
-        { text: "补助", value: "Subsidy" },
-        { text: "退费", value: "Refund" },
-        { text: "核缴（水）", value: 4 },
-        { text: "核缴（电）", value: 5 },
-        { text: "核缴（物业）", value: 6 },
-      ],
+      payTypeList: [],
       operatorList: [],
+      propertyList: [],
       dataForm: {
         tenantId: "",
         costCycle: "2022-08",
@@ -308,16 +322,40 @@ export default {
         limit: 10,
       },
       dataList: [],
-      billDetailList: [],
       loading: false,
       refreshing: false,
       finished: false,
     };
   },
   watch: {
-    activeTab: {
+    checkedCollapse: {
       handler(newval, oldval) {
-        this.onRefresh();
+        if (newval.length == this.dataList.length) {
+          if (this.dataList.length) {
+            this.checkedAll = true;
+          }
+        } else {
+          this.checkedAll = false;
+        }
+        this.amount = 0;
+        this.checkedCollapse.forEach((item) => {
+          this.amount += this.dataList.find((ele) => ele.id == item).amount;
+        });
+      },
+      deep: true,
+    },
+    checkedAll: {
+      handler(newval, oldval) {
+        if (newval) {
+          this.checkedCollapse = [];
+          this.dataList.forEach((item) => {
+            this.checkedCollapse.push(item.id);
+          });
+        } else {
+          if (this.checkedCollapse.length == this.dataList.length) {
+            this.checkedCollapse = [];
+          }
+        }
       },
       deep: true,
     },
@@ -326,50 +364,57 @@ export default {
     this.role = localStorage.getItem("role");
     this.title = this.$route.query.tenantName;
     this.dataForm.tenantId = this.$route.query.tenantId;
-    this.dataForm.costCycle = this.$route.query.costCycle;
+    this.dataForm.costCycle =
+      this.$route.query.costCycle || this.dataForm.costCycle;
     this.activeTab = this.$route.query.activeTab;
+    this.getPayStatusList();
+    this.getPayTypeList();
+    this.getPropertyTypeList();
   },
   methods: {
-    reduceType_filter(val) {
-      if (isEmpty(val)) {
-        return {};
-      }
-      if (val == "PreStorage") {
-        return { label: "预存", color: "#30D3A2" };
-      }
-      if (val == "Subsidy") {
-        return { label: "补助", color: "#09C700" };
-      }
-      if (val == "Refund") {
-        return { label: "退费", color: "#FA5555" };
-      }
-      if (val == 4) {
-        return { label: "核缴（水）", color: "#FF9C27" };
-      }
-      if (val == 5) {
-        return { label: "核缴（电）", color: "#FF9C27" };
-      }
-      if (val == 6) {
-        return { label: "核缴（物业）", color: "#FF9C27" };
-      }
-      if (val == "CancelSubsidy") {
-        return { label: "撤销补助", color: "#FF9C27" };
-      }
-      CancelSubsidy;
+    getPayStatusList() {
+      this.payStatusList = getDictDataList("PayStatus");
+      this.payStatusList.forEach((item) => {
+        item.text = item.dictLabel;
+        item.value = item.dictValue;
+      });
     },
-    costType_filter(val) {
+    getPayTypeList() {
+      this.payTypeList = getDictDataList("PayType");
+      this.payTypeList.forEach((item) => {
+        item.text = item.dictLabel;
+        item.value = item.dictValue;
+        if (item.value == "PreStorage") {
+          item.color = "#30D3A2";
+        }
+        if (item.value == "Subsidy") {
+          item.color = "#09C700";
+        }
+        if (item.value == "Refund") {
+          item.color = "#FA5555";
+        }
+        if (item.value == "Water") {
+          item.color = "#FF9C27";
+        }
+        if (item.value == "Elec") {
+          item.color = "#FF9C27";
+        }
+        if (item.value == "PropertyFee") {
+          item.color = "#FF9C27";
+        }
+        if (item.value == "CancelSubsidy") {
+          item.color = "#ED3A25";
+        }
+      });
+    },
+    getPropertyTypeList() {
+      this.propertyTypeList = getDictDataList("PropertyType");
+    },
+    dict_filter(val, list) {
       if (isEmpty(val)) {
         return "";
       }
-      if (val == "Elec") {
-        return "电费";
-      }
-      if (val == "Water") {
-        return "水费";
-      }
-      if (val == "PropertyFee") {
-        return "物业费";
-      }
+      return this[list].find((item) => item.dictValue == val);
     },
     onLoad() {
       setTimeout(async () => {
@@ -383,20 +428,24 @@ export default {
     },
     onRefresh() {
       // 清空列表数据
+      this.checkedAll = false;
+      this.checkedCollapse = [];
+      this.activeCollapse = "";
+      this.amount = 0;
       this.finished = false;
+      this.dataList = [];
       // 重新加载数据
       // 将 loading 设置为 true，表示处于加载状态
       this.loading = true;
       this.dataForm.page = 1; // 分页数赋值为1
-      this.dataList = [];
       this.onLoad();
     },
     // 获取列表数据方法
     getDataList() {
-      if (this.activeTab == "rentBill") {
+      if (this.activeTab == "bill") {
         this.getRentBillList();
       }
-      if (this.activeTab == "reduceRecord") {
+      if (this.activeTab == "record") {
         this.getReduceRecordList();
       }
     },
@@ -409,10 +458,13 @@ export default {
               this.dataList = []; // 清空数组
               this.finished = true; // 停止加载
             }
+            res.data.forEach((item, index) => {
+              item.id = "index_" + index;
+            });
             // 若数据条数不等于0
             this.dataList.push(...res.data); // 将数据放入list中
             this.loading = false; // 加载状态结束
-
+            this.disabledAll = this.dataList.every((item) => item.status == 1);
             // 如果list长度大于等于总数据条数,数据全部加载完成
             if (this.dataList.length >= res.data.length) {
               this.finished = true; // 结束加载状态
@@ -456,32 +508,83 @@ export default {
         }
       });
     },
-    handelChange() {},
+    handelChange(type, val) {
+      if (type == "costType") {
+        // 这里打印出来的值就是我们想要的text
+        this.costTypeTitle = this.payTypeList.filter(
+          (item) => item.value === val
+        )[0].text;
+      }
+      if (type == "type") {
+        // 这里打印出来的值就是我们想要的text
+        this.typeTitle = this.payTypeList.filter(
+          (item) => item.value === val
+        )[0].text;
+      }
+      if (type == "status") {
+        // 这里打印出来的值就是我们想要的text
+        this.typeTitle = this.payStatusList.filter(
+          (item) => item.value === val
+        )[0].text;
+      }
+      this.onRefresh();
+    },
+    handleChangeTab() {
+      this.onRefresh();
+    },
     handleChangeTabBar(val) {
-      this.money = "";
+      let popupTitle = "";
+      let payType = "";
       if (val == 1) {
-        this.popupTitle = "预存";
+        popupTitle = "预存";
+        payType = "PreStorage";
       }
       if (val == 2) {
-        this.popupTitle = "补助";
+        popupTitle = "补助";
+        payType = "Subsidy";
       }
       if (val == 3) {
-        this.popupTitle = "退费";
+        popupTitle = "退费";
+        payType = "Refund";
       }
-      this.showPopup = !this.showPopup;
+      this.currComponent = "pay-fee";
+      this.payInfo = {
+        payType: payType,
+        tenantId: this.dataForm.tenantId,
+        popupTitle: popupTitle,
+      };
+      this.showPayPopup = true;
     },
-    onSubmit() {
-      this.$toast.loading({
-        message: "正在缴费...",
-        forbidClick: true,
-      });
-      Api.repairInfoSave(this.dataForm).then((res) => {
-        if (res.code == 0) {
-          this.$toast.success("缴费成功");
-        } else {
-          this.$toast.fail("缴费失败");
-        }
-      });
+    handleClick(type) {
+      if (type == "fee") {
+        this.currComponent = "pay-fee";
+        this.payInfo = {
+          payType: "PreStorage",
+          tenantId: this.dataForm.tenantId,
+          popupTitle: "预存",
+        };
+      }
+      if (type == "bill") {
+        let billIds = [];
+        this.checkedCollapse.forEach((item) => {
+          let tempBillList = [];
+          tempBillList = this.dataList.find((ele) => ele.id == item).billLists;
+          tempBillList.forEach((bill) => {
+            billIds.push(bill.id);
+          });
+        });
+        this.currComponent = "pay-bill";
+        this.payInfo = {
+          tenantId: this.dataForm.tenantId,
+          amount: this.amount,
+          billIds: billIds,
+        };
+      }
+      this.showPayPopup = true;
+    },
+    close() {
+      this.payInfo = {};
+      this.showPayPopup = false;
     },
     backPath() {
       this.$router.back();
@@ -531,7 +634,6 @@ export default {
       margin: 0 2px;
     }
   }
-
   .info_list {
     padding: 0 16px;
     .list_item {
@@ -580,6 +682,14 @@ export default {
           }
         }
       }
+      /deep/ {
+        .van-cell:after {
+          border-bottom: 0;
+        }
+        .van-collapse-item__content {
+          padding: 0 16px;
+        }
+      }
     }
     .reduce_record {
       .van-col {
@@ -629,22 +739,8 @@ export default {
   }
 }
 .popup_info {
+  height: auto;
   box-shadow: 0px -10px 20px 0px rgba(27, 32, 38, 0.1);
   border-radius: 20px 20px 0px 0px;
-  /deep/ {
-    .popup_title {
-      padding: 14px 0;
-      font-weight: 600;
-      font-size: 16px;
-      color: #333333;
-      text-shadow: 0px -10px 20px rgba(27, 32, 38, 0.1);
-    }
-  }
-  .van-field__label {
-    width: unset;
-    font-weight: 600;
-    color: #0c1935;
-  }
-  --van-cell-font-size: 24px;
 }
 </style>

src/views/bill/fee.vue

@@ -0,0 +1,114 @@
+<template>
+  <van-row align="center" justify="center" class="popup_title">
+    <van-col>{{ payInfo.popupTitle }}</van-col>
+  </van-row>
+  <van-divider
+    style="border-color: #d8d8d8; border-bottom-width: 1px; margin: 0"
+  />
+  <van-form
+    ref="dataForm"
+    input-align="left"
+    error-message-align="left"
+    @submit="onSubmit"
+    style="background: #f6f6f6"
+  >
+    <van-cell-group :border="false">
+      <van-field
+        v-model="dataForm.amount"
+        type="number"
+        label="￥"
+        clearable
+        placeholder="请输入金额"
+        class="input_field"
+      />
+    </van-cell-group>
+    <div style="margin-top: 12px; padding: 8px 16px" class="save_btn">
+      <van-button
+        block
+        type="primary"
+        :disabled="!parseFloat(dataForm.amount)"
+        native-type="submit"
+      >
+        立即缴费
+      </van-button>
+    </div>
+  </van-form>
+</template>
+<script>
+import Api from "@/utils/api";
+export default {
+  props: {
+    payInfo: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+      dataForm: {
+        id: "",
+        tenantId: "",
+        amount: "",
+        type: "",
+      },
+    };
+  },
+
+  mounted() {
+    this.dataForm.tenantId = this.dataForm.tenantId;
+    this.dataForm.type = this.payInfo.type;
+    this.getTenantAccount();
+    this.$nextTick(() => {
+      this.$refs.dataForm.resetValidation();
+    });
+  },
+  methods: {
+    getTenantAccount() {
+      Api.getTenantAccount(this.dataForm.tenantId).then((res) => {
+        if (res.code == 0) {
+          this.dataForm.id = res.data.id;
+        }
+      });
+    },
+    onSubmit() {
+      this.$toast.loading({
+        message: "正在缴费...",
+        forbidClick: true,
+      });
+      Api.tenantPay(this.dataForm).then((res) => {
+        if (res.code == 0) {
+          this.$toast.success("缴费成功");
+        } else {
+          this.$toast.fail("缴费失败");
+        }
+      });
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.popup_title {
+  padding: 12px 0;
+  font-weight: 500;
+  background-color: #ffffff;
+  .van-col {
+    font-size: 18px;
+  }
+}
+.input_field {
+  line-height: 68px;
+  /deep/ {
+    .van-field__label {
+      width: unset;
+      color: #0c1935;
+      font-size: 24px;
+      font-weight: 600;
+    }
+    .van-field__value {
+      font-size: 20px;
+    }
+  }
+}
+</style>

src/views/bill/index.vue

@@ -0,0 +1,3 @@
+<template >
+  <router-view></router-view>
+</template>

src/views/rentBill.vue

@@ -1,13 +1,9 @@
 <template>
-  <van-nav-bar title="租户账单" safe-area-inset-top>
-    <template #left>
-      <van-icon
-        :name="require('@/assets/arrow-left.svg')"
-        size="24"
-        @click="backPath"
-      />
-    </template>
-  </van-nav-bar>
+  <van-nav-bar
+    :border="false"
+    safe-area-inset-top
+    style="background-color: #5c8fff"
+  />
   <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
     <div class="page_info">
       <van-row align="center" class="position_pannel">
@@ -43,7 +39,7 @@
         <van-dropdown-menu active-color="#1989fa">
           <van-dropdown-item
             v-model="dataForm.cycle"
-            @change="handelChange('cycle', cycle)"
+            @change="handelChange('cycle', dataForm.cycle)"
             :title="cycleTitle"
             :options="cycleList"
           />
@@ -51,7 +47,7 @@
             v-model="dataForm.status"
             @change="handelChange('status', dataForm.status)"
             :title="statusTitle"
-            :options="statusList"
+            :options="isFinishedList"
           />
         </van-dropdown-menu>
       </div>
@@ -77,19 +73,19 @@
             v-for="item in dataList"
             :key="item.id"
             class="list_item"
-            @click="toPath('/rentBillDetail', item)"
+            @click="toPath('/bill/detail', item)"
           >
             <van-row
               align="center"
               class="reduce_type"
               :style="{
                 'background-color': `${
-                  rentStatus_filter(item.status)['color']
+                  dict_filter(item.status, 'isFinishedList')['color']
                 }`,
               }"
             >
               <van-col>{{
-                `${rentStatus_filter(item.status)["label"]}`
+                `${dict_filter(item.status, "isFinishedList")["dictLabel"]}`
               }}</van-col>
             </van-row>
             <van-row class="header">
@@ -117,14 +113,12 @@
               <van-col>联系电话：</van-col>
               <van-col>{{ item.tel }}</van-col>
             </van-row>
-            <div class="list_btn" v-if="item.status == 0">
-              <van-button
-                plain
-                type="primary"
-                size="small"
-                @click="handleClick([parseInt(item.id)])"
-                >催费</van-button
-              >
+            <div
+              class="list_btn"
+              v-if="item.status == 0"
+              @click.stop="handleClick([parseInt(item.id)])"
+            >
+              <van-button plain type="primary" size="small">催费</van-button>
             </div>
           </div>
         </van-list>
@@ -133,9 +127,9 @@
   </van-pull-refresh>
 </template>
 <script>
-import Api from "../utils/api";
-import { isEmpty } from "@/utils/index.js";
-import VCountUp from "./CountUp";
+import Api from "@/utils/api";
+import { isEmpty, getDictDataList } from "@/utils/index";
+import VCountUp from "../CountUp";
 export default {
   components: {
     "v-count-up": VCountUp,
@@ -145,10 +139,7 @@ export default {
       name: "电商园四期-B座",
       cycleTitle: "计费周期",
       statusTitle: "是否结清",
-      statusList: [
-        { text: "未结清", value: 0 },
-        { text: "已结清", value: 1 },
-      ],
+      isFinishedList: [],
       cycleList: [],
       dataForm: {
         cycle: "2022-08",
@@ -162,18 +153,27 @@ export default {
       finished: false,
     };
   },
-
+  created() {
+    this.getIsFinishedList();
+  },
   methods: {
-    rentStatus_filter(val) {
+    getIsFinishedList() {
+      this.isFinishedList = getDictDataList("isFinished");
+      this.isFinishedList.forEach((item) => {
+        item.text = item.dictLabel;
+        item.value = item.dictValue;
+        if (item.dictValue == 1) {
+          item.color = "#09C700";
+        } else {
+          item.color = "#FA5555";
+        }
+      });
+    },
+    dict_filter(val, list) {
       if (isEmpty(val)) {
         return {};
       }
-      if (val == 0) {
-        return { label: "未结清", color: "#FA5555" };
-      }
-      if (val == 1) {
-        return { label: "已结清", color: "#09C700" };
-      }
+      return this[list].find((item) => item.dictValue == val);
     },
     onLoad() {
       setTimeout(async () => {
@@ -189,6 +189,7 @@ export default {
       // 清空列表数据
       this.finished = false;
       // 重新加载数据
+      this.dataList = [];
       // 将 loading 设置为 true，表示处于加载状态
       this.loading = true;
       this.dataForm.page = 1; // 分页数赋值为1
@@ -224,6 +225,10 @@ export default {
       });
     },
     handleClick(ids) {
+      this.$toast.loading({
+        message: "正在催费...",
+        forbidClick: true,
+      });
       Api.lackFeeInfoPay(ids).then((res) => {
         if (res.code == 0) {
           this.$toast.success("催费成功");
@@ -243,11 +248,11 @@ export default {
       }
       if (type == "status") {
         // 这里打印出来的值就是我们想要的text
-        this.statusTitle = this.statusList.filter(
+        this.statusTitle = this.isFinishedList.filter(
           (item) => item.value === val
         )[0].text;
       }
-      this.getDataList();
+      this.onRefresh();
     },
     toPath(path, val) {
       this.$router.push({
@@ -255,7 +260,8 @@ export default {
         query: {
           tenantId: val.id,
           tenantName: val.name,
-          costCycle: this.dataForm.cycle,
+          costCycle: val.cycle,
+          activeTab: "bill",
         },
       });
     },
@@ -365,6 +371,7 @@ export default {
         bottom: 15px;
         right: 12px;
         .van-button {
+          border-width: 1px;
           &:nth-child(2) {
             margin: 0 12px;
           }

src/views/bill/pay.vue

@@ -0,0 +1,209 @@
+<template>
+  <!-- 立即支付begin -->
+  <van-row justify="center" class="popup_title">
+    <van-col style="font-size: 18px"> ￥ </van-col>
+    <van-col style="font-size: 24px">
+      {{ (parseInt(dataForm.amount * 100) / 100).toFixed(2) }}
+    </van-col>
+  </van-row>
+  <van-divider
+    style="border-color: #d8d8d8; border-bottom-width: 1px; margin: 0"
+  />
+  <div class="info_list">
+    <van-row
+      align="center"
+      justify="space-between"
+      class="list_item"
+      v-for="(item, index) in payTypeList"
+      :key="item.value"
+      @click="handleClick(item.value)"
+      :style="{ display: showPayTypeMore && index > 1 ? 'none' : 'flex' }"
+    >
+      <van-row align="center">
+        <van-icon
+          :name="item.icon"
+          size="20"
+          color="#2e69eb"
+          style="margin-right: 8px"
+        ></van-icon>
+        <van-col>
+          {{ item.text }}
+          <template v-if="item.value == 'Account'">
+            （{{ "可用￥" + (parseInt(amount * 100) / 100).toFixed(2) }}）
+          </template>
+        </van-col>
+      </van-row>
+      <template v-if="dataForm.payType == item.value">
+        <van-col>
+          <van-icon
+            name="checked"
+            size="20"
+            :style="{
+              color: dataForm.payType == item.value ? '#2e69eb' : '',
+            }"
+          ></van-icon>
+        </van-col>
+      </template>
+      <template v-else>
+        <van-col>
+          <van-icon name="circle" size="20"></van-icon>
+        </van-col>
+      </template>
+    </van-row>
+    <template v-if="showPayTypeMore">
+      <van-row
+        align="center"
+        justify="center"
+        class="type_more"
+        @click="showPayTypeMore = false"
+      >
+        <van-col>更多支付方式</van-col>
+        <van-icon name="arrow-down" color="#999999"></van-icon>
+      </van-row>
+    </template>
+
+    <div style="margin-top: 50px">
+      <van-button block type="primary"> 确认支付 </van-button>
+    </div>
+  </div>
+  <!-- 立即支付end -->
+</template>
+<script>
+import Api from "@/utils/api";
+import { getDictDataList } from "@/utils/index";
+export default {
+  props: {
+    payInfo: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+      amount: "", //账户余额
+      showPayTypeMore: true,
+      payTypeList: [],
+      dataForm: {
+        tenantId: "",
+        amount: "",
+        billIds: [],
+        payType: "",
+      },
+    };
+  },
+
+  mounted() {
+    this.dataForm.tenantId = this.payInfo.tenantId;
+    this.dataForm.amount = this.payInfo.amount;
+    this.dataForm.billIds = this.payInfo.billIds;
+    this.getTenantAccount();
+  },
+  methods: {
+    getTenantAccount() {
+      Api.getTenantAccount(this.dataForm.tenantId).then((res) => {
+        if (res.code == 0) {
+          this.amount = res.data.amount;
+        }
+        this.getPayTypeList();
+      });
+    },
+    getPayTypeList() {
+      this.payTypeList = [];
+      let tempArr = [];
+      let obj = null;
+      tempArr = getDictDataList("PayMode");
+      tempArr.forEach((item) => {
+        let icon = "";
+        if (item.dictValue == "WeChat") {
+          icon = "wechat-pay";
+        }
+        if (item.dictValue == "Alipay") {
+          icon = "alipay";
+        }
+        if (item.dictValue == "UnionPay") {
+          icon = "card";
+        }
+        if (item.dictValue == "Account") {
+          icon = "gold-coin";
+          if (this.amount) {
+            this.payTypeList.unshift({
+              text: item.dictLabel,
+              value: item.dictValue,
+              icon: icon,
+            });
+          } else {
+            obj = {
+              text: item.dictLabel,
+              value: item.dictValue,
+              icon: icon,
+              disabled: true,
+            };
+          }
+        } else {
+          this.payTypeList.push({
+            text: item.dictLabel,
+            value: item.dictValue,
+            icon: icon,
+          });
+        }
+      });
+      if (obj) {
+        this.payTypeList.push(obj);
+      }
+      if (this.amount) {
+        this.dataForm.payType = "Account";
+      } else {
+        this.dataForm.payType = this.payTypeList[0].value;
+      }
+    },
+    handleClick(val) {
+      this.dataForm.payType = val;
+    },
+    payMoney() {
+      this.$toast.loading({
+        message: "正在支付...",
+        forbidClick: true,
+      });
+      Api.billPay(this.dataForm).then((res) => {
+        if (res.code == 0) {
+          this.$toast.success("付款成功");
+        } else {
+          this.$toast.fail("付款失败");
+        }
+      });
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.popup_title {
+  align-items: baseline;
+  padding: 12px 0;
+  font-weight: 500;
+  background-color: #ffffff;
+}
+.info_list {
+  padding: 10px 16px;
+  .list_item {
+    line-height: 44px;
+    .van-col {
+      font-size: 16px;
+    }
+  }
+  .type_more {
+    margin-top: 10px;
+    .van-col {
+      font-size: 14px;
+      color: #999999;
+    }
+  }
+}
+.van-field__label {
+  width: unset;
+  font-weight: 600;
+  color: #0c1935;
+  --van-cell-font-size: 24px;
+}
+</style>

src/views/device/index.vue

@@ -0,0 +1,3 @@
+<template >
+  <router-view></router-view>
+</template>

src/views/deviceAlarm.vue

@@ -26,13 +26,9 @@
             fit="contain"
           />
         </van-col>
-        <van-col
-          @click="
-            $route.push({ path: '/userInfo', query: { type: 'account' } })
-          "
-        >
+        <van-col>
           <van-image
-            :src="require('@/assets/user.svg')"
+            :src="require('@/assets/search.svg')"
             width="16"
             height="16"
             fit="contain"
@@ -102,8 +98,8 @@
   </van-pull-refresh>
 </template>
 <script>
-import Api from "../utils/api";
-import VCountUp from "./CountUp";
+import Api from "@/utils/api";
+import VCountUp from "../CountUp";
 export default {
   components: {
     "v-count-up": VCountUp,

src/views/home.vue

@@ -6,26 +6,42 @@
     style="background-color: #5c8fff"
   />
   <div class="page_info">
-    <div class="info_bg">
+    <div
+      class="info_title"
+      :style="{
+        'margin-bottom': role != 'Maintenance' ? '54px' : '12px',
+        'padding-bottom': role != 'Maintenance' ? '58px' : '',
+      }"
+    >
       <van-row align="center" class="position_pannel">
-        <van-col>
-          <van-image
-            :src="require('@/assets/position.svg')"
-            width="16"
-            height="16"
-            fit="contain"
-          />
-          <van-col>{{ name }}</van-col>
-          <van-image
-            :src="require('@/assets/arrow-right.svg')"
-            width="24"
-            height="24"
-            fit="contain"
-          />
-        </van-col>
+        <template v-if="role == 'Tenant'">
+          <van-row justify="center" style="flex: 1">
+            <van-col>首页</van-col>
+          </van-row>
+        </template>
+        <template v-else>
+          <van-col>
+            <van-image
+              :src="require('@/assets/position.svg')"
+              width="16"
+              height="16"
+              fit="contain"
+            />
+            <van-col>{{ name }}</van-col>
+            <van-image
+              :src="require('@/assets/arrow-right.svg')"
+              width="24"
+              height="24"
+              fit="contain"
+            />
+          </van-col>
+        </template>
+
         <van-col
           @click="
-            $route.push({ path: '/userInfo', query: { type: 'account' } })
+            () => {
+              $router.push({ path: '/userInfo', query: { type: 'password' } });
+            }
           "
         >
           <van-image
@@ -59,7 +75,14 @@
       <template v-if="role == 'Inspection'">
         <van-row align="center" justify="space-between" class="sub_title">
           <van-col class="title">实时巡检</van-col>
-          <van-col class="function_btn" @click="toPath('/reviewCheck')">
+          <van-col
+            class="function_btn"
+            @click="
+              () => {
+                $router.push({ path: '/review/clock' });
+              }
+            "
+          >
             <van-col>立即巡检</van-col>
             <van-image
               :src="require('@/assets/btn-arrow-right.svg')"
@@ -74,7 +97,7 @@
             align="center"
             justify="center"
             style="flex-direction: column"
-            v-for="(item, index) in checkList"
+            v-for="(item, index) in reviewList"
             :key="item + '_' + index"
           >
             <van-col>{{ item.label }}</van-col>
@@ -94,7 +117,14 @@
           <van-col class="title">{{
             role == "admin" ? "工单待办" : "实时报修"
           }}</van-col>
-          <van-col class="function_btn" @click="toPath('/repairList')">
+          <van-col
+            class="function_btn"
+            @click="
+              () => {
+                $router.push({ path: '/repair/list' });
+              }
+            "
+          >
             <van-col>{{ role == "admin" ? "立即处理" : "立即查看" }}</van-col>
             <van-image
               :src="require('@/assets/btn-arrow-right.svg')"
@@ -128,7 +158,14 @@
       <template v-if="role && role != 'Tenant'">
         <van-row align="center" justify="space-between" class="sub_title">
           <van-col class="title">设备异常</van-col>
-          <van-col class="function_btn" @click="toPath('/deviceAlarm')">
+          <van-col
+            class="function_btn"
+            @click="
+              () => {
+                $router.push({ path: '/device/list' });
+              }
+            "
+          >
             <van-col>立即查看</van-col>
             <van-image
               :src="require('@/assets/btn-arrow-right.svg')"
@@ -146,7 +183,7 @@
             v-for="(item, index) in deviceAlarmList"
             :key="item + '_' + index"
           >
-            <van-col>{{ `${deviceAlarm_filter(item.label)}` }}</van-col>
+            <van-col>{{ item.dictLabel }}</van-col>
             <v-count-up :end-val="Number(item['count'])" class="count_up" />
           </van-row>
         </van-row>
@@ -157,7 +194,14 @@
       <template v-if="role == 'admin'">
         <van-row align="center" justify="space-between" class="sub_title">
           <van-col class="title">欠费待收</van-col>
-          <van-col class="function_btn" @click="toPath('/lackFee')">
+          <van-col
+            class="function_btn"
+            @click="
+              () => {
+                $router.push({ path: '/pay/fee' });
+              }
+            "
+          >
             <van-col>立即催收</van-col>
             <van-image
               :src="require('@/assets/btn-arrow-right.svg')"
@@ -178,7 +222,7 @@
               <template v-if="billPaymentList.length > 0">
                 <van-row v-for="(item, index) in billPaymentList" :key="index">
                   <van-col span="8" style="color: #999999; font-size: 12px">{{
-                    `${payType_filter(item.payType)}`
+                    `${dict_filter(item.payType, "payTypeList")["dictLabel"]}`
                   }}</van-col>
                   <van-col span="8">{{
                     (parseInt(item.arrearageNum * 100) / 100).toFixed(2)
@@ -206,7 +250,16 @@
           <van-col class="title">账单待缴</van-col>
           <van-col
             class="function_btn"
-            @click="toPath('/rentBillDetail', 'rentBill')"
+            @click="
+              () => {
+                $router.push({
+                  path: '/bill/detail',
+                  query: {
+                    activeTab: 'bill',
+                  },
+                });
+              }
+            "
           >
             <van-col>立即缴费</van-col>
             <van-image
@@ -228,7 +281,7 @@
               <template v-if="billPaymentList.length > 0">
                 <van-row v-for="(item, index) in billPaymentList" :key="index">
                   <van-col span="8" style="color: #999999; font-size: 12px">{{
-                    `${payType_filter(item.payType)}`
+                    `${dict_filter(item.payType, "payTypeList")["dictLabel"]}`
                   }}</van-col>
                   <van-col span="8">{{
                     (parseInt(item.currentAmount * 100) / 100).toFixed(2)
@@ -256,7 +309,6 @@
     v-model="activeTabBar"
     active-color="#2E69EB"
     inactive-color="#0c1935"
-    safe-area-inset-bottom
   >
     <van-tabbar-item
       name="home"
@@ -271,11 +323,11 @@
     <van-tabbar-item
       name="rentBill"
       :icon="
-        activeTabBar == 'rentBill'
+        activeTabBar == 'bill'
           ? require('@/assets/rent-bill-active.svg')
           : require('@/assets/rent-bill.svg')
       "
-      to="/rentBill"
+      to="/bill/list"
       >租户账单</van-tabbar-item
     >
     <van-tabbar-item
@@ -291,7 +343,7 @@
   </van-tabbar>
 </template>
 <script>
-import { isEmpty } from "@/utils/index.js";
+import { isEmpty, getDictDataList } from "@/utils/index.js";
 import api from "../utils/api";
 import VCountUp from "./CountUp";
 export default {
@@ -306,41 +358,26 @@ export default {
       activeTabBar: "home",
       functionList: [
         {
-          path: "/repairOnline",
+          path: "/repair/create",
           src: require("@/assets/repair-online.svg"),
           label: "线上报修",
           role: ["admin", "Inspection", "Tenant"],
         },
         {
-          path: "/reviewCheck",
+          path: "/review/list",
           src: require("@/assets/check-review.svg"),
           label: "巡检记录",
           role: ["admin", "Inspection"],
         },
         {
-          path: "/rentBillDetail",
+          path: "/pay/record",
           src: require("@/assets/reduce-record.svg"),
           label: "扣缴记录",
           role: ["admin", "Tenant"],
-          activeTab: "reduceRecord",
-        },
-      ],
-      checkList: [
-        {
-          label: "今日待巡检",
-          count: 88,
-          options: {
-            separator: ",",
-          },
-        },
-        {
-          label: "今日已巡检",
-          count: 2,
-          options: {
-            separator: ",",
-          },
+          activeTab: "record",
         },
       ],
+      reviewList: [],
       workList: [
         {
           label: "待指派",
@@ -358,19 +395,17 @@ export default {
           role: ["admin", "Maintenance", "Tenant"],
         },
       ],
-      deviceAlarmList: [
-        { label: "abnormalNum", count: 0 },
-        { label: "AirConditioner", count: 0 },
-        { label: "Ammeter", count: 0 },
-        { label: "WaterMeter", count: 0 },
-      ],
+      deviceAlarmList: [],
+      payTypeList: [],
       billPaymentList: [],
       loading: true,
     };
   },
   created() {
-    this.getHomeData();
     this.role = localStorage.getItem("role");
+    this.getHomeData();
+    this.getPayTypeList();
+    this.getDeviceAlarmList();
     if (this.role == "Tenant") {
       this.tenantInfo = JSON.parse(localStorage.getItem("tenantInfo"));
     } else {
@@ -378,37 +413,17 @@ export default {
     }
   },
   methods: {
-    payType_filter(val) {
-      if (isEmpty(val)) {
-        return "";
-      }
-      if (val == "Water") {
-        return "水费";
-      }
-      if (val == "Elec") {
-        return "电费";
-      }
-      if (val == "PropertyFee") {
-        return "物业相关";
-      }
+    getPayTypeList() {
+      this.payTypeList = getDictDataList("PayType");
     },
-
-    deviceAlarm_filter(val) {
+    getDeviceAlarmList() {
+      this.deviceAlarmList = getDictDataList("DeviceAlarm");
+    },
+    dict_filter(val, list) {
       if (isEmpty(val)) {
-        return "";
-      }
-      if (val == "abnormalNum") {
-        return "异常总数";
-      }
-      if (val == "AirConditioner") {
-        return "空调异常";
-      }
-      if (val == "WaterMeter") {
-        return "水表异常";
-      }
-      if (val == "Ammeter") {
-        return "电表异常";
+        return {};
       }
+      return this[list].find((item) => item.dictValue == val);
     },
 
     getHomeData() {
@@ -419,22 +434,38 @@ export default {
             this.workList[k - 1].count = res.data.workOrder[k];
           }
           //设备异常数据
-          let mapsArr = [];
-          for (let k in res.data.equip.maps) {
-            let json = {};
-            if (k != "Relay") {
-              json.label = k;
-              json.count = res.data.equip.maps[k];
-              mapsArr.push(json);
+          let deviceArr = [];
+          for (let key in res.data.equip.maps) {
+            if (key != "Relay") {
+              deviceArr.push({
+                dictValue: key,
+                count: res.data.equip.maps[key],
+              });
             }
           }
           //赋值异常总数
-          mapsArr.unshift({
-            label: "abnormalNum",
+          deviceArr.unshift({
+            dictValue: "abnormalNum",
             count: res.data.equip.abnormalNum,
           });
           this.deviceAlarmList.forEach((item) => {
-            item.count = mapsArr.find((ele) => ele.label == item.label).count;
+            item.count = deviceArr.find(
+              (ele) => ele.dictValue == item.dictValue
+            ).count;
+          });
+
+          //实时巡检数据
+          let reviewArr = [];
+          for (let key in res.data.inspectionInfo) {
+            reviewArr.push({
+              dictValue: key,
+              count: res.data.inspectionInfo[key],
+            });
+          }
+          this.reviewList.forEach((item) => {
+            item.count = reviewArr.find(
+              (ele) => ele.dictValue == item.dictValue
+            ).count;
           });
           //欠费待收数据
           this.billPaymentList = res.data.billPaymentList;
@@ -443,13 +474,18 @@ export default {
       });
     },
     toPath(path, val) {
-      this.$router.push({
-        path: path,
-        query: {
+      let params = {};
+      if (this.role != "admin" && val) {
+        params = {
           tenantId: this.tenantInfo.tenantId,
           tenantName: this.tenantInfo.tenantName,
           activeTab: val,
-        },
+        };
+        path = "/bill/detail";
+      }
+      this.$router.push({
+        path: path,
+        query: params,
       });
     },
   },
@@ -458,13 +494,10 @@ export default {
 <style lang="scss" scoped>
 .page_info {
   position: relative;
-  .info_bg {
+  .info_title {
     width: 100%;
-    height: 102px;
     background: #5c8fff;
     border-radius: 0px 0px 16px 16px;
-    padding-top: 12px;
-    margin-bottom: 42px;
     box-sizing: border-box;
     .position_pannel {
       display: flex;
@@ -472,7 +505,8 @@ export default {
       justify-content: space-between;
       padding: 0 16px;
       .van-col {
-        height: 24px;
+        height: 44px;
+        font-weight: 600;
         font-size: 16px;
         color: #ffffff;
         line-height: 24px;
@@ -515,7 +549,7 @@ export default {
   .info_list {
     padding: 0 16px;
     .sub_title {
-      margin: 16px 0 6px 0;
+      margin: 12px 0 6px 0;
       .title {
         height: 20px;
         font-size: 14px;

src/views/lackFee.vue

@@ -26,13 +26,9 @@
             fit="contain"
           />
         </van-col>
-        <van-col
-          @click="
-            $route.push({ path: '/userInfo', query: { type: 'account' } })
-          "
-        >
+        <van-col>
           <van-image
-            :src="require('@/assets/user.svg')"
+            :src="require('@/assets/search.svg')"
             width="16"
             height="16"
             fit="contain"
@@ -42,26 +38,26 @@
       <div class="drop_down">
         <van-dropdown-menu active-color="#1989fa">
           <van-dropdown-item
-            v-model="cycle"
-            @change="handelChange('lackRange', lackRange)"
+            v-model="dataForm.cycle"
+            @change="handelChange('cycle', dataForm.cycle)"
             :title="cycleTitle"
             :options="cycleList"
           />
           <van-dropdown-item
-            v-model="billType"
-            @change="handelChange('billType', billType)"
+            v-model="dataForm.billType"
+            @change="handelChange('billType', dataForm.billType)"
             :title="billTypeTitle"
             :options="billTypeList"
           />
           <van-dropdown-item
-            v-model="arrearDay"
-            @change="handelChange('arrearDay', arrearDay)"
+            v-model="dataForm.arrearDay"
+            @change="handelChange('arrearDay', dataForm.arrearDay)"
             :title="arrearDayTitle"
             :options="arrearDayList"
           />
           <van-dropdown-item
-            v-model="isExpedit"
-            @change="handelChange('isExpedit', isExpedit)"
+            v-model="dataForm.isExpedit"
+            @change="handelChange('isExpedit', dataForm.isExpedit)"
             :title="isExpeditTitle"
             :options="isExpeditList"
           />
@@ -90,11 +86,13 @@
               class="reduce_type"
               :style="{
                 'background-color': `${
-                  isExpedit_filter(item.isExpedit)['color']
+                  dict_filter(item.isExpedit, 'isExpeditList')['color']
                 }`,
               }"
             >
-              <span>{{ `${isExpedit_filter(item.isExpedit)["label"]}` }}</span>
+              <span>{{
+                `${dict_filter(item.isExpedit, "isExpeditList")["dictLabel"]}`
+              }}</span>
             </div>
             <van-row class="header">
               <van-col>{{ item.tenantName }}</van-col>
@@ -109,7 +107,9 @@
               <van-col style="color: #fa5555">{{ item.arrearDay }}</van-col>
             </van-row>
             <van-col
-              >欠费类型：{{ `${billType_filter(item.billType)}` }}</van-col
+              >欠费类型：{{
+                `${dict_filter(dataForm.billType, "billTypeList")["dictLabel"]}`
+              }}</van-col
             >
             <van-col>联系电话：{{ item.phone }}</van-col>
             <van-col>最近一次催费时间：{{ item.updateDate }}</van-col>
@@ -129,9 +129,9 @@
   </van-pull-refresh>
 </template>
 <script>
-import Api from "../utils/api";
-import { isEmpty, getDictDataList } from "@/utils/index.js";
-import VCountUp from "./CountUp";
+import Api from "@/utils/api";
+import { isEmpty, getDictDataList } from "@/utils/index";
+import VCountUp from "../CountUp";
 export default {
   components: {
     "v-count-up": VCountUp,
@@ -139,81 +139,66 @@ export default {
   data() {
     return {
       name: "电商园四期-B座",
-      isExpedit: "",
-      billType: "",
-      arrearDay: "",
       isExpeditTitle: "是否催费",
       cycleTitle: "计费周期",
       billTypeTitle: "欠费类型",
       arrearDayTitle: "欠费天数",
       billTypeList: [],
       arrearDayList: [],
-      cycleList: [
-        { text: "保水", value: 1 },
-        { text: "保电", value: 2 },
-      ],
-      isExpeditList: [
-        { text: "未催费", value: 0 },
-        { text: "已催费", value: 1 },
-      ],
+      cycleList: [],
+      isExpeditList: [],
+      dataForm: {
+        cycle: "",
+        billType: "",
+        arrearDay: "",
+        isExpedit: "",
+        page: 1,
+        limit: 10,
+      },
       dataList: [],
       loading: false,
       refreshing: false,
       finished: false,
     };
   },
-  mounted() {
+  created() {
     this.getArrearDayList();
     this.getBillTypeList();
+    this.getIsExpeditList();
   },
   methods: {
-    isExpedit_filter(val) {
-      if (isEmpty(val)) {
-        return {};
-      }
-      if (val == 0) {
-        return { label: "未催费", color: "#FF9C27" };
-      }
-      if (val == 1) {
-        return { label: "已催费", color: "#30D3A2" };
-      }
-    },
-    billType_filter(val) {
-      if (isEmpty(val)) {
-        return "";
-      }
-      if (val == "Water") {
-        return "水费";
-      }
-      if (val == "Elec") {
-        return "电费";
-      }
-      if (val == "PropertyFee") {
-        return "物业相关";
-      }
-    },
     getArrearDayList() {
-      this.arrearDayList = [];
-      let tempArr = [];
-      tempArr = getDictDataList("ArrearageDay");
-      tempArr.forEach((item) => {
-        this.arrearDayList.push({
-          text: item.dictLabel,
-          value: item.dictValue,
-        });
+      this.arrearDayList = getDictDataList("ArrearageDay");
+      this.arrearDayList.forEach((item) => {
+        item.text = item.dictLabel;
+        item.value = item.dictValue;
       });
     },
     getBillTypeList() {
-      this.billTypeList = [];
-      let tempArr = [];
-      tempArr = getDictDataList("PayType");
-      tempArr.forEach((item) => {
-        this.billTypeList.push({
-          text: item.dictLabel,
-          value: item.dictValue,
-        });
+      this.billTypeList = getDictDataList("PayType");
+      this.billTypeList.forEach((item) => {
+        item.text = item.dictLabel;
+        item.value = item.dictValue;
+      });
+    },
+    getIsExpeditList() {
+      this.isExpeditList = getDictDataList("isExpedit");
+      this.isExpeditList.forEach((item) => {
+        item.text = item.dictLabel;
+        item.value = item.dictValue;
+        if (item.dictValue == 1) {
+          item.color = "#09C700";
+        } else {
+          item.color = "#FA5555";
+        }
       });
     },
+    dict_filter(val, list) {
+      if (isEmpty(val)) {
+        return {};
+      }
+      return this[list].find((item) => item.dictValue == val);
+    },
     onLoad() {
       setTimeout(async () => {
         if (this.refreshing) {
@@ -221,6 +206,7 @@ export default {
           this.refreshing = false;
         }
         await this.getDataList();
+        this.dataForm.page++; // 分页数加一
       }, 100);
     },
     onRefresh() {
@@ -229,16 +215,12 @@ export default {
       // 重新加载数据
       // 将 loading 设置为 true，表示处于加载状态
       this.loading = true;
+      this.dataForm.page = 1; // 分页数赋值为1
       this.onLoad();
     },
     // 获取列表数据方法
     getDataList() {
-      Api.lackFeeInfoQuery({
-        arrearDay: "",
-        billType: "",
-        cycle: "",
-        isExpedit: "",
-      }).then((res) => {
+      Api.lackFeeInfoQuery(this.dataForm).then((res) => {
         if (res.code == 0) {
           if (res.data) {
             if (res.data.list.length == 0) {

src/views/pay/index.vue

@@ -0,0 +1,3 @@
+<template >
+  <router-view></router-view>
+</template>

src/views/reduceRecord.vue

@@ -26,13 +26,9 @@
             fit="contain"
           />
         </van-col>
-        <van-col
-          @click="
-            $route.push({ path: '/userInfo', query: { type: 'account' } })
-          "
-        >
+        <van-col>
           <van-image
-            :src="require('@/assets/user.svg')"
+            :src="require('@/assets/search.svg')"
             width="16"
             height="16"
             fit="contain"
@@ -43,19 +39,19 @@
         <van-dropdown-menu active-color="#1989fa">
           <van-dropdown-item
             v-model="feeDate"
-            @change="handelChange('feeDate', feeDate)"
+            @change="handelChange('feeDate', dataFrom.feeDate)"
             :title="feeDateTitle"
             :options="feeDateList"
           />
           <van-dropdown-item
             v-model="dataForm.type"
-            @change="handelChange('type', type)"
+            @change="handelChange('type', dataForm.type)"
             :title="typeTitle"
-            :options="typeList"
+            :options="payTypeList"
           />
           <van-dropdown-item
             v-model="operator"
-            @change="handelChange('operator', operator)"
+            @change="handelChange('operator', dataForm.operator)"
             :title="operatorTitle"
             :options="operatorList"
           />
@@ -80,22 +76,33 @@
           @load="onLoad"
         >
           <div v-for="item in dataList" :key="item.id" class="list_item">
-            <div
+            <van-row
+              align="center"
               class="reduce_type"
               :style="{
-                'background-color': `${reduceType_filter(item.type)['color']}`,
+                'background-color': `${
+                  dict_filter(item.type, 'payTypeList')['color']
+                }`,
               }"
-            ></div>
+            >
+              <van-col>{{
+                `${dict_filter(item.type, "payTypeList")["dictLabel"]}`
+              }}</van-col>
+            </van-row>
             <van-row class="header">
               <van-col>{{ item.tenantInfo.name }}</van-col>
             </van-row>
             <van-row>
               <van-col>扣缴金额：</van-col>
-              <van-col style="color: #fa5555">￥{{ item.amount }}</van-col>
+              <van-col style="color: #fa5555"
+                >￥{{ (parseInt(item.amount * 100) / 100).toFixed(2) }}</van-col
+              >
             </van-row>
             <van-row>
               <van-col>账户余额：￥</van-col>
-              <van-col>{{ item.surplus }}</van-col>
+              <van-col>{{
+                (parseInt(item.surplus * 100) / 100).toFixed(2)
+              }}</van-col>
             </van-row>
             <van-row>
               <van-col>租户电话：</van-col>
@@ -107,7 +114,7 @@
             </van-row>
             <van-row>
               <van-col>扣缴时间：</van-col>
-              <van-col>{{ item.updateDate }}</van-col>
+              <van-col>{{ item.createDate }}</van-col>
             </van-row>
           </div>
         </van-list>
@@ -116,39 +123,25 @@
   </van-pull-refresh>
 </template>
 <script>
-import Api from "../utils/api";
-import { isEmpty } from "@/utils/index.js";
-import VCountUp from "./CountUp";
+import Api from "@/utils/api";
+import { isEmpty, getDictDataList } from "@/utils/index";
+import VCountUp from "../CountUp";
 export default {
   components: {
     "v-count-up": VCountUp,
   },
   data() {
     return {
-      loading: false,
       name: "电商园四期-B座",
-      feeDate: "",
-      operator: "",
       feeDateTitle: "扣缴时间",
       typeTitle: "扣缴类型",
       operatorTitle: "操作人",
-      typeList: [
-        { text: "预存", value: "PreStorage" },
-        { text: "补助", value: "Subsidy" },
-        { text: "退费", value: "Refund" },
-        { text: "核缴（水）", value: 4 },
-        { text: "核缴（电）", value: 5 },
-        { text: "核缴（物业）", value: 6 },
-      ],
-      operatorList: [
-        { text: "张三", value: 1 },
-        { text: "李四", value: 2 },
-      ],
-      feeDateList: [
-        { text: "张三", value: 1 },
-        { text: "李四", value: 2 },
-      ],
+      payTypeList: [],
+      operatorList: [],
+      feeDateList: [],
       dataForm: {
+        feeDate: "",
+        operator: "",
         type: "",
         tenantId: "",
         page: 1,
@@ -162,30 +155,42 @@ export default {
   },
   created() {
     this.dataForm.tenantId = localStorage.getItem("tenantId");
+    this.getPayTypeList();
   },
   methods: {
-    reduceType_filter(val) {
+    getPayTypeList() {
+      this.payTypeList = getDictDataList("PayType");
+      this.payTypeList.forEach((item) => {
+        item.text = item.dictLabel;
+        item.value = item.dictValue;
+        if (item.value == "PreStorage") {
+          item.color = "#30D3A2";
+        }
+        if (item.value == "Subsidy") {
+          item.color = "#09C700";
+        }
+        if (item.value == "Refund") {
+          item.color = "#FA5555";
+        }
+        if (item.value == "Water") {
+          item.color = "#FF9C27";
+        }
+        if (item.value == "Elec") {
+          item.color = "#FF9C27";
+        }
+        if (item.value == "PropertyFee") {
+          item.color = "#FF9C27";
+        }
+        if (item.value == "CancelSubsidy") {
+          item.color = "#ED3A25";
+        }
+      });
+    },
+    dict_filter(val, list) {
       if (isEmpty(val)) {
         return {};
       }
-      if (val == "PreStorage") {
-        return { label: "预存", color: "#30D3A2" };
-      }
-      if (val == "Subsidy") {
-        return { label: "补助", color: "#09C700" };
-      }
-      if (val == "Refund") {
-        return { label: "退费", color: "#FA5555" };
-      }
-      if (val == 4) {
-        return { label: "核缴（水）", color: "#FF9C27" };
-      }
-      if (val == 5) {
-        return { label: "核缴（电）", color: "#FF9C27" };
-      }
-      if (val == 6) {
-        return { label: "核缴（物业）", color: "#FF9C27" };
-      }
+      return this[list].find((item) => item.dictValue == val);
     },
     onLoad() {
       setTimeout(async () => {
@@ -194,16 +199,17 @@ export default {
           this.refreshing = false;
         }
         await this.getDataList();
-        this.page++; // 分页数加一
+        this.dataForm.page++; // 分页数加一
       }, 100);
     },
     onRefresh() {
       // 清空列表数据
       this.finished = false;
+      this.dataList = [];
       // 重新加载数据
       // 将 loading 设置为 true，表示处于加载状态
       this.loading = true;
-      this.page = 1; // 分页数赋值为1
+      this.dataForm.page = 1; // 分页数赋值为1
       this.onLoad();
     },
     // 获取列表数据方法
@@ -237,19 +243,13 @@ export default {
     },
     // change事件可以拿到的是value
     handelChange(type, val) {
-      console.log(type, val);
-      if (type == "checkType") {
-        // 这里打印出来的值就是我们想要的text
-        this.checkTypeTitle = this.checkTypeList.filter(
-          (item) => item.value === val
-        )[0].text;
-      }
-      if (type == "checkPerson") {
+      if (type == "type") {
         // 这里打印出来的值就是我们想要的text
-        this.checkPersonTitle = this.checkPersonList.filter(
+        this.typeTitle = this.payTypeList.filter(
           (item) => item.value === val
         )[0].text;
       }
+      this.onRefresh();
     },
     backPath() {
       this.$router.back();
@@ -343,11 +343,10 @@ export default {
         position: absolute;
         top: 0;
         right: 0;
-        width: 48px;
         height: 24px;
+        padding: 0 12px;
         border-radius: 0px 4px 0px 10px;
-        span {
-          height: 16px;
+        .van-col {
           font-size: 12px;
           font-weight: 400;
           color: #ffffff;

src/views/repairOnline.vue

@@ -57,11 +57,12 @@
         >
           <van-picker
             :columns="repairRegionList"
+            :columns-field-names="columnsFieldNames"
             @cancel="showRepairRegionPicker = false"
             @confirm="
               (value) => {
-                dataForm.repairRegion = value.value;
-                dataForm.repairRegionName = value.text;
+                dataForm.repairRegion = value.dictValue;
+                dataForm.repairRegionName = value.dictLabel;
                 showRepairRegionPicker = false;
               }
             "
@@ -80,11 +81,12 @@
         <van-popup v-model:show="showRepairTypePicker" round position="bottom">
           <van-picker
             :columns="repairTypeList"
+            :columns-field-names="columnsFieldNames"
             @cancel="showRepairTypePicker = false"
             @confirm="
               (value) => {
-                dataForm.repairType = value.value;
-                dataForm.repairTypeName = value.text;
+                dataForm.repairType = value.dictValue;
+                dataForm.repairTypeName = value.dictLabel;
                 showRepairTypePicker = false;
               }
             "
@@ -102,6 +104,7 @@
           v-model="dataForm.contactPhone"
           label="联系电话"
           required
+          maxlength="11"
           placeholder="请输入联系电话"
           clearable
           :rules="[{ required: true, message: '请输入联系电话' }]"
@@ -136,24 +139,30 @@
           </template>
         </van-cell>
       </van-cell-group>
-      <div class="save_btn">
-        <van-button block type="primary" native-type="submit">
-          提交
-        </van-button>
-      </div>
+      <van-submit-bar class="save_btn">
+        <template #button>
+          <van-button block type="primary" native-type="submit">
+            提交
+          </van-button>
+        </template>
+      </van-submit-bar>
     </van-form>
   </div>
 </template>
 <script>
-import Api from "../utils/api";
+import Api from "@/utils/api";
+import { getDictDataList } from "@/utils/index";
 export default {
   data() {
     return {
-      
       loading: false,
       fileList: [],
       tempFileList: [],
       positionList: [],
+      columnsFieldNames: {
+        text: "dictLabel",
+        value: "dictValue",
+      },
       fieldNames: {
         text: "orgName",
         value: "orgId",
@@ -162,21 +171,8 @@ export default {
       showRepairPositionPicker: false,
       showRepairRegionPicker: false,
       showRepairTypePicker: false,
-      repairRegionList: [
-        {
-          text: "公共区域",
-          value: 1,
-        },
-        {
-          text: "室内",
-          value: 2,
-        },
-      ],
-      repairTypeList: [
-        { text: "水", value: 1 },
-        { text: "电", value: 2 },
-        { text: "其他", value: 3 },
-      ],
+      repairRegionList: [],
+      repairTypeList: [],
       dataForm: {
         id: "",
         buildingId: "",
@@ -197,8 +193,16 @@ export default {
   },
   created() {
     this.getBuildList();
+    this.getRepairTypeList();
+    this.getRepairRegionList();
   },
   methods: {
+    getRepairTypeList() {
+      this.repairTypeList = getDictDataList("RepairType");
+    },
+    getRepairRegionList() {
+      this.repairRegionList = getDictDataList("RepairRegion");
+    },
     //获取楼栋
     getBuildList() {
       Api.getBuildInfo().then((res) => {

src/views/repairDetail.vue

@@ -10,9 +10,10 @@
   </van-nav-bar>
   <div class="page_info">
     <div class="info_list">
-      <van-cell-group class="cell_title_icon">
+      <van-cell-group :border="false">
         <van-cell
           title="报修信息"
+          title-style="color: #0c1935"
           :icon="require('@/assets/line.svg')"
           v-if="
             role == 'admin' && (dataForm.status == 2 || dataForm.status == 3)
@@ -22,11 +23,15 @@
         <van-cell title="报修位置" :value="dataForm.repairPosition" />
         <van-cell
           title="报修区域"
-          :value="`${repairRegion_filter(dataForm.repairRegion)}`"
+          :value="`${
+            dict_filter(dataForm.repairRegion, 'repairRegionList')['dictLabel']
+          }`"
         />
         <van-cell
           title="报修类型"
-          :value="`${repairType_filter(dataForm.repairType)}`"
+          :value="`${
+            dict_filter(dataForm.repairType, 'repairTypeList')['dictLabel']
+          }`"
         />
         <van-cell title="联系人" :value="dataForm.contactPerson" />
         <van-cell title="联系电话" :value="dataForm.contactPhone" />
@@ -44,16 +49,21 @@
         </van-cell>
       </van-cell-group>
       <van-cell-group
-        class="cell_title_icon"
         v-if="role == 'admin' && (dataForm.status == 2 || dataForm.status == 3)"
       >
-        <van-cell title="维修信息" :icon="require('@/assets/line.svg')" />
+        <van-cell
+          title="维修信息"
+          title-style="color: #0c1935"
+          :icon="require('@/assets/line.svg')"
+        />
         <van-cell
           title="紧急程度"
-          :value="`${urgency_filter(dataForm.urgency)}`"
+          :value="`${
+            dict_filter(dataForm.urgency, 'urgencyTypeList')['dictLabel']
+          }`"
         />
         <van-cell title="维修人员" :value="dataForm.repairPersonName" />
-        <van-cell title="联系电话" :value="dataForm.repairPersonId" />
+        <van-cell title="联系电话" :value="dataForm.repairPersonMobile" />
         <van-cell
           title="维修完成时间"
           :value="dataForm.repairFinishTime"
@@ -63,47 +73,43 @@
     </div>
   </div>
   <template v-if="dataForm.status == 2 && role == 'repair'">
-    <div class="save_btn">
-      <van-button
-        block
-        type="primary"
-        loading-type="spinner"
-        :loading="loading"
-        loading-text="维修完成"
-        @click="handleClick('finish')"
-      >
-        维修完成
-      </van-button>
-    </div>
+    <van-submit-bar class="save_btn">
+      <template #button>
+        <van-button block type="primary" @click="handleClick('finish')">
+          维修完成
+        </van-button>
+      </template>
+    </van-submit-bar>
   </template>
-  <template v-if="role == 'admin' && dataForm.status == 1">
-    <div class="save_btn">
-      <van-button
-        block
-        type="primary"
-        loading-type="spinner"
-        @click="handleClick('dispatch')"
-      >
-        指派维修人员
-      </van-button>
-    </div>
+  <template v-if="role == 'admin' && dataForm.status == 1 && !showPopup">
+    <van-submit-bar class="save_btn">
+      <template #button>
+        <van-button block type="primary" @click="handleClick('dispatch')">
+          指派维修人员
+        </van-button>
+      </template>
+    </van-submit-bar>
   </template>
 
   <van-popup
     v-model:show="showPopup"
     position="bottom"
-    :style="{ height: '30%' }"
+    :safe-area-inset-bottom="true"
+    :overlay-style="{ background: 'unset' }"
     class="popup_info"
   >
-    <van-row class="popup_title">
-      <van-col :span="24">{{ popupTitle }}</van-col>
+    <van-row align="center" justify="center" class="popup_title">
+      <van-col>{{ popupTitle }}</van-col>
     </van-row>
-    <van-divider style="margin: 0" />
+    <van-divider
+      style="border-color: #d8d8d8; border-bottom-width: 1px; margin: 0"
+    />
     <van-form
       ref="dataForm"
       input-align="right"
       error-message-align="right"
       @submit="onSubmit"
+      style="background: #f6f6f6"
     >
       <van-cell-group :border="false">
         <van-field
@@ -123,7 +129,7 @@
         >
           <van-picker
             :columns="repairPersonList"
-            :columns-field-names="customFieldName"
+            :columns-field-names="userFieldNames"
             @cancel="showRepairPersonPicker = false"
             @confirm="
               (value) => {
@@ -146,27 +152,21 @@
         />
         <van-popup v-model:show="showUrgencyPicker" round position="bottom">
           <van-picker
-            :columns="repairUrgencyList"
+            :columns="urgencyTypeList"
+            :columns-field-names="urgencyFieldNames"
             @cancel="showUrgencyPicker = false"
             @confirm="
               (value) => {
-                dataForm.urgency = value.value;
-                dataForm.urgencyName = value.text;
+                dataForm.urgency = value.dictValue;
+                dataForm.urgencyName = value.dictLabel;
                 showUrgencyPicker = false;
               }
             "
           />
         </van-popup>
       </van-cell-group>
-      <div class="save_btn">
-        <van-button
-          block
-          type="primary"
-          :loading="loading"
-          loading-type="spinner"
-          loading-text="提交"
-          native-type="submit"
-        >
+      <div style="margin-top: 12px; padding: 8px 16px" class="save_btn">
+        <van-button block type="primary" native-type="submit">
           提交
         </van-button>
       </div>
@@ -174,9 +174,9 @@
   </van-popup>
 </template>
 <script>
-import Api from "../utils/api";
-import { isEmpty } from "@/utils/index.js";
-import VCountUp from "./CountUp";
+import Api from "@/utils/api";
+import { isEmpty, getDictDataList } from "@/utils/index";
+import VCountUp from "../CountUp";
 export default {
   components: {
     "v-count-up": VCountUp,
@@ -184,7 +184,6 @@ export default {
   data() {
     return {
       role: "",
-      loading: false,
       showImgPreview: false,
       imagesList: [],
       showPopup: false,
@@ -192,19 +191,22 @@ export default {
       showRepairPersonPicker: false,
       showUrgencyPicker: false,
       repairPersonList: [],
-      customFieldName: {
+      urgencyFieldNames: {
+        text: "dictLabel",
+        value: "dictValue",
+      },
+      userFieldNames: {
         text: "name",
-        value: "id",
+        value: "mobile",
       },
-      repairUrgencyList: [
-        { text: "非常紧急", value: 1 },
-        { text: "紧急", value: 2 },
-        { text: "普通", value: 3 },
-      ],
+      repairTypeList: [],
+      repairRegionList: [],
+      urgencyTypeList: [],
       dataForm: {
         id: "",
         repairPersonId: "",
         repairPersonName: "",
+        repairPersonMobile: "",
         urgency: "",
         urgencyName: "",
         repairTime: "",
@@ -220,51 +222,15 @@ export default {
       },
     };
   },
-  created() {
+  async mounted() {
     this.role = localStorage.getItem("role");
-    this.getDataDetail();
-    this.getUserList();
+    this.getRepairTypeList();
+    this.getRepairRegionList();
+    this.getUrgencyTypeList();
+    await this.getUserList();
+    this.getDataList();
   },
   methods: {
-    repairType_filter(val) {
-      if (isEmpty(val)) {
-        return "";
-      }
-      if (val == 1) {
-        return "水";
-      }
-      if (val == 2) {
-        return "电";
-      }
-      if (val == 3) {
-        return "其他";
-      }
-    },
-    repairRegion_filter(val) {
-      if (isEmpty(val)) {
-        return "";
-      }
-      if (val == 1) {
-        return "公共区域";
-      }
-      if (val == 2) {
-        return "室内";
-      }
-    },
-    urgency_filter(val) {
-      if (isEmpty(val)) {
-        return "";
-      }
-      if (val == 1) {
-        return "非常紧急";
-      }
-      if (val == 2) {
-        return "紧急";
-      }
-      if (val == 3) {
-        return "普通";
-      }
-    },
     //获取维修人员
     getUserList() {
       Api.repairInfoUser({
@@ -276,11 +242,37 @@ export default {
         }
       });
     },
-    getDataDetail() {
+    getRepairRegionList() {
+      this.repairRegionList = getDictDataList("RepairRegion");
+    },
+
+    getRepairTypeList() {
+      this.repairTypeList = getDictDataList("RepairType");
+    },
+
+    getUrgencyTypeList() {
+      this.urgencyTypeList = getDictDataList("UrgencyType");
+    },
+    dict_filter(val, list) {
+      if (isEmpty(val)) {
+        return {};
+      }
+      return this[list].find((item) => item.dictValue == val);
+    },
+
+    getDataList() {
       Api.repairInfoDetail(this.$route.query.id).then((res) => {
         if (res.code == 0) {
           this.dataForm = res.data;
           this.imagesList = this.dataForm.faultPics.split(",");
+          if (this.dataForm.repairPersonId) {
+            this.dataForm.repairPersonName = this.repairPersonList.find(
+              (item) => (item.id = this.dataForm.repairPersonId)
+            ).name;
+            this.dataForm.repairPersonMobile = this.repairPersonList.find(
+              (item) => (item.id = this.dataForm.repairPersonId)
+            ).mobile;
+          }
         } else {
         }
       });
@@ -292,10 +284,6 @@ export default {
             message: "请确认是否维修完成",
           })
           .then(() => {
-            this.loading = true;
-            setTimeout(() => {
-              this.loading = false;
-            }, 2000);
             // on confirm
           })
           .catch(() => {
@@ -322,7 +310,7 @@ export default {
         if (res.code == 0) {
           this.$toast.success("保存成功");
           this.showPopup = false;
-          this.getDataDetail();
+          this.getDataList();
         } else {
           this.$toast.fail("保存失败");
         }
@@ -347,13 +335,14 @@ export default {
           margin-bottom: 8px;
         }
       }
-      .cell_title_icon {
+      .van-cell-group {
+        margin: 12px 0 0 0;
         .van-icon {
           display: flex;
           align-items: center;
         }
       }
-      .van-cell__left-icon{
+      .van-cell__left-icon {
         margin-right: 0;
       }
     }
@@ -362,15 +351,17 @@ export default {
 </style>
 <style lang="scss">
 .popup_info {
+  height: auto;
   box-shadow: 0px -10px 20px 0px rgba(27, 32, 38, 0.1);
   border-radius: 20px 20px 0px 0px;
   /deep/ {
     .popup_title {
-      padding: 14px 0;
-      font-weight: 600;
-      font-size: 16px;
-      color: #333333;
-      text-shadow: 0px -10px 20px rgba(27, 32, 38, 0.1);
+      padding: 12px 0;
+      font-weight: 500;
+      background-color: #ffffff;
+      .van-col {
+        font-size: 18px;
+      }
     }
   }
   .van-field__label {

src/views/repair/index.vue

@@ -0,0 +1,3 @@
+<template >
+  <router-view></router-view>
+</template>

src/views/repairList.vue

@@ -15,13 +15,19 @@
         v-if="role == 'admin' || role == 'Maintenance'"
       >
         <van-tabs
-          v-model:active="activeTab"
+          v-model:active="dataForm.status"
           title-active-color="#2E69EB"
           title-inactive-color="#0C1935"
         >
-          <van-tab name="1" title="待指派" v-if="role == 'admin'" />
-          <van-tab name="2" title="已指派(待维修)" />
-          <van-tab name="3" title="已维修" />
+          <van-tab
+            :name="item.dictValue"
+            :title="item.dictLabel"
+            v-for="item in repairStatusList"
+            :key="item.dictValue"
+            :style="{
+              display: role == 'admin' && item.dictValue == 1 ? '' : 'none',
+            }"
+          />
         </van-tabs>
       </div>
       <van-row align="center" class="list_total">
@@ -54,18 +60,20 @@
                 class="urgency_type"
                 :style="{
                   'background-color': `${
-                    urgency_filter(item.urgency)['color']
+                    dict_filter(item.urgency, 'urgencyTypeList')['color']
                   }`,
                 }"
               >
                 <van-col>{{
-                  `${urgency_filter(item.urgency)["label"]}`
+                  `${dict_filter(item.urgency, "urgencyTypeList")["dictLabel"]}`
                 }}</van-col>
               </van-row>
             </template>
             <van-col class="header">{{ item.repairPosition }}</van-col>
             <van-col
-              >报修类型：{{ `${repairType_filter(item.repairType)}` }}</van-col
+              >报修类型：{{
+                `${dict_filter(item.repairType, "repairTypeList")["dictLabel"]}`
+              }}</van-col
             >
             <template v-if="item.status == 1">
               <van-col>报修时间：{{ item.createDate }}</van-col>
@@ -83,9 +91,9 @@
   </van-pull-refresh>
 </template>
 <script>
-import Api from "../utils/api";
-import { isEmpty } from "@/utils/index.js";
-import VCountUp from "./CountUp";
+import Api from "@/utils/api";
+import { isEmpty, getDictDataList } from "@/utils/index";
+import VCountUp from "../CountUp";
 export default {
   components: {
     "v-count-up": VCountUp,
@@ -94,9 +102,14 @@ export default {
     return {
       role: "",
       title: "",
-      activeTab: 1,
-      page: 1,
-      limit: 10,
+      repairStatusList: [],
+      repairTypeList: [],
+      urgencyTypeList: [],
+      dataForm: {
+        status: 1,
+        page: 1,
+        limit: 10,
+      },
       dataList: [],
       loading: false,
       refreshing: false,
@@ -104,7 +117,7 @@ export default {
     };
   },
   watch: {
-    activeTab: {
+    "dataForm.status": {
       handler(newval, oldval) {
         this.onRefresh();
       },
@@ -121,37 +134,47 @@ export default {
     }
     if (this.role == "Tenant") {
       this.title = "报修记录";
+      this.dataForm.status = "";
     }
+    this.getRepairStatusList();
+    this.getRepairTypeList();
+    this.getUrgencyTypeList();
   },
 
   methods: {
-    repairType_filter(val) {
-      if (isEmpty(val)) {
-        return "";
-      }
-      if (val == 1) {
-        return "水";
-      }
-      if (val == 2) {
-        return "电";
-      }
-      if (val == 3) {
-        return "其他";
+    getRepairStatusList() {
+      this.repairStatusList = getDictDataList("RepairStatus");
+      if (this.role == "Maintenance") {
+        this.repairStatusList = this.repairStatusList.filter(
+          (item) => item.dictValue != 1
+        );
       }
     },
-    urgency_filter(val) {
+
+    getRepairTypeList() {
+      this.repairTypeList = getDictDataList("RepairType");
+    },
+
+    getUrgencyTypeList() {
+      this.urgencyTypeList = getDictDataList("UrgencyType");
+      this.urgencyTypeList.forEach((item) => {
+        if (item.dictValue == 1) {
+          item.color = "#ED3A25";
+        }
+        if (item.dictValue == 2) {
+          item.color = "#FF9C27";
+        }
+        if (item.dictValue == 3) {
+          item.color = "#30D3A2";
+        }
+      });
+    },
+
+    dict_filter(val, list) {
       if (isEmpty(val)) {
         return {};
       }
-      if (val == 1) {
-        return { label: "非常紧急", color: "#ED3A25" };
-      }
-      if (val == 2) {
-        return { label: "紧急", color: "#FF9C27" };
-      }
-      if (val == 3) {
-        return { label: "普通", color: "#30D3A2" };
-      }
+      return this[list].find((item) => item.dictValue == val);
     },
     onLoad() {
       setTimeout(async () => {
@@ -160,25 +183,22 @@ export default {
           this.refreshing = false;
         }
         await this.getDataList();
-        this.page++; // 分页数加一
+        this.dataForm.page++; // 分页数加一
       }, 100);
     },
     onRefresh() {
       // 清空列表数据
       this.finished = false;
+      this.dataList = [];
       // 重新加载数据
       // 将 loading 设置为 true，表示处于加载状态
       this.loading = true;
-      this.page = 1; // 分页数赋值为1
+      this.dataForm.page = 1; // 分页数赋值为1
       this.onLoad();
     },
     // 获取列表数据方法
     async getDataList() {
-      Api.repairInfoQuery({
-        page: this.page,
-        limit: this.limit,
-        status: this.activeTab,
-      }).then((res) => {
+      Api.repairInfoQuery(this.dataForm).then((res) => {
         if (res.code == 0) {
           if (res.data) {
             if (res.data.list.length == 0) {
@@ -208,7 +228,7 @@ export default {
 
     toPath(id) {
       this.$router.push({
-        path: "/repairDetail",
+        path: "/repair/detail",
         query: {
           id: id,
         },
@@ -267,13 +287,7 @@ export default {
       &:nth-last-child(1) {
         margin-bottom: 0;
       }
-      .header {
-        height: 22px;
-        font-size: 16px;
-        color: #313836;
-        line-height: 22px;
-        margin-bottom: 8px;
-      }
+
       .van-col {
         height: 18px;
         font-size: 14px;
@@ -284,6 +298,13 @@ export default {
           margin-bottom: 0;
         }
       }
+      .header {
+        height: 22px;
+        font-size: 16px;
+        color: #0c1935;
+        line-height: 22px;
+        margin-bottom: 8px;
+      }
       .urgency_type {
         position: absolute;
         top: 0;

src/views/checkClock.vue

@@ -62,7 +62,7 @@
   </div>
 </template>
 <script>
-import { isEmpty } from "@/utils/index.js";
+import { isEmpty } from "@/utils/index";
 export default {
   data() {
     return {
@@ -130,9 +130,6 @@ export default {
 <style lang="scss" scoped>
 .page_info {
   padding: 16px;
-  max-height: calc(
-    100% - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 46px - 32px
-  );
   overflow-y: auto;
   .info_pannel {
     display: flex;

src/views/review/index.vue

@@ -0,0 +1,3 @@
+<template >
+  <router-view></router-view>
+</template>

src/views/reviewRecord.vue

@@ -26,13 +26,9 @@
             fit="contain"
           />
         </van-col>
-        <van-col
-          @click="
-            $route.push({ path: '/userInfo', query: { type: 'account' } })
-          "
-        >
+        <van-col>
           <van-image
-            :src="require('@/assets/user.svg')"
+            :src="require('@/assets/search.svg')"
             width="16"
             height="16"
             fit="contain"
@@ -100,8 +96,8 @@
   </van-pull-refresh>
 </template>
 <script>
-import Api from "../utils/api";
-import VCountUp from "./CountUp";
+import Api from "@/utils/api";
+import VCountUp from "../CountUp";
 export default {
   components: {
     "v-count-up": VCountUp,

src/views/userInfo.vue

@@ -48,18 +48,21 @@
               @blur="handleBlur"
             />
           </van-cell-group>
-          <div class="save_btn">
-            <van-button
-              block
-              type="primary"
-              :loading="loading"
-              loading-type="spinner"
-              native-type="submit"
-              loading-text="提交"
-            >
-              提交
-            </van-button>
-          </div>
+
+          <van-submit-bar class="save_btn">
+            <template #button>
+              <van-button
+                block
+                type="primary"
+                :loading="loading"
+                loading-type="spinner"
+                loading-text="提交"
+                native-type="submit"
+              >
+                提交
+              </van-button>
+            </template>
+          </van-submit-bar>
         </van-form>
       </template>
     </div>
@@ -95,11 +98,15 @@ export default {
   created() {
     this.type = this.$route.query.type;
     this.title =
-      (this.type && (this.type == "account" ? "账号中心" : "更改密码")) ||
-      "";
+      (this.type && (this.type == "account" ? "账号中心" : "更改密码")) || "";
     this.dataForm.username = this.$store.state.username;
     this.dataForm.tel = this.$store.state.userMobile;
-    this.dataForm.password = this.plusXing(this.dataForm.password, 0, 0, "*");
+    this.dataForm.password = this.plusXing(
+      this.$store.state.password,
+      0,
+      0,
+      "*"
+    );
   },
   methods: {
     /* 部分隐藏处理