样式优化

.hbuilderx/launch.json

@@ -2,7 +2,7 @@
     "version" : "1.0",
     "configurations" : [
         {
-            "playground" : "custom",
+            "playground" : "standard",
             "type" : "uni-app:app-android"
         },
         {

common/service/config.service.js

@@ -1,12 +1,13 @@
 let BASE_URL = "";
 if (process.env.NODE_ENV == "development") {
-  // BASE_URL = "http://182.92.126.35:9999"; // 开发环境
+  BASE_URL = "http://182.92.126.35:9999"; // 开发环境
 } else {
   //如果是神东项目  ip地址配置在 login.vue 和 ipConfig.vue中进行配置
   //如果是其他项目  ip地址在本文件中配置 BASE_URL 例如 BASE_URL = "http://182.92.126.35:9999";
   // BASE_URL = "http://10.35.116.82:9999";//棋盘井东区
   // BASE_URL = "http://192.168.126.12:9999";//王洼二矿
-  BASE_URL = "http://172.17.3.15:9999"; //黑龙煤矿
+  // BASE_URL = "http://172.17.3.15:9999"; //黑龙煤矿
+  BASE_URL = "http://182.92.126.35:9999";
 }
 let staticDomainURL = BASE_URL + "/sys/common/static";
 const configService = {

pages/history/history.vue

@@ -19,22 +19,6 @@
     <view v-if="!menushow" class="main">
       <view class="u-page">
         <div class="flcard">
-          <div class="btns">
-            <uni-datetime-picker
-              :show="dataShow"
-              mode="datetime"
-              @cancel="dataShow = false"
-              @confirm="selectStartTime"
-              v-model="StartTime"
-            ></uni-datetime-picker>
-            <uni-datetime-picker
-              :show="dataShow1"
-              mode="datetime"
-              @cancel="dataShow1 = false"
-              @confirm="selectEndTime"
-              v-model="EndTime"
-            ></uni-datetime-picker>
-          </div>
           <div class="btns" style="margin-top: 10px">
             <u-button
               type="primary"
@@ -52,10 +36,36 @@
               :text="lable ? lable : '间隔时间'"
               @click="show = true"
             ></u-button>
+          </div>
+          <div class="btns" style="margin-top: 10px">
+            <uni-datetime-picker
+              :show="dataShow"
+              mode="datetime"
+              @cancel="dataShow = false"
+              @confirm="selectStartTime"
+              v-model="StartTime"
+            ></uni-datetime-picker>
+            <uni-datetime-picker
+              :show="dataShow1"
+              mode="datetime"
+              @cancel="dataShow1 = false"
+              @confirm="selectEndTime"
+              v-model="EndTime"
+            ></uni-datetime-picker>
             <u-button
               type="primary"
               text="查询"
               @click="checkHistory"
+              style="
+                width: 100px;
+                background: linear-gradient(
+                  to right,
+                  rgb(53, 135, 254, 0.5),
+                  rgb(8, 179, 254, 0.5),
+                  rgb(53, 135, 254, 0.5)
+                );
+                border-radius: 5px;
+              "
             ></u-button>
           </div>
           <u-picker
@@ -97,14 +107,14 @@
                 </u-col>
               </u-row>
               <u-row gutter="5" customStyle="margin-bottom: 10px">
-                <u-col span="2" style="margin-right: 15rpx">
+                <u-col span="3" style="margin-right: 15rpx">
                   <div v-if="item.netStatus == 0" class="error-tag1">
                     <image
                       src="/static/model/connectFalse.svg"
                       alt=""
                       class="icon-style"
                     />
-                    <span style="float: right">断开</span>
+                    <span style="float: right; margin-right: 5px">断开</span>
                   </div>
                   <div v-else class="success-tag">
                     <image
@@ -112,16 +122,14 @@
                       alt=""
                       class="icon-style"
                     />
-                    <span style="float: right">连接</span>
+                    <span style="float: right; margin-right: 5px">连接</span>
                   </div>
                 </u-col>
-                <u-col span="2"> </u-col>
                 <u-col span="3"> </u-col>
                 <u-col span="5">
-                  <u--text
-                    class="timetext"
-                    :text="item.time || item.ttime"
-                  ></u--text>
+                  <div class="time-bg">
+                    <span class="timetext">{{ item.time || item.ttime }}</span>
+                  </div>
                 </u-col>
               </u-row>
               <view style="display: flex; flex-wrap: wrap">
@@ -148,7 +156,6 @@
                       padding-bottom: 10rpx;
                       display: flex;
                       flex-direction: column;
-                      align-items: center;
                       height: 100%;
                     "
                   >
@@ -160,6 +167,8 @@
                         color: #3787fe;
                         font-size: 30rpx;
                         margin-top: 20rpx;
+                        margin-left: 20rpx;
+                        float: left;
                       "
                     >
                       {{
@@ -177,6 +186,8 @@
                         color: #3787fe;
                         font-size: 30rpx;
                         margin-top: 20rpx;
+                        margin-left: 20rpx;
+                        float: left;
                       "
                     >
                       {{
@@ -192,6 +203,8 @@
                         margin-top: 20rpx;
                         color: #677799;
                         margin-top: 20rpx;
+                        margin-left: 20rpx;
+                        float: left;
                       "
                     >
                       {{ showitem.des }}
@@ -606,6 +619,18 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.time-bg {
+  background-color: #cce6fb;
+  border-radius: 5px;
+  height: 26px;
+  line-height: 25px;
+  text-align: center;
+  float: right;
+}
+.timetext {
+  text-align: center;
+  color: #2591eb;
+}
 .emptyhistory {
   background: url("/static/empty.png") no-repeat;
   background-size: 100% 50%;
@@ -658,17 +683,20 @@ export default {
   margin-bottom: 5rpx;
 }
 .datacard {
-  width: 30%;
+  width: 47%;
   margin: 1%;
   float: left;
-  height: 190rpx;
-  text-align: center;
+  height: 75px;
   background: linear-gradient(
-    to right,
-    rgba(55, 135, 254, 0.08),
-    rgba(4, 184, 255, 0.08),
-    rgba(60, 161, 237, 0.08)
-  );
+      to right,
+      rgba(55, 135, 254, 0.08),
+      rgba(4, 184, 255, 0.08),
+      rgba(60, 161, 237, 0.08)
+    ),
+    url("/static/maxbg.png");
+  background-size: 100% 100%;
+  background-position: center;
+  background-repeat: no-repeat;
 }
 .error-tag {
   border-radius: 10%;
@@ -694,7 +722,7 @@ export default {
 }
 .success-tag {
   border-radius: 10%;
-  color: #42c000;
+  color: #5acc1f;
   line-height: 50rpx;
   font-size: 14px;
   width: 120rpx;

pages/home/detail/autodoor/autodoor.vue

@@ -111,7 +111,7 @@
             :nowfengji="qidongfengji"
           ></fanmainAnimate>
         </div>
-        <div class="flcard" style="" v-if="this.TabCur == 'window'">
+        <div class="flcard" v-if="this.TabCur == 'window'">
           <windowAnimate
             :windowAngle="windowAngle"
             :windowAngle1="windowAngle1"
@@ -152,12 +152,27 @@
                 item.monitorcode != ''
               "
             >
-              <div class="datacard">
-                <div class="left-content">
+              <view class="datacard">
+                <view
+                  style="
+                    padding-top: 10rpx;
+                    padding-bottom: 10rpx;
+                    display: flex;
+                    flex-direction: column;
+                    height: 100%;
+                  "
+                >
                   <view
                     v-if="item.datatype == 1 && item.monitorcode == 'doorUse'"
                     class="demo-layout bg-purple-light"
-                    style="margin-top: 60rpx; color: #3787fe"
+                    style="
+                      color: #3787fe;
+                      font-size: 30rpx;
+                      font-weight: bold;
+                      margin-top: 20rpx;
+                      margin-left: 20rpx;
+                      text-align: left;
+                    "
                   >
                     {{
                       tableData[item.monitorcode] == "2"
@@ -170,7 +185,14 @@
                   <view
                     v-else-if="item.datatype == 1"
                     class="demo-layout bg-purple-light"
-                    style="margin-top: 60rpx; color: #3787fe"
+                    style="
+                      color: #3787fe;
+                      font-size: 30rpx;
+                      font-weight: bold;
+                      margin-top: 20rpx;
+                      margin-left: 20rpx;
+                      text-align: left;
+                    "
                   >
                     {{
                       tableData[item.monitorcode] != undefined &&
@@ -179,11 +201,17 @@
                         : "-"
                     }}
                   </view>
-
                   <view
                     v-else-if="item.datatype == 2"
                     class="demo-layout bg-purple-light"
-                    style="margin-top: 60rpx; color: #3787fe"
+                    style="
+                      color: #3787fe;
+                      font-size: 30rpx;
+                      font-weight: bold;
+                      margin-top: 20rpx;
+                      margin-left: 20rpx;
+                      text-align: left;
+                    "
                   >
                     {{
                       tableData[item.monitorcode] != undefined &&
@@ -192,16 +220,20 @@
                         : "-"
                     }}
                   </view>
-                  <div class="spacer"></div>
-                  <!-- 间距 -->
                   <view
                     class="demo-layout bg-purple-light"
-                    style="color: #677799"
+                    style="
+                      margin-top: 20rpx;
+                      color: #677799;
+                      margin-top: 20rpx;
+                      margin-left: 20rpx;
+                      text-align: left;
+                    "
                   >
                     {{ item.des }}
                   </view>
-                </div>
-              </div>
+                </view>
+              </view>
             </div>
           </div>
           <div class="flex-container" v-else-if="TabCur == 'fanmain'">
@@ -980,7 +1012,7 @@ export default {
 }
 .flcard {
   padding: 20rpx;
-  background-color: #ffffff;
+  background-color: #eef8fe;
   margin-bottom: 5rpx;
 }
 .additional-div {
@@ -1026,24 +1058,30 @@ export default {
   );
 }
 .datacard {
-  display: flex;
-  width: 48%;
-  flex: 1;
+  border-radius: 10rpx;
+  border: rgba(55, 135, 254, 0.28);
+  width: 47%;
   margin: 1%;
   float: left;
-  height: 180rpx;
+  height: 75px;
   text-align: center;
   background: linear-gradient(
-    to right,
-    rgba(55, 135, 254, 0.08),
-    rgba(4, 184, 255, 0.08),
-    rgba(60, 161, 237, 0.08)
-  );
+      to right,
+      rgba(55, 135, 254, 0.08),
+      rgba(4, 184, 255, 0.08),
+      rgba(60, 161, 237, 0.08)
+    ),
+    url("/static/maxbg.png");
+  background-size: 100% 100%;
+  background-position: center;
+  background-repeat: no-repeat;
 }
 .left-content {
-  width: 100%;
+  padding-top: 10rpx;
+  padding-bottom: 10rpx;
   display: flex;
   flex-direction: column;
+  height: 100%;
 }
 .spacer {
   height: 10rpx;

pages/home/detail/doorAnimate/doorAnimate.vue

@@ -31,7 +31,19 @@
         </div>
         <div></div>
       </div>
-      <div style="" v-show="doorcount == 2">
+      <div
+        style="
+          background: linear-gradient(
+            to right,
+            rgba(55, 135, 254, 0.08),
+            rgba(4, 184, 255, 0.08),
+            rgba(60, 161, 237, 0.08)
+          );
+          background-size: 100% 100%;
+          background-repeat: no-repeat;
+        "
+        v-show="doorcount == 2"
+      >
         <div class="door2" v-show="doorcount == 2" :style="{ height: height }">
           <div
             class="left_door"
@@ -445,7 +457,7 @@ div.right_door {
   left: 50%;
   transform: translate(-50%, -50%);
   font-size: 20px;
-  color: #fff;
+  color: #677799;
   z-index: 999;
   text-align: center;
 }

pages/home/home.vue

@@ -12,17 +12,11 @@
               <div>
                 <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">
+                  <u-col span="2" style="margin-right: 20rpx">
                     <div v-if="item.netStatus == 0" class="error-tag1">
                       <image
                         src="/static/model/connectFalse.svg"
@@ -40,7 +34,7 @@
                       <span style="float: right">连接</span>
                     </div>
                   </u-col>
-                  <u-col span="6">
+                  <u-col span="2">
                     <div v-if="item.warnFlag == 0" class="success-tag">
                       <image
                         src="/static/model/alarmTrue.svg"
@@ -63,8 +57,11 @@
                       >
                     </div>
                   </u-col>
-                  <u-col span="3">
-                    <u--text class="timetext" :text="item.readTime"></u--text>
+                  <u-col span="2"></u-col>
+                  <u-col span="5">
+                    <div class="time-bg">
+                      <span class="timetext">{{ item.readTime }}</span>
+                    </div>
                   </u-col>
                 </u-row>
                 <view v-if="TabCur != 'fanmain' && TabCur != 'fanlocal'">
@@ -89,7 +86,6 @@
                           padding-bottom: 10rpx;
                           display: flex;
                           flex-direction: column;
-                          align-items: center;
                           height: 100%;
                         "
                       >
@@ -99,8 +95,10 @@
                           style="
                             margin-top: 10rpx;
                             color: #3787fe;
-                            font-size: 30rpx;
+                            font-weight: bold;
                             margin-top: 20rpx;
+                            margin-left: 20rpx;
+                            text-align: left;
                           "
                         >
                           {{
@@ -121,7 +119,10 @@
                           style="
                             color: #3787fe;
                             font-size: 30rpx;
+                            font-weight: bold;
                             margin-top: 20rpx;
+                            margin-left: 20rpx;
+                            text-align: left;
                           "
                         >
                           {{
@@ -137,6 +138,8 @@
                             margin-top: 20rpx;
                             color: #677799;
                             margin-top: 20rpx;
+                            margin-left: 20rpx;
+                            text-align: left;
                           "
                         >
                           {{ showitem.des }}
@@ -169,17 +172,18 @@
                           padding-bottom: 10rpx;
                           display: flex;
                           flex-direction: column;
-                          align-items: center;
                           height: 100%;
                         "
                       >
                         <view
                           class="demo-layout bg-purple-light"
                           style="
-                            margin-top: 10rpx;
                             color: #3787fe;
                             font-size: 30rpx;
+                            font-weight: bold;
                             margin-top: 20rpx;
+                            margin-left: 20rpx;
+                            text-align: left;
                           "
                         >
                           {{
@@ -251,6 +255,8 @@
                             margin-top: 20rpx;
                             color: #677799;
                             margin-top: 20rpx;
+                            margin-left: 20rpx;
+                            text-align: left;
                           "
                         >
                           {{ showitem.des }}
@@ -280,17 +286,18 @@
                           padding-bottom: 10rpx;
                           display: flex;
                           flex-direction: column;
-                          align-items: center;
                           height: 100%;
                         "
                       >
                         <view
                           class="demo-layout bg-purple-light"
                           style="
-                            margin-top: 10rpx;
                             color: #3787fe;
                             font-size: 30rpx;
+                            font-weight: bold;
                             margin-top: 20rpx;
+                            margin-left: 20rpx;
+                            text-align: left;
                           "
                         >
                           {{
@@ -362,6 +369,8 @@
                             margin-top: 20rpx;
                             color: #677799;
                             margin-top: 20rpx;
+                            margin-left: 20rpx;
+                            text-align: left;
                           "
                         >
                           {{ showitem.des }}
@@ -603,6 +612,14 @@ export default {
 </script>
 
 <style>
+.time-bg {
+  background-color: #cce6fb;
+  border-radius: 5px;
+  height: 26px;
+  line-height: 25px;
+  text-align: center;
+  float: right;
+}
 .empty {
   background: url("/static/empty.png") no-repeat;
   background-size: 100% 50%;
@@ -641,8 +658,9 @@ export default {
 }
 
 .timetext {
-  text-align: right;
-  float: right;
+  text-align: center;
+  color: #2591eb;
+  font-weight: bold;
 }
 
 .itemback {
@@ -671,10 +689,10 @@ export default {
 .datacard {
   border-radius: 10rpx;
   border: rgba(55, 135, 254, 0.28);
-  width: 30%;
+  width: 47%;
   margin: 1%;
   float: left;
-  height: 190rpx;
+  height: 75px;
   text-align: center;
   background: linear-gradient(
     to right,
@@ -682,6 +700,9 @@ export default {
     rgba(4, 184, 255, 0.08),
     rgba(60, 161, 237, 0.08)
   );
+  background-image: url("/static/maxbg.png");
+  background-size: 100% 100%;
+  background-position: center;
 }
 
 .datacard .gate {
@@ -718,7 +739,7 @@ export default {
   line-height: 50rpx;
   font-size: 14px;
   text-align: center;
-  width: 240rpx;
+  width: 120rpx;
   height: 50rpx;
   padding-right: 30rpx;
   background-color: rgba(233, 0, 0, 0.2);
@@ -758,6 +779,6 @@ export default {
   margin-left: 40rpx;
   float: left;
   font-size: 28rpx;
-  font-weight: 400;
+  font-weight: bold;
 }
 </style>

pages/login/login.vue

@@ -1,6 +1,6 @@
   <template>
     <view class="zai-box">
-      <u-icon name="setting-fill" color="#2979ff" size="28" @click="setIp" v-if="configService.apiUrl == ''"></u-icon>
+      <u-icon name="setting-fill" color="#2979ff" size="28" @click="setIp" ></u-icon>
       <scroll-view scroll-y class="page" v-if="!ipShow">
         <view class="text-center" :style="[{ animation: 'show ' + 0.4 + 's 1' }]">
           <image src="/static/desk-img/logo.png" mode='aspectFit' class="zai-logo "></image>
@@ -380,6 +380,7 @@ export default {
     },
     changeloginType() {
       console.log("changeloginType====");
+      console.log(configService, "changeloginType====");
       var tourl = configService.apiUrl;
       tourl = tourl.replace(9999, 8092);
       // this.$tip.success("tourl="+tourl);