From c0c034b3ef0fdf0fd9c802d5984dbd717db6817a Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@smartai.com>
Date: 星期三, 06 九月 2023 17:54:55 +0800
Subject: [PATCH] 定制桌面.

---
 src/pages/vindicate/views/sysInfo.vue |  366 +++++++++++++++++++++++++++++++++------------------
 1 files changed, 234 insertions(+), 132 deletions(-)

diff --git a/src/pages/vindicate/views/sysInfo.vue b/src/pages/vindicate/views/sysInfo.vue
index e8ff060..901b637 100644
--- a/src/pages/vindicate/views/sysInfo.vue
+++ b/src/pages/vindicate/views/sysInfo.vue
@@ -4,195 +4,273 @@
       <div class="sys-right">
         <div class="auto">
           <div class="title-bg">
-            <div class="title">SmartAIOS</div>
-            <div class="desc">Copyright 漏 璐濇�濈鎶�鏈湁闄愬叕鍙�</div>
+            <div class="title">{{ productName }}</div>
+            <div class="desc">{{ copyright }}</div>
           </div>
-          <div class="bar">
+          <div class="bar" style="background-color: #f2f2f7">
             <div class="name">鐗堟湰锛�</div>
-            <div class="desc">{{ verText }}</div>
+            <div class="desc">
+              {{ serializedNumber == "" ? `${productName}璇曠敤鐗坄 : `${productName}姝e紡鐗坄 }}
+            </div>
           </div>
           <div class="bar">
             <div class="name">婵�娲伙細</div>
             <div class="right-zone">
-              <el-button type="primary" size="small" @click="confirmAgain"
+              <el-button type="primary" size="small" @click="confirmAgain" v-if="serializedNumber != ''"
                 >瀵煎嚭浜у搧瀵嗛挜</el-button
               >
-              <div class="desc" style="color: rgba(71, 153, 247, 1)">
-                {{ sn == "" ? "鏈縺娲�" : "宸叉縺娲�" }}
+              <div class="desc activation">
+                {{ serializedNumber == "" ? "鏈縺娲�" : "宸叉縺娲�" }}
               </div>
             </div>
           </div>
           <div class="bar">
-            <div class="name">璇锋眰鐮侊細</div>
-            <div class="desc" style="font-size: 12px">{{ q }}</div>
+            <div class="name" style="min-width: 65px">璇锋眰鐮侊細</div>
+            <div class="desc code" style="font-size: 12px">{{ queryCode }}</div>
           </div>
           <div class="bar">
             <div class="name">浜у搧瀵嗛挜锛�</div>
-            <div class="desc" style="font-size: 12px">{{ authorization }}</div>
+            <div class="desc">
+              {{ authorization || "-" }}
+            </div>
           </div>
           <div class="bar">
             <div class="name">鍒版湡鏃堕棿锛�</div>
-            <div class="desc">{{ expireTime }}</div>
+            <div class="desc" style="font-size: 16px">{{ expireTime }}</div>
           </div>
         </div>
       </div>
     </div>
 
-    <el-dialog title="鍐嶆纭" :visible.sync="dialogVisible">
+    <el-dialog title="鍐嶆纭" :visible.sync="dialogVisible" custom-class="my-confirm">
       <div class="ver">
-        <span class="icon iconfont" style="color: orangered">&#xe6e6;</span>
-        浜у搧瀵嗛挜瀵煎嚭鍚庯紝绯荤粺澶ч儴鍒嗗姛鑳藉皢鏃犳硶浣跨敤锛岃纭鏄惁缁х画锛�
+        <span class="iconfont" style="color: orangered; font-size: 40px; margin-bottom: 10px">&#xe6e6;</span>
+        <span class="ver-text">
+          浜у搧瀵嗛挜瀵煎嚭鍚庯紝绯荤粺澶ч儴鍒嗗姛鑳藉皢鏃犳硶浣跨敤锛岃纭鏄惁缁х画锛�
+        </span>
       </div>
-
       <div class="info">
