Browse Source

设备中心模块bug修改

bobo04052021@163.com 3 days ago
parent
commit
0faff57eb4
3 changed files with 210 additions and 171 deletions
  1. 2 1
      pages/history/history.vue
  2. 154 133
      pages/home/home.vue
  3. 54 37
      pages/operation/operation.vue

+ 2 - 1
pages/history/history.vue

@@ -270,7 +270,8 @@ export default {
     this.EndTime = dayjs(endTime).format("YYYY-MM-DD HH:mm:ss");
   },
   mounted() {
-    // this.TabCur = this.deviceType;
+    this.TabCur = "gate";
+    this.loadData(this.TabCur);
   },
   methods: {
     loadData(type) {

+ 154 - 133
pages/home/home.vue

@@ -2,149 +2,158 @@
   <view class="container">
     <view v-if="!menushow" class="main">
       <view class="u-page">
-        <u-list>
-          <u-list-item
-            class="itemback"
-            v-for="(item, index) in curlist"
-            :key="index"
-          >
-            <div @tap="openNewPage(item)">
-              <u-row gutter="5" customStyle="margin-bottom: 10px">
-                <u-col span="24">
-                  <image
-                    style="position: absolute; width: 18px; height: 18px"
-                    class="icon"
-                    :src="getIcon(TabCur)"
-                    alt="Icon"
-                  />
-                  <span class="title">{{ item.strinstallpos }}</span>
-                </u-col>
-              </u-row>
-              <u-row gutter="5" customStyle="margin-bottom: 10px">
-                <u-col span="3" style="margin-right: 5rpx">
-                  <div v-if="item.netStatus == 0" class="error-tag1">
+        <u-list :class="{ empty: curlist.length === 0 }">
+          <template v-if="curlist.length > 0">
+            <u-list-item
+              class="itemback"
+              v-for="(item, index) in curlist"
+              :key="index"
+            >
+              <div @tap="openNewPage(item)">
+                <u-row gutter="5" customStyle="margin-bottom: 10px">
+                  <u-col span="24">
                     <image
-                      src="/static/model/connectFalse.svg"
-                      alt=""
-                      class="icon-style"
+                      style="position: absolute; width: 18px; height: 18px"
+                      class="icon"
+                      :src="getIcon(TabCur)"
+                      alt="Icon"
                     />
-                    <span style="float: right">断开</span>
-                  </div>
-                  <div v-else class="success-tag">
-                    <image
-                      src="/static/model/connectTrue.svg"
-                      alt=""
-                      class="icon-style"
-                    />
-                    <span style="float: right">连接</span>
-                  </div>
-                </u-col>
-                <u-col span="4">
-                  <div v-if="item.warnFlag == 0" class="success-tag">
-                    <image
-                      src="/static/model/alarmTrue.svg"
-                      alt=""
-                      class="icon-style"
-                    />
-                    <span style="float: right">连接</span>
-                  </div>
-                  <div v-else class="error-tag">
-                    <image
-                      src="/static/model/alarmFalse.svg"
-                      alt=""
-                      class="icon-style"
-                    />
-                    <span style="float: right">断开</span>
-                  </div>
-                </u-col>
-                <u-col span="5">
-                  <u--text class="timetext" :text="item.readTime"></u--text>
-                </u-col>
-              </u-row>
-              <view v-if="colums[TabCur + '_monitor'] != null">
-                <view
-                  class="datacard"
-                  v-for="(showitem, index) in colums[TabCur + '_monitor']"
-                  :key="index"
-                  v-show="
-                    showitem.appShow == 1 &&
-                    showitem.monitorcode != 'strinstallpos' &&
-                    showitem.monitorcode != 'netStatus' &&
-                    showitem.monitorcode != 'warnFlag' &&
-                    showitem.monitorcode != 'readTime' &&
-                    showitem.monitorcode != ''
-                  "
-                >
+                    <span class="title">{{ item.strinstallpos }}</span>
+                  </u-col>
+                </u-row>
+                <u-row gutter="5" customStyle="margin-bottom: 10px">
+                  <u-col span="3" style="margin-right: 5rpx">
+                    <div v-if="item.netStatus == 0" class="error-tag1">
+                      <image
+                        src="/static/model/connectFalse.svg"
+                        alt=""
+                        class="icon-style"
+                      />
+                      <span style="float: right">断开</span>
+                    </div>
+                    <div v-else class="success-tag">
+                      <image
+                        src="/static/model/connectTrue.svg"
+                        alt=""
+                        class="icon-style"
+                      />
+                      <span style="float: right">连接</span>
+                    </div>
+                  </u-col>
+                  <u-col span="4">
+                    <div v-if="item.warnFlag == 0" class="success-tag">
+                      <image
+                        src="/static/model/alarmTrue.svg"
+                        alt=""
+                        class="icon-style"
+                      />
+                      <span style="float: right">连接</span>
+                    </div>
+                    <div v-else class="error-tag">
+                      <image
+                        src="/static/model/alarmFalse.svg"
+                        alt=""
+                        class="icon-style"
+                      />
+                      <span style="float: right">断开</span>
+                    </div>
+                  </u-col>
+                  <u-col span="5">
+                    <u--text class="timetext" :text="item.readTime"></u--text>
+                  </u-col>
+                </u-row>
+                <view v-if="colums[TabCur + '_monitor'] != null">
                   <view
-                    :class="TabCur"
-                    style="padding-top: 10rpx; padding-bottom: 10rpx"
+                    class="datacard"
+                    v-for="(showitem, index) in colums[TabCur + '_monitor']"
+                    :key="index"
+                    v-show="
+                      showitem.appShow == 1 &&
+                      showitem.monitorcode != 'strinstallpos' &&
+                      showitem.monitorcode != 'netStatus' &&
+                      showitem.monitorcode != 'warnFlag' &&
+                      showitem.monitorcode != 'readTime' &&
+                      showitem.monitorcode != ''
+                    "
                   >
                     <view
-                      v-if="
-                        showitem.datatype == 1 &&
-                        showitem.monitorcode == 'doorUse'
-                      "
-                      class="demo-layout bg-purple-light"
-                      style="
-                        margin-top: 10rpx;
-                        color: #3787fe;
-                        font-size: 30rpx;
-                        margin-top: 5rpx;
-                      "
-                    >
-                      {{
-                        item[showitem.monitorcode] == "2"
-                          ? "行人"
-                          : item[showitem.monitorcode] == "1"
-                          ? "行车"
-                          : "-"
-                      }}
-                    </view>
-                    <view
-                      v-else-if="showitem.datatype == 1"
-                      class="demo-layout bg-purple-light"
-                      style="
-                        margin-top: 10rpx;
-                        color: #3787fe;
-                        font-size: 30rpx;
-                        margin-top: 5rpx;
-                      "
+                      :class="TabCur"
+                      style="padding-top: 10rpx; padding-bottom: 10rpx"
                     >
-                      {{
-                        item[showitem.monitorcode] == null ||
-                        item[showitem.monitorcode] == ""
-                          ? "-"
-                          : item[showitem.monitorcode]
-                      }}
-                    </view>
-                    <view
-                      v-else-if="showitem.datatype == 2"
-                      class="demo-layout bg-purple-light"
-                      style="color: #3787fe; font-size: 30rpx; margin-top: 5rpx"
-                    >
-                      {{
-                        item.readData[showitem.monitorcode] == null ||
-                        item.readData[showitem.monitorcode] == ""
-                          ? "-"
-                          : item.readData[showitem.monitorcode]
-                      }}
-                    </view>
+                      <view
+                        v-if="
+                          showitem.datatype == 1 &&
+                          showitem.monitorcode == 'doorUse'
+                        "
+                        class="demo-layout bg-purple-light"
+                        style="
+                          margin-top: 10rpx;
+                          color: #3787fe;
+                          font-size: 30rpx;
+                          margin-top: 5rpx;
+                        "
+                      >
+                        {{
+                          item[showitem.monitorcode] == "2"
+                            ? "行人"
+                            : item[showitem.monitorcode] == "1"
+                            ? "行车"
+                            : "-"
+                        }}
+                      </view>
+                      <view
+                        v-else-if="showitem.datatype == 1"
+                        class="demo-layout bg-purple-light"
+                        style="
+                          margin-top: 10rpx;
+                          color: #3787fe;
+                          font-size: 30rpx;
+                          margin-top: 5rpx;
+                        "
+                      >
+                        {{
+                          item[showitem.monitorcode] == null ||
+                          item[showitem.monitorcode] == ""
+                            ? "-"
+                            : item[showitem.monitorcode]
+                        }}
+                      </view>
+                      <view
+                        v-else-if="showitem.datatype == 2"
+                        class="demo-layout bg-purple-light"
+                        style="
+                          color: #3787fe;
+                          font-size: 30rpx;
+                          margin-top: 5rpx;
+                        "
+                      >
+                        {{
+                          item.readData[showitem.monitorcode] == null ||
+                          item.readData[showitem.monitorcode] == ""
+                            ? "-"
+                            : item.readData[showitem.monitorcode]
+                        }}
+                      </view>
 
-                    <view
-                      class="demo-layout bg-purple-light"
-                      style="
-                        margin-top: 6rpx;
-                        color: #677799;
-                        margin-bottom: 5rpx;
-                      "
-                    >
-                      {{ showitem.des }}
+                      <view
+                        class="demo-layout bg-purple-light"
+                        style="
+                          margin-top: 6rpx;
+                          color: #677799;
+                          margin-bottom: 5rpx;
+                        "
+                      >
+                        {{ showitem.des }}
+                      </view>
                     </view>
                   </view>
                 </view>
-              </view>
-            </div>
-          </u-list-item>
+              </div>
+            </u-list-item>
+          </template>
+          <template v-else>
+            <div class="empty-message">数据为空</div>
+          </template>
         </u-list>
       </view>
     </view>
@@ -312,6 +321,18 @@ export default {
 </script>
 
 <style>
+.empty {
+  background: url("/static/empty.png") no-repeat;
+  background-size: 100% 50%;
+}
+.empty-message {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 16px;
+  line-height: 80vh;
+  color: #333;
+}
 >>> .u-navbar--fixed {
   /* margin-top: 20px; */
 }

+ 54 - 37
pages/operation/operation.vue

@@ -26,49 +26,54 @@
             ></u-icon>
           </div>
         </div>
-        <u-list>
-          <u-list-item
-            class="itemback"
-            v-for="(item, index) in historyData"
-            :key="index"
-          >
-            <view>
-              <view class="content flcard">
-                <view class="datacard user">
-                  <view style="margin: 20rpx 20rpx">
-                    <text class="text-style">{{ item.realname }}</text>
+        <u-list :class="{ emptyhistory: historyData.length === 0 }">
+          <template v-if="historyData.length > 0">
+            <u-list-item
+              class="itemback"
+              v-for="(item, index) in historyData"
+              :key="index"
+            >
+              <view>
+                <view class="content flcard">
+                  <view class="datacard user">
+                    <view style="margin: 20rpx 20rpx">
+                      <text class="text-style">{{ item.realname }}</text>
+                    </view>
+                    <view style="margin: 20rpx 20rpx; font-size: small"
+                      >用户</view
+                    >
                   </view>
-                  <view style="margin: 20rpx 20rpx; font-size: small"
-                    >用户</view
-                  >
-                </view>
-                <view class="datacard device">
-                  <view style="margin: 20rpx 20rpx">
-                    <text class="text-style">{{ item.devicename }}</text>
+                  <view class="datacard device">
+                    <view style="margin: 20rpx 20rpx">
+                      <text class="text-style">{{ item.devicename }}</text>
+                    </view>
+                    <view style="margin: 20rpx 20rpx; font-size: small"
+                      >操作设备</view
+                    >
                   </view>
-                  <view style="margin: 20rpx 20rpx; font-size: small"
-                    >操作设备</view
-                  >
-                </view>
-                <view class="datacard record">
-                  <view style="margin: 20rpx 20rpx">
-                    <text class="text-style">{{ item.strremark }}</text>
+                  <view class="datacard record">
+                    <view style="margin: 20rpx 20rpx">
+                      <text class="text-style">{{ item.strremark }}</text>
+                    </view>
+                    <view style="margin: 20rpx 20rpx; font-size: small"
+                      >操作记录</view
+                    >
                   </view>
-                  <view style="margin: 20rpx 20rpx; font-size: small"
-                    >操作记录</view
-                  >
-                </view>
-                <view class="datacard time">
-                  <view style="margin: 20rpx 20rpx">
-                    <text class="text-style">{{ item.createTime }}</text>
+                  <view class="datacard time">
+                    <view style="margin: 20rpx 20rpx">
+                      <text class="text-style">{{ item.createTime }}</text>
+                    </view>
+                    <view style="margin: 20rpx 20rpx; font-size: small"
+                      >操作时间</view
+                    >
                   </view>
-                  <view style="margin: 20rpx 20rpx; font-size: small"
-                    >操作时间</view
-                  >
                 </view>
               </view>
-            </view>
-          </u-list-item>
+            </u-list-item>
+          </template>
+          <template v-else>
+            <view class="empty-message">暂无数据</view>
+          </template>
         </u-list>
       </view>
     </view>
@@ -178,6 +183,18 @@ export default {
 </script>
 
 <style>
+.emptyhistory {
+  background: url("/static/empty.png") no-repeat;
+  background-size: 100% 50%;
+}
+.empty-message {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 16px;
+  line-height: 80vh;
+  color: #333;
+}
 .main {
   display: flex;
   flex-direction: column;