Browse Source

fix: 详情页面

chenzhen2 2 years ago
parent
commit
6461c84f65

+ 9 - 1
src/apis/envmonitor.ts

@@ -218,9 +218,17 @@ export const queryWorkSpace = (params: any) => {
 /**
  * 查询客户列表
  */
-export const queryCustomerservice = (params:any) => {
+export const queryCustomerservice = (params: any) => {
   return https().request<RootObject<any>>(`${weachatService}/wechat-service-duoduoenv/duoduoenv/customerservice/query?${comParams}`, Method.POST, params, ContentType.json)
 }
 
 
+/**
+ * 获取二维码状态
+ */
+export const getPadQrCodeStatus = (params: any) => {
+  return https().request<any>(`${testApi}padLogin/getPadQrCodeStatus?${params}`, Method.GET, undefined, ContentType.json)
+}
+
+
 

+ 2 - 2
src/store/modules/user/actions.ts

@@ -68,7 +68,7 @@ export const actions: ActionTree<UserState, RootState> & Actions = {
     // commit(UserMutationTypes.SET_ROLES, [])
   },
   async [UserActionTypes.ACTION_GET_USER_INFO]({ commit }: AugmentedActionContext) {
-    let nowProjectId: any = 'Pj1101080259'
+    // let nowProjectId: any = 'Pj1101080259'
     const userInfo: any = {
       userName: '陈珍',
       userPhone: 15321277745,
@@ -82,7 +82,7 @@ export const actions: ActionTree<UserState, RootState> & Actions = {
     commit(UserMutationTypes.SET_USER_ID, userInfo.userId)
     let macAdr: any = getCookieMac()
     commit(UserMutationTypes.SET_USER_MAC, macAdr)
-    store.commit(UserMutationTypes.SET_PROJECT_ID, nowProjectId)
+    // store.commit(UserMutationTypes.SET_PROJECT_ID, nowProjectId)
   },
   async [UserActionTypes.ACTION_CHANGE_ROLES](
     { commit }: AugmentedActionContext,

+ 3 - 1
src/store/modules/user/mutations.ts

@@ -3,6 +3,7 @@ import { UserState } from './state'
 import { UserMutationTypes } from './mutation-types'
 import Cookies from 'js-cookie'
 import Keys from '@/constant/key'
+import { setProjectId } from '@/utils/cookies'
 
 export type Mutations<S = UserState> = {
   [UserMutationTypes.SET_TOKEN](state: S, token: string): void
@@ -35,7 +36,8 @@ export const mutations: MutationTree<UserState> & Mutations = {
   },
   [UserMutationTypes.SET_PROJECT_ID](state: UserState, projectId: string) {
     state.projectId = projectId
-    Cookies.set(Keys.projectId, projectId)
+    // Cookies.set(Keys.projectId, projectId)
+    setProjectId(projectId)
   },
   [UserMutationTypes.SET_COMPANY_ID](state: UserState, companyId: string) {
     state.companyId = companyId

+ 2 - 2
src/store/modules/user/state.ts

@@ -7,7 +7,7 @@ export interface UserState {
   userName: string
   userId: string
   userPhone: number
-  projectId: string,
+  projectId: any,
   companyId: string,
   mac: any,
   remoteControl: boolean  // 当前用户是否可以远程控制设备
@@ -19,7 +19,7 @@ export const state: UserState = {
   userName: getSessionUserInfo() ? getSessionUserInfo().name : '',
   userId: getSessionUserInfo() ? getSessionUserInfo().id : '',
   userPhone: getSessionUserInfo() ? getSessionUserInfo().phone : 0,
-  projectId: getSessionUserInfo() ? getSessionUserInfo().projectId : getProjectId() || '',
+  projectId: getProjectId()?getProjectId():'',
   companyId: '',
   mac: getCookieMac() ? getCookieMac() : '',
   remoteControl: false

+ 1 - 0
src/styles/_variables.scss

@@ -25,6 +25,7 @@ $darkGray: #889aa4;
 $loginBg: #2d3a4b;
 $loginCursorColor: #fff;
 $elActiveColor: #CE9F27;
+$elCircle: rgba(226, 208, 160, 1);
 $elBg: #F5F5F5;
 $elActive4: rgba(206, 159, 39, 0.4);
 $elActiveText: #fff;

+ 3 - 2
src/utils/cookies.ts

@@ -6,11 +6,12 @@ export const setLanguage = (language: string) => Cookies.set(Keys.languageKey, l
 export const setSize = (size: string) => Cookies.set(Keys.sizeKey, size)
 export const getToken = () => Cookies.get(Keys.tokenKey)
 export const getProjectId = () => Cookies.get(Keys.projectId)
+export const setProjectId = (projectId: string) => Cookies.set(Keys.projectId, projectId)
 export const setToken = (token: string) => Cookies.set(Keys.tokenKey, token)
 export const removeToken = () => Cookies.remove(Keys.tokenKey)
 export const setCookieUserInfo = (userInfo: any) => Cookies.set(Keys.userInfoKey, userInfo)
-export const setCookieMac = (mac: any)=>Cookies.set(Keys.macKey, mac)
-export const getCookieMac=()=>{
+export const setCookieMac = (mac: any) => Cookies.set(Keys.macKey, mac)
+export const getCookieMac = () => {
   return Cookies.get(Keys.macKey)
 }
 export const getCookieUserInfo = () => {

+ 2 - 1
src/views/choiceSpace/choiceSpace.vue

@@ -75,7 +75,7 @@
 import { defineComponent, nextTick, onMounted, reactive, toRefs } from "vue";
 import { useRoute, useRouter, onBeforeRouteUpdate } from "vue-router";
 import { Search, TreeSelect, Popup, Checkbox, Toast } from "vant";
-import { getUserInfo, parseImgUrl, setQueryConfig } from "@/utils";
+import { getUserInfo, parseImgUrl, setLocalProjectId, setQueryConfig } from "@/utils";
 import { store } from "@/store";
 import { UserMutationTypes } from "@/store/modules/user/mutation-types";
 import {
@@ -175,6 +175,7 @@ export default defineComponent({
       // 设置建筑id
       setProjectId() {
         let nowProjectId: any = route.query.id;
+        // setLocalProjectId(nowProjectId)
         store.commit(UserMutationTypes.SET_PROJECT_ID, nowProjectId);
       },
       buildingData: buildingData,

+ 1 - 0
src/views/envmonitor/components/Map/MapBox.vue

@@ -1028,6 +1028,7 @@ export default defineComponent({
                   proxyData.selectArea = area;
                 }
               }
+              // debugger
               // 当没有默认空间的时候设置常驻空间页面不可高量
               if (proxyData.isSetSpace && !props.spaceInfo.isPermanent) {
                 proxyData.selectArea = {};

+ 111 - 53
src/views/envmonitor/detail.vue

@@ -5,9 +5,14 @@
       <van-tab
         :title="item.name"
         :name="item.funcid"
-        :key="item.id"
+        :key="item.id + '' + index"
         v-for="(item, index) in titleList"
       >
+        <div class="container-text" v-if="item.options">
+          <span>{{
+            item.funcid == "Tdb,RH" ? "温湿度逐时分布" : "浓度逐时分布"
+          }}</span>
+        </div>
         <div class="chart-box">
           <com-chart
             :options="item.options"
@@ -26,19 +31,15 @@
               <span>该空间数据未配置</span>
             </template>
           </div>
-          <div class="container-text" v-if="item.options">
-            <span>{{
-              item.funcid == "Tdb,RH" ? "温湿度逐时分布" : "浓度逐时分布"
-            }}</span>
-          </div>
         </div>
         <div class="detail-desc clearfix">
-          <div class="detail-title">
+          <!-- <div class="detail-title">
             {{ item.name }}
-          </div>
+          </div> -->
           <div class="detail-text">
-            <p v-for="(textItem, idx) in item.text">
-              <van-icon class="icon" name="success" v-if="idx % 2 == 0" />
+            <p v-for="(textItem, idx) in item.text" :key="idx">
+              <!-- <van-icon class="icon" name="success" v-if="idx % 2 == 0" /> -->
+              <span class="circle"></span>
               <span class="tem-span">
                 {{ textItem }}
               </span>
@@ -218,6 +219,7 @@ export default defineComponent({
        * @param funcid
        */
       getData(funcid: string = "") {
+        // debugger
         let paramObj = {
           spaceId: proxyData.query.spaceId,
           funcid: funcid,
@@ -317,7 +319,7 @@ export default defineComponent({
         let { chartData, chartMax } = await proxyData.getData(funcid);
         proxyData.loadinngEnd();
         let seriesData: any = chartData.map((item: any) => {
-          return item.sales
+          return item.sales;
         });
         let xData: any = chartData.map((item: any) => {
           return item.time;
@@ -329,10 +331,10 @@ export default defineComponent({
                 trigger: "axis",
               },
               grid: {
-                top: 30,
-                left: 22,
-                right: 25,
-                bottom: 50,
+                top: 20,
+                left: 5,
+                right: 20,
+                bottom: 20,
                 containLabel: true,
               },
               xAxis: [
@@ -345,7 +347,9 @@ export default defineComponent({
                     },
                   },
                   axisLabel: {
-                    fontSize: 14,
+                    fontSize: 12,
+                    interval: 8,
+                    showMaxLabel: true,
                     color: "#C4C4C4",
                   },
                   data: xData,
@@ -364,7 +368,7 @@ export default defineComponent({
                     },
                   },
                   axisLabel: {
-                    fontSize: 14,
+                    fontSize: 12,
                     color: "#C4C4C4",
                   },
                   splitLine: {
@@ -412,26 +416,59 @@ export default defineComponent({
                   showSymbol: false,
                   lineStyle: {
                     width: 2,
+                    color: new (echarts as any).graphic.LinearGradient(
+                      1,
+                      0,
+                      0,
+                      0,
+                      [
+                        {
+                          offset: 0,
+                          color: "rgba(229, 87, 79, 1)",
+                        },
+                        {
+                          offset: 0.5,
+                          color: "rgba(229, 87, 79, 1)",
+                        },
+                        {
+                          offset: 0.6,
+                          color: "rgba(79, 128, 255, 1)",
+                        },
+                        {
+                          offset: 1,
+                          color: "rgba(79, 128, 255, 1)",
+                        },
+                      ],
+                      false
+                    ),
                   },
                   areaStyle: {
                     color: new (echarts as any).graphic.LinearGradient(
                       0,
                       0,
-                      0,
                       1,
+                      0,
                       [
                         {
                           offset: 0,
-                          color: "rgba(79, 128, 255, 0.165)",
+                          color: "rgba(79, 128, 255, 0.1)",
+                        },
+                        {
+                          offset: 0.5,
+                          color: "rgba(79, 128, 255, 0.3)",
+                        },
+                        {
+                          offset: 0.6,
+                          color: "rgba(229, 87, 79, 0.1)",
                         },
                         {
-                          offset: 0.8,
-                          color: "rgba(79, 128, 255, 0)",
+                          offset: 1,
+                          color: "rgba(229, 87, 79, 0.3)",
                         },
                       ],
                       false
                     ),
-                    shadowColor: "rgba(79, 128, 255,0.1)",
+                    shadowColor: "rgba(79, 128, 255, 0.1)",
                     shadowBlur: 10,
                   },
                   itemStyle: {
@@ -455,6 +492,7 @@ export default defineComponent({
         }
       },
       async formatTowOptions(funcid: any) {
+        // debugger
         proxyData.activeItem.options = null;
         let funcidArr = funcid.split(",");
         let chartData1: any = await proxyData.getData(funcidArr[0]);
@@ -487,9 +525,9 @@ export default defineComponent({
           },
           grid: {
             top: 50,
-            left: 22,
-            right: 25,
-            bottom: 50,
+            left: 5,
+            right: 15,
+            bottom: 20,
             containLabel: true,
           },
           xAxis: [
@@ -502,7 +540,9 @@ export default defineComponent({
                 },
               },
               axisLabel: {
-                fontSize: 14,
+                fontSize: 12,
+                interval: 8,
+                showMaxLabel: true,
                 color: "#C4C4C4",
               },
               data: xData,
@@ -521,7 +561,7 @@ export default defineComponent({
                 },
               },
               axisLabel: {
-                fontSize: 14,
+                fontSize: 12,
                 color: "#C4C4C4",
               },
               splitLine: {
@@ -544,7 +584,7 @@ export default defineComponent({
                 },
               },
               axisLabel: {
-                fontSize: 14,
+                fontSize: 12,
                 color: "#C4C4C4",
               },
               splitLine: {
@@ -690,13 +730,13 @@ export default defineComponent({
       }
     );
     onMounted(() => {
-      const route: any = useRoute();
-      if (route.query) {
-        proxyData.query = route.query;
-        // 设置当前选中的tab
-        proxyData.setActiveItem();
-        proxyData.queryAllData();
-      }
+      // const route: any = useRoute();
+      // if (route.query) {
+      //   proxyData.query = route.query;
+      //   // 设置当前选中的tab
+      //   proxyData.setActiveItem();
+      //   proxyData.queryAllData();
+      // }
     });
     return {
       ...toRefs(proxyData),
@@ -720,28 +760,28 @@ export default defineComponent({
   }
 }
 
+.container-text {
+  font-family: PingFang SC;
+  padding-top: 17px;
+  background: #fff;
+  font-weight: 500;
+  font-size: 16px;
+  line-height: 22px;
+  text-align: center;
+  color: #000000;
+  text-align: center;
+}
 .chart-box {
   width: 100%;
   height: 277px;
-  padding-top: 40px;
+  padding-top: 20px;
   background: #fff;
-
-  .container-text {
-    background: #fff;
-    margin-top: -30px;
-    text-align: center;
-    font-family: PingFang SC;
-    font-size: 12px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: 12px;
-    color: #c4c4c4;
-  }
 }
 
 .detail-desc {
-  padding: 0 15px;
-  margin-top: 35px;
+  // padding: 0 15px;
+  margin-top: 20px;
+  padding-left: 15px;
   display: flex;
 
   .detail-title {
@@ -769,6 +809,8 @@ export default defineComponent({
 
     p {
       position: relative;
+      margin-bottom: 10px;
+      // padding-bottom: 10px;
     }
 
     .icon {
@@ -780,12 +822,27 @@ export default defineComponent({
       font-size: 12px;
     }
 
+    .circle {
+      display: inline-block;
+      vertical-align: middle;
+      position: absolute;
+      left: 0;
+      top: 50%;
+      transform: translateY(-50%);
+      width: 6px;
+      height: 6px;
+      border-radius: 50%;
+      background: $elCircle;
+    }
     .tem-span {
-      display: block;
+      display: inline-block;
       vertical-align: middle;
       padding-bottom: 5px;
-      font-size: 14px;
-      line-height: 25px;
+      font-style: normal;
+      font-weight: 400;
+      font-size: 13px;
+      line-height: 20px;
+      color: #646c73;
       padding-left: 15px;
     }
   }
@@ -793,6 +850,7 @@ export default defineComponent({
 
 .detail-bottom {
   padding: 0 15px;
+  padding-bottom: 30px;
   padding-top: 40px;
   width: 100%;
   font-weight: 500;

+ 11 - 3
src/views/envmonitor/index.vue

@@ -2,7 +2,12 @@
   <div class="main">
     <div class="main-left">
       <div class="left-top">
-        <img :src="parseImgUrl('ipdImages', 'shanggeyun_logo.svg')" />
+        <img
+          v-show="outWeather.imgname"
+          :src="outWeather.imgname"
+          class="weather-icon"
+          alt=""
+        />
         <div class="left-time">
           <span>2022.06.01 </span>
           <span>10:10周一</span>
@@ -207,7 +212,10 @@
       ></com-map>
     </van-popup>
     <!--联系方式-->
-    <contact :isShowContact="isShowContact" @closeDailog="closeContactDailog"></contact>
+    <contact
+      :isShowContact="isShowContact"
+      @closeDailog="closeContactDailog"
+    ></contact>
   </div>
 </template>
 
@@ -1628,7 +1636,7 @@ export default defineComponent({
         proxyData.spaceInfo = item;
         proxyData.init();
         if (type === 1) {
-          proxyData.isShowMap = false;
+          // proxyData.isShowMap = false;
           proxyData.elChangeExForArray(item);
         }
         item.active = true;

+ 88 - 6
src/views/home/index.vue

@@ -12,11 +12,16 @@
         <div class="box" v-if="type === 1">
           <div class="qrcode-main">
             <qrcode-vue
-              :value="value"
+              :value="codeValue"
               class="qrcode"
               foreground="#CE9F27"
               level="H"
             />
+            <div class="qrcode-model" v-if="codeStatus.status">
+              <span v-if="codeStatus.status === 1">已扫描</span>
+              <span v-if="codeStatus.status === 2">已确认</span>
+              <span v-if="codeStatus.status === 3">已失效</span>
+            </div>
           </div>
           <div class="qrcode-text">
             请使用朵朵小程序,扫描上面二维码进行授权登录
@@ -61,12 +66,21 @@ import {
 } from "vue";
 import QrcodeVue from "qrcode.vue";
 import { useRouter } from "vue-router";
-import { newNumber, parseImgUrl } from "@/utils";
+import {
+  getUserInfo,
+  newNumber,
+  parseImgUrl,
+  setLocalProjectId,
+  setQueryConfig,
+} from "@/utils";
 import { UserActionTypes } from "@/store/modules/user/action-types";
 import { useStore } from "@/store";
 import { login } from "@/apis/user";
 import { Form, Field, CellGroup, Button, Toast } from "vant";
 import { setToken } from "@/utils/cookies";
+import { getPadQrCodeStatus } from "@/apis/envmonitor";
+import { getUrlParams } from "@/utils/https";
+import { UserMutationTypes } from "@/store/modules/user/mutation-types";
 
 export default defineComponent({
   components: {
@@ -78,12 +92,16 @@ export default defineComponent({
   },
   setup(props) {
     let router: any = useRouter();
+    const userInfo: any = getUserInfo();
     const store = useStore();
+    const codeStatus: any = {};
+    const timer: any = null;
     const proxyData = reactive({
       parseImgUrl: parseImgUrl,
-      value: "https://example.com",
+      codeValue: "http://192.168.17.121:9999/borui/home",
       size: 134,
-      type: 2, // 1:二维码登录 2:用户密码登录
+      type: 1, // 1:二维码登录 2:用户密码登录
+      userInfo: userInfo,
       checkLoginType() {
         if (proxyData.type === 1) {
           proxyData.type = 2;
@@ -110,11 +128,58 @@ export default defineComponent({
        * 获取mac地址
        */
       getQrcode() {
-        const id: any = newNumber(0, 100000, "test");
+        let mac: any = proxyData.userInfo.mac;
+        const id: any = newNumber(0, 100000, mac);
+        return id;
+      },
+      qrCodeId: "",
+      setCodeUrl() {
+        let mac: any = proxyData.userInfo.mac;
+        let qrCodeId: any = proxyData.getQrcode();
+        proxyData.qrCodeId = qrCodeId;
+        proxyData.codeValue = `${proxyData.codeValue}?type=ipad&id=${qrCodeId}&mac=${mac}`;
+      },
+      /**
+       *
+       *获取二维码状态
+       */
+      codeStatus: codeStatus,
+      timer: timer,
+      getPadQrCodeStatus() {
+        let params: any = setQueryConfig({ qrCodeId: proxyData.qrCodeId });
+        getPadQrCodeStatus(params).then((res) => {
+          let resData: any = res;
+          proxyData.codeStatus = resData?.data ?? {};
+          if (proxyData.codeStatus.status === 2) {
+            // debugger
+            let projectId: any = proxyData.codeStatus.projectId;
+            let spaceId: any = proxyData.codeStatus.spaceId;
+            if (projectId && spaceId) {
+              // 直接去环境条件页面
+              // setLocalProjectId(projectId)
+              store.commit(UserMutationTypes.SET_PROJECT_ID, projectId);
+              router.push({ name: "envmonitor", query: { spaceId: spaceId } });
+            } else if (projectId) {
+              // 去选择项目页面
+              store.commit(UserMutationTypes.SET_PROJECT_ID, projectId);
+              router.push({ name: "choiceSpace", query: { id: projectId } });
+            }
+          } else {
+            if (proxyData.timer) {
+              clearTimeout(proxyData.timer);
+              proxyData.timer = null;
+            }
+            proxyData.timer = setTimeout(() => {
+              proxyData.getPadQrCodeStatus()
+            }, 500);
+          }
+        });
       },
     });
     onMounted(() => {
-      
+      // 设置二维码路径
+      proxyData.setCodeUrl();
+      proxyData.getPadQrCodeStatus();
     });
     return {
       ...toRefs(proxyData),
@@ -194,6 +259,7 @@ export default defineComponent({
         left: 80px;
       }
       .qrcode-main {
+        position: relative;
         margin: 0 auto;
         width: 164px;
         height: 160px;
@@ -205,6 +271,22 @@ export default defineComponent({
           height: 100% !important;
         }
       }
+      .qrcode-model {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        top: 0;
+        width: 164px;
+        height: 160px;
+        background: rgba(0, 0, 0, 0.3);
+        span {
+          display: block;
+          line-height: 160px;
+          text-align: center;
+          font-size: 12px;
+          color: #4d5262;
+        }
+      }
       .qrcode-text {
         padding-top: 25px;
         font-family: "Noto Sans SC";