-        濡傞渶缁х画锛岃杈撳叆绠$悊鍛樺瘑鐮侊紝骞跺鍏ヤ綘鎯宠婵�娲荤殑璁惧璇锋眰鐮侊紝鐒跺悗鐐瑰嚮鈥滅‘璁も�濄��
-        <span style="color: #8f949a; font-size: 14px"
-          >璁惧璇锋眰鐮佽幏鍙栨柟寮忥細濡傜郴缁熷凡婵�娲伙紝鍦ㄦ縺娲婚〉闈㈠鍑哄嵆鍙紱濡傝澶囨湭婵�娲伙紝鍦⊿martAI婵�娲婚〉闈㈡壂鐮佽幏鍙栥��</span
-        >
+        <span class="info-cont">
+          濡傞渶缁х画锛岃杈撳叆绠$悊鍛樺瘑鐮侊紝骞跺鍏ユ偍瑕佹縺娲荤殑璁惧璇锋眰鐮侊紝鐒跺悗鐐瑰嚮鈥滅‘瀹氣�濄��
+        </span>
+        <div style="margin-top: 10px">璁惧璇锋眰鐮佽幏鍙栨柟寮忥細</div>
+        <ul>
+          <li style="list-style: inside">濡傜郴缁熷凡婵�娲伙紝鍦ㄦ縺娲婚〉闈㈠鍑哄嵆鍙紱</li>
+          <li style="list-style: inside">
+            {{ `"濡傝澶囨湭婵�娲伙紝璇峰湪${product_name}婵�娲婚〉闈㈡壂鐮佽幏鍙�"` }}
+          </li>
+        </ul>
+        <!-- <span style="color: #8f949a; font-size: 14px"
+          >銆�</span
+        > -->
       </div>
       <!--  -->
       <div class="pw">
-        <el-input
-          size="small"
-          placeholder="璇疯緭鍏ョ鐞嗗憳瀵嗙爜"
-          v-model="password"
-          style="padding-left: 50px; width: 360px"
-        ></el-input>
+        <el-input size="small" placeholder="璇疯緭鍏ョ鐞嗗憳瀵嗙爜" v-model="password"></el-input>
       </div>
       <div class="validate">
         <form id="myForm">
           <el-input
             type="textarea"
             autosize
-            style="width: 360px"
-            placeholder="灏嗕骇鍝佸瘑閽ョ矘璐村湪姝ゅ"
+            style="width: 460px"
+            placeholder="灏嗕綘鎯宠婵�娲荤殑璁惧璇锋眰鐮佺矘璐村湪姝ゅ"
             v-model="secrectKey"
           >
           </el-input>
         </form>
-
-        <!-- <el-upload
-          class="upload-demo"
-          action
-          :http-request="uploadKey"
-          :limit="1"
-          :show-file-list="false"
-        >
-        </el-upload> -->
-          <el-button size="small" @click="txtbtn" type="primary">瀵煎叆鏂囦欢</el-button>
-        <input type="file" @change="loadTextFromFile" id="txt" style="display:none"/>
+        <el-button size="small" @click="txtbtn" type="primary">瀵煎叆鏂囦欢</el-button>
+        <input type="file" @change="loadTextFromFile" id="txt" style="display: none" />
       </div>
 
       <span slot="footer" class="dialog-footer">
-        <el-button @click="dialogVisible = false">鍙栨秷</el-button>
-        <el-button type="primary" @click="confirmCancel">纭畾</el-button>
+        <div class="btns">
+          <el-button class="cancel" @click="dialogVisible = false">鍙栨秷</el-button>
+          <el-button class="ok" type="primary" @click="confirmCancel">纭畾</el-button>
+        </div>
       </span>
     </el-dialog>
   </div>
 </template>
 
 <script>
