优化问题

src/utils/date.js

@@ -0,0 +1,35 @@
+/**
+ * 将秒钟转为描述
+ */
+export function toDescriptionFromSecond(data) {
+  let seconds = data;
+  if (data instanceof String) {
+    seconds = parseInt(data)
+  }
+  let positive = true;
+  if (seconds < 0) {
+    positive =false;
+    seconds = -seconds;
+  }
+
+  let desc = {
+    day: parseInt(seconds / 86400),
+    hour: parseInt((seconds % 86400) / 3600),
+    minute: parseInt((seconds % 3600) / 60),
+    second: parseInt(seconds % 60),
+    positive: positive,
+  }
+
+  desc.text = `${positive ? '' : '-'} `;
+  if (desc.day > 0) {
+    desc.text += desc.day + ' 天 ';
+  }
+  if (desc.day > 0 || desc.hour > 0) {
+    desc.text += desc.hour + ' 时 ';
+  }
+  if (desc.day > 0 || desc.hour > 0 || desc.minute > 0) {
+    desc.text += desc.minute + ' 分 ';
+  }
+  desc.text += desc.second + ' 秒';
+  return desc;
+}

src/utils/index.js

@@ -454,3 +454,9 @@ export function escapeHtml(text, allowScript = false) {
 export function isEmpty(str) {
   return str == null || str.length === 0;
 }
+
+// 获取列表label
+export function findLabel(options, value, prop = 'value', propLabel = 'label') {
+  let obj = options.find(item => item[prop] === value);
+  return obj == null ? null : obj[propLabel]
+}

src/views/ss/suit/index.vue

@@ -85,7 +85,7 @@
       <el-table-column label="店铺名称" align="center" prop="storeName" />
       <el-table-column label="套餐名称" align="center" prop="name" />
       <el-table-column label="通电时间" align="center" prop="value" >
-        <template slot-scope="d">{{d.row.value}}分钟</template>
+        <template slot-scope="d">{{d.row.value}} {{suitTimeUnit(d.row.timeUnit)}}</template>
       </el-table-column>
       <el-table-column label="价格" align="center" prop="price">
         <template slot-scope="d">{{d.row.price | money}}元</template>
@@ -130,7 +130,18 @@
           <el-input v-model="form.name" placeholder="请输入套餐名称" />
         </el-form-item>
         <el-form-item label="通电时间" prop="value">
-          <el-input-number v-model="form.value" placeholder="请输入通电时间" :step="1" step-strictly :min="1"/> 分钟
+          <el-input v-model="form.value" placeholder="请输入通电时间" type="number">
+            <template #append>
+              <el-select v-model="form.timeUnit" style="width: 6em">
+                <el-option
+                  v-for="option of dict.type.suit_time_unit"
+                  :key="option.value"
+                  :label="option.label"
+                  :value="option.value"
+                />
+              </el-select>
+            </template>
+          </el-input>
         </el-form-item>
         <el-form-item label="价格" prop="price">
           <el-input-number v-model="form.price" placeholder="请输入价格(元）" :min="0" :precision="2"/> 元
@@ -150,13 +161,17 @@
 <script>
 import { listSuit, getSuit, delSuit, addSuit, updateSuit } from "@/api/ss/suit";
 import DeviceInput from '@/components/Business/Device/DeviceInput.vue'
-import device from '@/views/system/device/index.vue'
+import { findLabel } from '@/utils'
 
 export default {
   name: "Suit",
+  dicts: ['suit_time_unit'],
   computed: {
-    device() {
+    // 时长单位
-      return device
+    suitTimeUnit() {
+      return (unit) => {
+        return findLabel(this.dict.type.suit_time_unit, unit);
+      }
     }
   },
   components: { DeviceInput },
@@ -250,7 +265,8 @@ export default {
         createBy: null,
         updateTime: null,
         updateBy: null,
-        deleted: null
+        deleted: null,
+        timeUnit: '3'
       };
       this.resetForm("form");
     },

src/views/ss/time/index.vue

@@ -9,14 +9,24 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="操作人" prop="operatorName">
+      <el-form-item label="用户名称" prop="operatorName">
         <el-input
           v-model="queryParams.operatorName"
-          placeholder="请输入操作人名称"
+          placeholder="请输入用户名称"
           clearable
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
+      <el-form-item label="用户类型" prop="operatorType">
+        <el-select v-model="queryParams.operatorType" placeholder="请选择用户类型" @change="handleQuery">
+          <el-option
+            v-for="dict in dict.type.ss_record_time_operator_type"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          ></el-option>
+        </el-select>
+      </el-form-item>
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@@ -41,11 +51,11 @@
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="记录id" align="center" prop="id" width="100"/>
       <el-table-column label="时长" align="center" prop="amount" >
-        <template slot-scope="d">{{d.row.amount}} 分钟</template>
+        <template slot-scope="d">{{descTime(d.row.amount).text}}</template>
       </el-table-column>
-      <el-table-column label="变化原因" align="center" prop="reason" />\
+      <el-table-column label="变化原因" align="center" prop="reason" />
-      <el-table-column label="操作人名称" align="center" prop="operatorName" />
+      <el-table-column label="用户名称" align="center" prop="operatorName" />
-      <el-table-column label="操作人类型" align="center" prop="operatorType">
+      <el-table-column label="用户类型" align="center" prop="operatorType">
         <template slot-scope="scope">
           <dict-tag :options="dict.type.ss_record_time_operator_type" :value="scope.row.operatorType"/>
         </template>
@@ -73,10 +83,10 @@
         <el-form-item label="变化原因" prop="reason">
           <el-input v-model="form.reason" placeholder="请输入变化原因" />
         </el-form-item>
-        <el-form-item label="操作人名称" prop="operatorName">
+        <el-form-item label="用户名称" prop="operatorName">
           <el-input v-model="form.operatorName" placeholder="请输入操作人名称" />
         </el-form-item>
-        <el-form-item label="操作人类型" prop="operatorType">
+        <el-form-item label="用户类型" prop="operatorType">
           <el-select v-model="form.operatorType" placeholder="请选择操作人类型">
             <el-option
               v-for="dict in dict.type.ss_record_time_operator_type"
@@ -106,6 +116,7 @@
 <script>
 import { listTime, getTime, delTime, addTime, updateTime } from "@/api/ss/time";
 import { $view } from '@/utils/mixins'
+import { toDescriptionFromSecond } from '@/utils/date'
 
 export default {
   name: "RecordTime",
@@ -117,6 +128,13 @@ export default {
       default: () => {}
     }
   },
+  computed: {
+    descTime() {
+      return (second) => {
+        return toDescriptionFromSecond(second);
+      }
+    }
+  },
   data() {
     return {
       // 遮罩层
@@ -141,9 +159,9 @@ export default {
       queryParams: {
         pageNum: 1,
         pageSize: 10,
-        deviceSn: null,
         reason: null,
         operatorName: null,
+        operatorType: null,
       },
       // 表单参数
       form: {},

src/views/system/device/components/rechargeRecord.vue

@@ -10,7 +10,7 @@
       </el-table-column>
       <el-table-column align="center" label="时长">
         <template slot-scope="d">
-          <span>{{d.row.suitTime | money}} 分钟</span>
+          <span>{{d.row.suitTime}} {{suitTimeUnit(d.row.suitTimeUnit)}}</span>
         </template>
       </el-table-column>
     </el-table>
@@ -28,9 +28,11 @@
 
 <script>
 import {listBill} from "@/api/system/recharge";
+import { findLabel } from '@/utils'
 
 export default {
   name: 'rechargeRecord',
+  dicts: ['suit_time_unit'],
   props: {
     // 设备id
     deviceId: {
@@ -51,6 +53,14 @@ export default {
       }
     }
   },
+  computed: {
+    // 时长单位
+    suitTimeUnit() {
+      return (unit) => {
+        return findLabel(this.dict.type.suit_time_unit, unit);
+      }
+    }
+  },
   watch: {
     deviceId(nv, ov) {
       this.getChargeList(nv);

src/views/system/device/detail.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container" v-loading="loading">
-    <el-card class="box-card">
+    <el-card class="box-card" >
       <el-descriptions title="设备详情">
         <template slot="extra">
           <el-dropdown style="margin-right: 1em">
@@ -46,19 +46,15 @@
           <dict-tag :options="dict.type.sm_device_online_status" :value="deviceData.onlineStatus" size="mini"/>
         </el-descriptions-item>
         <el-descriptions-item label="型号">{{deviceData.model | defaultValue}}</el-descriptions-item>
-        <el-descriptions-item label="型号标签">
+        <el-descriptions-item label="型号功能">
           <dict-tag :options="dict.type.sm_model_tag" :value="deviceData.modelTags" size="mini"/>
         </el-descriptions-item>
         <el-descriptions-item label="所属用户">{{deviceData.userName | defaultValue}}</el-descriptions-item>
         <el-descriptions-item label="店铺名称">{{deviceData.storeName | defaultValue}}</el-descriptions-item>
-<!--        <el-descriptions-item label="断电方式">-->
-<!--          <dict-tag v-if="deviceData.outageWay != null" :options="dict.type.sm_device_outage_way" :value="deviceData.outageWay" size="mini"/>-->
-<!--          <template v-else>&#45;&#45;</template>-->
-<!--        </el-descriptions-item>-->
         <el-descriptions-item label="WIFI">{{deviceData.wifi | defaultValue}}</el-descriptions-item>
-        <el-descriptions-item label="剩余时长">{{surplusTime}} 分钟</el-descriptions-item>
+        <el-descriptions-item label="剩余时长">{{surplusTimeDesc(surplusTime).text}}</el-descriptions-item>
         <el-descriptions-item label="设备剩余时长">
-          {{deviceData.remainTime / 60 | money | defaultValue}} 分钟
+          {{surplusTimeDesc(deviceData.remainTime).text}}
           <span class="remark-text">最近更新时间：{{deviceData.lastPullTime}}</span>
         </el-descriptions-item>
 <!--        <el-descriptions-item label="实时功率">{{deviceData.realTimePower | defaultValue}} KWH</el-descriptions-item>-->
@@ -78,9 +74,6 @@
         <el-tab-pane label="用户充值记录" :lazy="true">
           <recharge-record :device-id="deviceData.deviceId"/>
         </el-tab-pane>
-<!--        <el-tab-pane label="时长归零记录" :lazy="true">-->
-<!--          <reset-record :device-id="deviceData.deviceId"/>-->
-<!--        </el-tab-pane>-->
         <el-tab-pane label="时长变化记录" :lazy="true">
           <record-time :query="{deviceId: deviceData.deviceId}" view="device"/>
         </el-tab-pane>
@@ -124,6 +117,7 @@ import TenantList from "@/views/system/device/components/tenantList.vue";
 import SuitList from '@/views/system/device/components/suitList.vue'
 import Suit from '@/views/ss/suit/index.vue'
 import RecordTime from '@/views/ss/time/index.vue'
+import { toDescriptionFromSecond } from '@/utils/date'
 
 export default {
   name: 'deviceDetail',
@@ -156,6 +150,11 @@ export default {
         return getWxIndexUrl({ s: device.deviceNo});
       }
     },
+    surplusTimeDesc() {
+      return (second) => {
+        return toDescriptionFromSecond(second);
+      }
+    }
   },
   created() {
     this.getDevice();
@@ -198,7 +197,6 @@ export default {
     },
     // 计算剩余时长
     computeSurplusTime() {
-      console.log('compute', this.deviceData.expireTime , this.surplusTime );
       if (this.deviceData.expireTime == null) {
         return 0;
       }
@@ -207,7 +205,7 @@ export default {
       if (expireTime < now) {
         return 0;
       }
-      return ((expireTime - now) / 60000).toFixed(2);
+      return ((expireTime - now) / 1000).toFixed(2);
     },
     handleReset() {
       this.$confirm('是否确认归零设备？', '警告', {
@@ -259,9 +257,8 @@ export default {
         this.surplusTime = this.computeSurplusTime();
         if (this.timer == null) {
           this.timer = setInterval(() => {
-            console.log('timer')
             this.surplusTime = this.computeSurplusTime();
-          }, 60000)
+          }, 1000)
         }
       }).finally(() => {
         this.loading = false;

src/views/system/recharge/detail.vue

@@ -21,6 +21,10 @@
           <dict-tag :value="detail.deviceRechargeStatus" :options="dict.type.sm_transaction_bill_device_recharge_status" size="small"/>
         </el-descriptions-item>
         <el-descriptions-item label="套餐名称">{{detail.suitName | defaultValue}}</el-descriptions-item>
+        <el-descriptions-item label="套餐时长">{{detail.suitTime | defaultValue}} {{suitTimeUnit(detail.suitTimeUnit)}}</el-descriptions-item>
+        <el-descriptions-item label="套餐使用状态">
+          <el-tag size="small" :type="suitUsingType[suitStatus]">{{suitUsingText[suitStatus]}}</el-tag>
+        </el-descriptions-item>
         <el-descriptions-item label="套餐开始时间">{{detail.suitStartTime | defaultValue}}</el-descriptions-item>
         <el-descriptions-item label="套餐结束时间">{{detail.suitEndTime | defaultValue}}</el-descriptions-item>
         <el-descriptions-item label="套餐失效时间">{{detail.suitExpireTime | defaultValue}}</el-descriptions-item>
@@ -66,16 +70,41 @@
 <script>
 import { getBill } from '@/api/system/recharge'
 import Refund from '@/views/ss/refund/index.vue'
+import { findLabel } from '@/utils'
 
 export default {
   name: 'RechargeDetail',
   components: { Refund },
-  dicts: ['sm_transaction_bill_pay_type','sm_transaction_bill_status', 'sm_transaction_bill_device_recharge_status'],
+  dicts: ['sm_transaction_bill_pay_type','sm_transaction_bill_status', 'sm_transaction_bill_device_recharge_status', 'suit_time_unit'],
+  computed: {
+    // 时长单位
+    suitTimeUnit() {
+      return (unit) => {
+        return findLabel(this.dict.type.suit_time_unit, unit);
+      }
+    },
+    // 套餐状态
+    suitStatus() {
+      if (this.detail.billId == null) {
+        return 0;
+      }
+      let now = new Date().getTime();
+      if (now < new Date(this.detail.suitStartTime).getTime()) {
+        return 1;
+      } else if (now < new Date(this.detail.suitEndTime).getTime()) {
+        return 2;
+      } else {
+        return 3;
+      }
+    },
+  },
   data() {
     return {
       loading: false,
       detail: {},
       id: null,
+      suitUsingType: ['info', 'warning', 'success', 'danger'],
+      suitUsingText: ['未知', '未生效', '使用中', '已失效']
     }
   },
   created() {
@@ -83,6 +112,7 @@ export default {
     this.getDetail();
   },
   methods: {
+
     getDetail() {
       getBill(this.id).then(res => {
         this.detail = res.data;