-import { getSN, cancelAuthorization } from "@/api/system";
+import { getSN, cancelAuthorization, getVasystemInfo } from "@/api/system"
+
 export default {
   mounted() {
-    getSN().then((res) => {
-      if (res.code == 200) {
-        this.authorization = res.data.authorization;
-        this.expireTime = res.data.expireTime;
-        this.sn = res.data.sn;
-        this.q = res.data.q;
-      }
-    });
+    this.refreshSn()
   },
   data() {
     return {
       authorization: "",
       expireTime: "",
-      sn: "",
+      serializedNumber: "",
       secrectKey: "",
-      q: "",
-      verText: "SmartAIOS姝e紡鐗�",
+      queryCode: "",
       activeState: "宸叉縺娲�",
       password: "",
       dialogVisible: false,
-    };
+      productName: "",
+      copyright: ""
+    }
   },
   methods: {
-    confirmAgain() {
-      // this.$confirm("鎮ㄦ槸鍚︾‘璁ょ珛鍗冲浠芥墍鏈夊簲鐢ㄧ殑閰嶇疆鏁版嵁锛�", "绔嬪嵆澶囦唤", {
-      //   confirmButtonText: "纭畾",
-      //   cancelButtonText: "鍙栨秷",
-      // }).then(() => {
-      //   this.$message({
-      //     type: "success",
-      //     message: "澶囦唤鎴愬姛",
-      //   });
-      // });
-      this.dialogVisible = true;
+    refreshSn() {
+      getSN().then((res) => {
+        if (res.code == 200) {
+          this.authorization = res.data.authorization
+          this.expireTime = res.data.expireTime
+          this.serializedNumber = res.data.sn
+          this.queryCode = res.data.q
+        }
+      })
+
+      getVasystemInfo().then((rsp) => {
+        this.productName = rsp.product_name
+        this.copyright = rsp.copyright
+      })
     },
-     txtbtn() {
-      document.getElementById("txt").click();
+    confirmAgain() {
+      this.dialogVisible = true
+    },
+    txtbtn() {
+      document.getElementById("txt").click()
     },
     loadTextFromFile(e) {
-      const file = e.target.files[0];
-      var reader = new FileReader(); //new涓�涓狥ileReader瀹炰緥
+      const file = e.target.files[0]
+      var reader = new FileReader() //new涓�涓狥ileReader瀹炰緥
       let that = this
-      reader.onload = function () {
-        debugger
+      reader.onload = function() {
         that.secrectKey = this.result.trim()
-        console.log(this.result);
-      };
-      reader.readAsText(file);
+      }
+      reader.readAsText(file)
     },
     confirmCancel() {
-      this.secrectKey = this.secrectKey.trim();
-      this.password = this.password.trim();
+      this.secrectKey = this.secrectKey.trim()
+      this.password = this.password.trim()
       if (this.secrectKey == "" || this.password == "") {
-        this.$message.warning("璇峰厛濉啓瀵嗙爜鍜岃姹傜爜");
-        return;
+        this.$message.warning("璇峰厛濉啓瀵嗙爜鍜岃姹傜爜")
+        return
       }
       cancelAuthorization({
         q: this.secrectKey,
         passwd: this.password,
-        down: 1,
+        down: 1
       }).then((res) => {
-        debugger;
-        let url = window.URL.createObjectURL(
-          new Blob([res], {
-            type: "text/plain",
-          })
-        );
-        let a = document.createElement("a");
-        a.href = url;
-        a.download = "key.txt";
-        a.click();
-        window.URL.revokeObjectURL(url);
-      });
-    },
-  },
-};
+        if (res.type == "application/json") {
+          var reader = new FileReader()
+          reader.readAsText(res, "utf-8")
+          let that = this
+          reader.onload = function() {
+            var receive_data = JSON.parse(this.result) //杩欎釜灏辨槸瑙f瀽鍑烘潵鐨勬暟鎹�
+            that.$notify.error(receive_data.msg)
+          }
+          return
+        }
+        let url = window.URL.createObjectURL(new Blob([res], { type: "text/plain" }))
+        let a = document.createElement("a")
+        a.href = url
+        a.download = "key.txt"
+        a.click()
+        window.URL.revokeObjectURL(url)
+        this.refreshSn()
+        window.parent.postMessage({ msg: "checkSN" }, "*")
+        this.$notify.success("瀵煎嚭鎴愬姛")
+        this.dialogVisible = false
+      })
+    }
+  }
+}
 </script>
 <style lang="scss">
+div {
+  color: #333;
+}
+
 .v-sys-info {
   width: 100%;
+  background-color: #fbfaff;
+  border-top: 4px solid #f2f2f7;
+  border-left: 4px solid #f2f2f7;
+
+  .el-dialog {
+    width: 640px;
+    border-radius: 24px;
+  }
+
   .el-dialog__header {
-    padding: 15px 20px 10px;
-    text-align: left;
-    font-weight: 600;
+    padding: 14px 20px 13px;
+    text-align: center;
+    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.08);
+    .el-dialog__title {
+      font-weight: 600;
+      font-size: 18px;
+      color: #5f5f5f;
+      line-height: 25px;
+    }
   }
   .el-dialog__body {
     text-align: left;
-    padding: 0;
-    padding-bottom: 10px;
+    padding: 30px;
+    .pw {
+      .el-input--small .el-input__inner {
+        height: 32px;
+        line-height: 32px;
+        border-radius: 16px;
+        border-color: #d4d6d9 !important;
+      }
+    }
+  }
+  .el-dialog__footer {
+    padding: 10px 20px 20px;
+    .btns {
+      display: flex;
+      justify-content: right;
+      .cancel {
+        width: 140px;
+        height: 40px;
+        cursor: pointer;
+        border-radius: 20px;
+        line-height: 40px;
+        font-size: 14px;
+        color: var(--colorCard);
+        border-color: var(--colorCard) !important;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+      .ok {
+        width: 140px;
+        height: 40px;
+        cursor: pointer;
+        border-radius: 20px;
+        background-color: var(--colorCard) !important;
+        border-color: var(--colorCard) !important;
+        color: #fff;
+        line-height: 40px;
+        font-size: 14px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+    }
   }
   .el-divider--horizontal {
     margin: 20px 0;
   }
   .validate {
-    padding: 0 50px;
     display: flex;
     align-items: baseline;
     margin-top: 15px;
+    .el-button--small {
+      font-size: 14px;
+      border-radius: 3px;
+      border-radius: 16px;
+      background-color: var(--colorCard) !important;
+      border-color: var(--colorCard) !important;
+      min-width: 120px;
+      padding: 8px 15px;
+    }
   }
   #myForm {
     display: flex;
@@ -202,23 +280,38 @@
       margin: 0 8px;
       width: 60px;
     }
+    .el-textarea__inner {
+      min-height: 32px;
+      height: 32px;
+      border: 1px solid #d4d6d9;
+      box-sizing: border-box;
+      border-radius: 16px;
+    }
   }
   .ver {
-    margin-bottom: 10px;
-    background-color: rgba(242, 242, 242, 1);
-    font-size: 16px;
-    height: 60px;
-    padding-left: 50px;
-    line-height: 60px;
+    margin-bottom: 30px;
+
+    display: flex;
+    flex-direction: column;
+    align-items: center;
     .ver-text {
-      font-weight: 600;
+      font-weight: bold;
+      font-size: 16px;
+      line-height: 22px;
+      color: #5f5f5f;
     }
   }
   .info {
-    padding: 0 50px;
-    font-size: 15px;
     line-height: 25px;
     margin: 15px 0;
+    font-size: 12px;
+    line-height: 21px;
+    color: #666666;
+    .info-cont {
+      font-weight: bold;
+      font-size: 14px;
+      color: #5f5f5f;
+    }
   }
   .qr-code-img {
     width: 100px;
@@ -243,12 +336,9 @@
     overflow: auto;
     box-sizing: border-box;
     position: relative;
-    padding: 20px 40px;
-    .el-form-item.is-required:not(.is-no-asterisk)
-      > .el-form-item__label:before,
-    .el-form-item.is-required:not(.is-no-asterisk)
-      .el-form-item__label-wrap
-      > .el-form-item__label:before {
+    padding: 10px 15px 0 10px;
+    .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label:before,
+    .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap > .el-form-item__label:before {
       display: none;
     }
     .el-select {
@@ -277,28 +367,30 @@
     }
     .auto {
       .title-bg {
-        background-color: #f8f8f8;
-        height: 150px;
-        border-radius: 12px;
-        margin-bottom: 20px;
+        background-color: #fff;
+        height: 110px;
+        border-radius: 8px;
+        margin-bottom: 10px;
         display: flex;
         flex-direction: column;
         justify-content: center;
         .title {
-          font-size: 34px;
-          font-weight: 600;
-          line-height: 50px;
+          font-size: 24px;
+          font-weight: 700;
+          line-height: 33.6px;
         }
         .desc {
-          font-size: 16px;
-          line-height: 30px;
+          margin-top: 10px;
+          font-size: 12px;
+          line-height: 16.8px;
+          font-weight: 700;
         }
       }
       .bar {
         display: flex;
         align-items: center;
-        padding: 12px 25px;
-        background-color: #f8f8f8;
+        padding: 12px 40px;
+        background-color: #fff;
         justify-content: space-between;
         border-radius: 12px;
         margin-bottom: 10px;
@@ -307,21 +399,31 @@
           align-items: center;
         }
         .name {
-          font-size: 15px;
+          font-size: 16px;
+          font-weight: 700;
           text-align: left;
           min-width: 180px;
         }
         .desc {
-          font-size: 15px;
-          margin-left: 20px;
-          max-width: 600px;
-          /* overflow: hidden; */
-          /* text-overflow: ellipsis; */
-          /* white-space: nowrap; */
+          font-size: 16px;
+          font-weight: 700;
+          margin-left: 30px;
+          max-width: 568px;
           line-height: normal;
           word-wrap: break-word;
           text-align: left;
         }
+        .activation {
+          width: 90px;
+          height: 28px;
+          background: rgba(78, 148, 255, 0.1);
+          border: 1px solid #4e94ff;
+          border-radius: 20px;
+          text-align: center;
+          line-height: 28px;
+          color: #333;
+          font-size: 14px;
+        }
         .el-input {
           width: 100%;
           .el-input {

--
Gitblit v1.8.0