From c0c79d9b58705a3c8c13ea9f23b1dd0f724a04af Mon Sep 17 00:00:00 2001
From: hanbaoshan <hanbaoshan@aiotlink.com>
Date: 星期一, 19 十月 2020 19:14:52 +0800
Subject: [PATCH] 搜索集群节点样式更新

---
 src/pages/ai/index/App.vue |  958 ++++++++++++++++++++++++++++++++++++++++++++++-------------
 1 files changed, 736 insertions(+), 222 deletions(-)

diff --git a/src/pages/ai/index/App.vue b/src/pages/ai/index/App.vue
index c01d1f3..aa0dbb2 100644
--- a/src/pages/ai/index/App.vue
+++ b/src/pages/ai/index/App.vue
@@ -8,7 +8,7 @@
           </div>
         </div>
         <!-- 瓒呯骇绠$悊鍛樺彲瑙� -->
-        <div class="super" v-if="isSuperUser">
+        <div class="super">
           <div class="left-box">
             <!-- <div class="title">
           <label>绠楁硶搴�</label>
@@ -23,18 +23,35 @@
                 <div class="width-new-line task-list" v-show="activeName === 'myAlgorithm'">
                   <p class="src-title">绠楁硶杞欢</p>
                   <div class="flex-list">
-                    <div class="wrap-box" v-for="item in ungradeList" :key="item.id">
+                    <div class="wrap-box" v-for="item in ungradeList" :key="'upgrade'+item.id">
                       <div class="list-choose-item-left">
-                        <div class="mask">
-                          <el-button type="primary" class="bot-btn" @click="donwload(item)">鍗囩骇</el-button>
-                        </div>
-
                         <div class="list-complete-item-handle">
-                          <div class="svg-wrap">
-                            <!-- <svg class="icon" aria-hidden="true" style="font-size:7rem;">
-                              <use :xlink:href="`#${item.icon}`" />
-                            </svg> -->
-                            <img class="baseImg" :src="`data:image/png;base64,${item.iconBlob}`" alt="">
+                          <div class="svg-wrap" :class="{willUpGrade:item.isUpgrade}">
+                            <i class="iconfont iconupdate" v-if="item.isUpgrade"></i>
+                            <div class="mask">
+                              <div class="info-onmask">
+                                <div>褰撳墠鐗堟湰:{{item.version}}</div>
+                                <div>鏈�鏂扮増鏈�:{{item.remoteVersion}}</div>
+                              </div>
+                              <div class="mask-btn">
+                                <el-button
+                                  type="warning"
+                                  class="bot-btn"
+                                  size="small"
+                                  @click="donwload(item)"
+                                >鍗囩骇</el-button>
+                              </div>
+                            </div>
+
+                            <!-- <div class="list-complete-item-handle"> -->
+                            <!-- <div class="svg-wrap" :class="{willUpGrade:item.isUpgrade}"> -->
+                            <img
+                              v-if="item.iconBlob"
+                              class="baseImg"
+                              :src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"
+                              alt
+                            />
+                            <img v-else class="baseImg" :src="item.icon" alt />
                           </div>
                           <div class="alg-name">
                             <div style="padding:0px 10px 0px 10px;">
@@ -46,24 +63,20 @@
                     </div>
                     <div class="wrap-box" v-for="(item) in installedList" :key="item.id">
                       <div class="list-choose-item-left">
-                        <div class="mask" v-if="!item.isEdit">
-                          <el-button
-                            @click="commandAlgLib(item)"
-                            type="primary"
-                            class="bot-btn"
-                          >缂栬緫鍚嶇О</el-button>
-                        </div>
                         <div class="list-complete-item-handle">
-                          <!-- <span :class="`iconfont ${item.icon}`" style="font-size:3rem;"></span> -->
                           <div class="svg-wrap">
-                            <!-- <svg class="icon" aria-hidden="true" style="font-size:7rem;">
-                              <use :xlink:href="`#${item.icon}`" />
-                            </svg>-->
+                            <div class="mask flex-center" v-if="!item.isEdit">
+                              <div class="info-onmask">
+                                <div>褰撳墠鐗堟湰:{{item.version}}</div>
+                              </div>
+                            </div>
                             <img
+                              v-if="item.iconBlob"
                               class="baseImg"
-                              :src="`data:image/png;base64,${item.iconBlob}`"
+                              :src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"
                               alt
                             />
+                            <img v-else class="baseImg" :src="item.icon" alt />
                           </div>
                           <div class="alg-name">
                             <div style="padding:0px 10px 0px 10px;">
@@ -95,12 +108,14 @@
                           <span class="iconfont iconxiazai1"></span>
                         </div>
                         <div class="list-complete-item-handle">
-                          <!-- <span :class="`iconfont ${item.icon}`" style="font-size:3rem;"></span> -->
                           <div class="svg-wrap">
-                            <!-- <svg class="icon" aria-hidden="true" style="font-size:7rem;">
-                              <use :xlink:href="`#${item.icon}`" />
-                            </svg> -->
-                            <img class="baseImg" :src="`data:image/png;base64,${item.iconBlob}`" alt="">
+                            <img
+                              v-if="item.iconBlob"
+                              class="baseImg"
+                              :src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"
+                              alt
+                            />
+                            <img v-else class="baseImg" :src="item.icon" alt />
                           </div>
                           <div class="alg-name">
                             <div style="padding:0px 10px 0px 10px;">
@@ -112,13 +127,112 @@
                     </div>
                   </div>
                   <p class="src-title">搴旂敤杞欢</p>
+                  <div class="flex-list">
+                    <div class="wrap-box" v-for="(item) in installedApps" :key="item.id">
+                      <div class="list-choose-item-left">
+                        <div class="list-complete-item-handle">
+                          <div
+                            class="svg-wrap"
+                            :class="{willUpGrade:item.isUpgrade}"
+                            v-loading="item.unloadLoading||item.upgradeLoading"
+                            :element-loading-text="item.unloadLoading?'鍗歌浇涓�':'鍗囩骇涓�'"
+                            element-loading-background="rgba(0,0,0,.8)"
+                          >
+                            <i class="iconfont iconupdate" v-if="item.isUpgrade"></i>
+                            <div class="mask" v-if="!item.isDefault || item.isUpgrade">
+                              <div class="info-onmask">
+                                <div>褰撳墠鐗堟湰:{{item.version}}</div>
+                                <div v-if="item.remoteVersion">鏈�鏂扮増鏈�:{{item.remoteVersion}}</div>
+                              </div>
+                              <div class="mask-btn">
+                                <el-button
+                                  v-if="!item.isDefault"
+                                  @click="unLoad(item)"
+                                  type="primary"
+                                  size="small"
+                                  class="bot-btn"
+                                >鍗歌浇</el-button>
+                                <el-button
+                                  v-if="item.isUpgrade"
+                                  @click="downloadApp(item,'upgrade')"
+                                  type="warning"
+                                  size="small"
+                                  class="bot-btn"
+                                >鍗囩骇</el-button>
+                              </div>
+                            </div>
+                            <img
+                              v-if="item.iconBlob"
+                              class="baseImg"
+                              :src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"
+                              alt
+                            />
+                            <img v-else class="baseImg" :src="item.icon" alt />
+                          </div>
+                          <div class="alg-name">
+                            <div style="padding:0px 10px 0px 10px;">
+                              <span v-if="!item.isEdit">{{ item.name }}</span>
+                              <el-input
+                                size="small"
+                                v-model="item.sdk_name"
+                                v-if="item.isEdit"
+                                v-focus
+                                :maxlength="15"
+                                @blur="inputBlur(item)"
+                              ></el-input>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="wrap-box" v-for="item in storeApps" :key="item.id">
+                      <div class="list-choose-item-left">
+                        <div class="list-complete-item-handle uninstall">
+                          <div
+                            class="svg-wrap"
+                            v-loading="item.installLoading||item.upgradeLoading"
+                            :element-loading-text="item.installLoading?'瀹夎涓�':'鍗囩骇涓�'"
+                            element-loading-background="rgba(0,0,0,.8)"
+                          >
+                            <div class="mask">
+                              <el-button
+                                type="primary"
+                                class="bot-btn"
+                                @click="downloadApp(item)"
+                              >瀹夎</el-button>
+                            </div>
+                            <img
+                              v-if="item.iconBlob"
+                              class="baseImg"
+                              :src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"
+                              alt
+                            />
+                            <img v-else class="baseImg" :src="item.icon" alt />
+                          </div>
+                          <div class="alg-name">
+                            <div style="padding:0px 10px 0px 10px;">
+                              <span v-if="!item.isEdit">{{ item.name }}</span>
+                              <el-input
+                                size="small"
+                                v-model="item.name"
+                                v-if="item.isEdit"
+                                v-focus
+                                :maxlength="15"
+                                @blur="inputBlur(item)"
+                              ></el-input>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
                 </div>
               </el-tab-pane>
 
               <el-tab-pane
                 label="绂荤嚎鍗囩骇/瀹夎"
                 name="upgradeOrInstallation"
-                v-show="activeName==='upgradeOrInstallation'"
+                v-if="isShow('algorithmManage:insOffLine')"
               >
                 <div class="tab-content">
                   <div class="action-bar">
@@ -134,28 +248,82 @@
                   </div>
                 </div>
               </el-tab-pane>
-              <el-tab-pane label="搴旂敤涓績" name="algorithmMall" v-show="activeName==='algorithmMall'">
+              <el-tab-pane label="搴旂敤涓績" name="algorithmMall" v-if=" isShow('algorithmManage:buy')">
                 <div class="tab-content">
                   <p class="src-title">绠楁硶杞欢</p>
-                  <div class="store-list">
-                    <div class="wrap-box">
-                      <div class="inner">
-                        <div class="mask" @click="actDrawerShow=true">
-                          <svg class="icon" aria-hidden="true" style="font-size:2rem;">
-                            <use xlink:href="#iconyunxiazai" />
-                          </svg>
+                  <div class="store-list flex-list">
+                    <div class="wrap-box" v-for="item in unActivedSDKList" :key="item.id">
+                      <div class="list-choose-item-left">
+                        <div class="list-complete-item-handle">
+                          <div class="alg-icon svg-wrap">
+                            <div class="mask" @click="actSdkOrApp(item.id)">
+                              <span
+                                class="iconfont iconyunxiazai"
+                                style="color:#ff6a00;font-size:20px;position:absolute;top:45%;left:45%"
+                              ></span>
+                            </div>
+                            <img
+                              v-if="item.iconBlob"
+                              class="baseImg"
+                              :src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"
+                              alt
+                            />
+                            <img v-else class="baseImg" :src="item.icon" alt />
+                          </div>
+                          <div class="alg-name">
+                            <div style="padding:0px 10px 0px 10px;">
+                              <span v-if="!item.isEdit">{{ item.sdk_name }}</span>
+                              <el-input
+                                size="small"
+                                v-model="item.sdk_name"
+                                v-if="item.isEdit"
+                                v-focus
+                                :maxlength="15"
+                                @blur="inputBlur(item)"
+                              ></el-input>
+                            </div>
+                          </div>
                         </div>
-                        <div class="alg-icon">
-                          <svg class="icon" aria-hidden="true" style="font-size:7rem;">
-                            <use xlink:href="#iconrenyuanyidong" />
-                          </svg>
-                        </div>
-                        <div class="alg-name">name</div>
                       </div>
                     </div>
                   </div>
                   <p class="src-title">搴旂敤杞欢</p>
-                  <div class="app-list"></div>
+                  <div class="app-list flex-list">
+                    <div class="wrap-box" v-for="item in unActivedAppList" :key="item.id">
+                      <div class="list-choose-item-left">
+                        <div class="list-complete-item-handle">
+                          <div class="alg-icon svg-wrap">
+                            <div class="mask" @click="actSdkOrApp(item.id,'app')">
+                              <span
+                                class="iconfont iconyunxiazai"
+                                style="color:#ff6a00;font-size:20px;position:absolute;top:45%;left:45%"
+                              ></span>
+                            </div>
+                            <img
+                              v-if="item.iconBlob"
+                              class="baseImg"
+                              :src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"
+                              alt
+                            />
+                            <img v-else class="baseImg" :src="item.icon" alt />
+                          </div>
+                          <div class="alg-name">
+                            <div style="padding:0px 10px 0px 10px;">
+                              <span v-if="!item.isEdit">{{ item.name }}</span>
+                              <el-input
+                                size="small"
+                                v-model="item.name"
+                                v-if="item.isEdit"
+                                v-focus
+                                :maxlength="15"
+                                @blur="inputBlur(item)"
+                              ></el-input>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
                 </div>
                 <el-drawer title="涓嬭浇" :visible.sync="actDrawerShow" :direction="direction">
                   <div class="drawer-content">
@@ -183,28 +351,28 @@
                       <ul class="desc">
                         <li>
                           <label>婵�娲荤爜:</label>
-                          <span>YUAAA-AAAEU-QJQE3-ZRRXD-K9MWR</span>
+                          <span>{{activedSdkOrApp.activateCode}}</span>
                         </li>
                         <li>
                           <label>浜у搧鍚嶇О:</label>
-                          <span>浜哄憳璺熻釜SDK</span>
+                          <span>{{activedSdkOrApp.productName}}</span>
                         </li>
                         <li>
                           <label>閰嶇疆璇︽儏:</label>
-                          <span>鏃�</span>
+                          <span>{{activedSdkOrApp.setting}}</span>
                         </li>
                         <li>
                           <label>鏈嶅姟鍒版湡鏃�:</label>
-                          <span>2021-03-04</span>
+                          <span>{{activedSdkOrApp.expireTime}}</span>
                         </li>
                         <li>
                           <label>璁稿彲璇�:</label>
-                          <span>鏈澶�</span>
+                          <span>{{activedSdkOrApp.licence}}</span>
                         </li>
-                        <li>
+                        <!-- <li>
                           <label>璁惧ID:</label>
                           <span>3342-235f-ret55-fdsg</span>
-                        </li>
+                        </li>-->
                       </ul>
                       <div class="text-right">
                         <el-button type="primary" @click="checkMyAlgorith">纭畾</el-button>
@@ -219,6 +387,52 @@
         </div>
       </div>
     </div>
+    <el-dialog
+      title="瀹夎鍖呬俊鎭�"
+      :visible.sync="installDialogVisible"
+      width="40%"
+      :close-on-click-modal="false"
+    >
+      <div class="installInfo">
+        <template v-if="installAppPackage != null">
+          <div>
+            <div>
+              <span>瀹夎鍖呭悕绉帮細</span>
+              <span>{{installAppPackage.productName}}</span>
+            </div>
+            <div>
+              <span>瀹夎鐗堟湰锛�</span>
+              <span>{{installAppPackage.version}}</span>
+            </div>
+            <div>
+              <span>鏇存柊鍐呭锛�</span>
+              <span>{{installAppPackage.installContent}}</span>
+            </div>
+          </div>
+        </template>
+        <template v-if="installSdkPackage != null">
+          <div>
+            <div>
+              <span>瀹夎鍖呭悕绉帮細</span>
+              <span>{{installSdkPackage.productName}}</span>
+            </div>
+            <div>
+              <span>瀹夎鐗堟湰锛�</span>
+              <span>{{installSdkPackage.version}}</span>
+            </div>
+            <div>
+              <span>鏇存柊鍐呭锛�</span>
+              <span>{{installSdkPackage.installContent}}</span>
+            </div>
+          </div>
+        </template>
+        <p>纭畾瀹夎锛�</p>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="installDialogVisible = false">鍙� 娑�</el-button>
+        <el-button type="primary" @click="offlineInstall">瀹� 瑁�</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 <script>
@@ -239,8 +453,11 @@
   findByType,
   getTagList,
   downloadSdk,
-  installSdk
+  installSdk,
+  getInstallInfo
 } from "./api";
+import { getApps, installApp, removeApp, getUnActivedSdk, actPageAlg, getUnActivedApp, actApp } from "@/api/app";
+
 import FileUploader from "@/components/subComponents/FileUpload/index";
 import TaskManage from "@/Pool/TaskMange";
 import VideoManageData from "@/Pool/VideoManageData";
@@ -251,28 +468,40 @@
     FileUploader
   },
   computed: {
-    notInstalledList() {
+    notInstalledList () {
       return this.TaskMange.list1.filter(sdk => {
         return sdk.installed === false;
       });
     },
-    installedList() {
+    installedList () {
       return this.TaskMange.list1.filter(sdk => {
         return sdk.installed === true;
       });
     },
-    ungradeList() {
+    ungradeList () {
       // 鍗囩骇澶勭悊浼氬鑷撮噸澶嶇殑key,闇�瑕佷慨鏀�
-      return [];
+      //return [];
       return this.TaskMange.list1.filter(sdk => {
         return sdk.isUpgrade === true;
       });
-    }
+    },
+    isAdmin () {
+      if (
+        sessionStorage.getItem("userInfo") &&
+        sessionStorage.getItem("userInfo") !== ""
+      ) {
+        let loginName = JSON.parse(sessionStorage.getItem("userInfo")).username;
+        return loginName === "superadmin" || loginName === "basic";
+      }
+
+      return false;
+    },
   },
-  data() {
+  data () {
     return {
       TaskMange: new TaskManage,
       VideoManageData: new VideoManageData,
+      buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
       activeName: "myAlgorithm",
       patchUpdateStatus: "",
       dragging: false,
@@ -335,12 +564,34 @@
       sceneSdks: [],
       sceneRuleList: "",
       isInstall: false,
-      installPercentage: 0
+      installDialogVisible: false,
+      installPackage: {},
+      installAppPackage: null,
+      installSdkPackage: null,
+      installPercentage: 0,
+      unActivedSDKList: [],
+      unActivedAppList: [],
+      //actSdkId: '',
+      actType: '',
+      actId: '',
+      activedSdkOrApp: {
+        activateCode: '',
+        productName: '',
+        setting: '',
+        expireTime: '',
+        licence: '',
+        devIds: ''
+      },
+      // unloadLoading: false,
+      // installLoading: false,
+      installedApps: [],
+      storeApps: [],
+      installFile: {}
     }
   },
   watch: {
     list2: {
-      handler(newVal, oldVal) {
+      handler (newVal, oldVal) {
         // window.console.log(newVal, oldVal, '鐩戝惉list2')
         if (newVal !== oldVal) {
           // window.console.log(newVal, '鐩戝惉list2')
@@ -361,34 +612,300 @@
       }
     }
   },
-  mounted() {
+  mounted () {
+    this.getAllApps();
     this.findAllSdk();
     this.findByType();
     this.getBaseList();
     this.findAll();
-    this.getUser();
+    this.getUnActivedList();
+    this.getUnActivedAppList();
     // this.TaskMange.findAllSdk();
     // this.TaskMange.findByType();
     this.VideoManageData.init();
   },
   methods: {
-    installFormat(percentage) {
+    isShow (authority) {
+      return this.isAdmin || this.buttonAuthority.indexOf("," + authority + ",") > -1
+    },
+    //绂荤嚎瀹夎
+    offlineInstall () {
+      this.installDialogVisible = false;
+      this.isInstall = true;
+      //瀹夎
+      installSdk(this.installFile).then(res => {
+        debugger
+        if (res.success) {
+          this.isInstall = false;
+          this.$message({
+            type: 'success',
+            message: '瀹夎鎴愬姛,灏嗚烦杞嚦鎴戠殑绠楁硶涓煡鐪�'
+          });
+          setTimeout(() => {
+            this.findAllSdk();
+            this.getAllApps();
+            window.parent.postMessage({
+              msg: "AppUpdate"
+            }, '*')
+            this.activeName = 'myAlgorithm';
+          }, 3000);
+        }
+
+      }).catch(e => {
+        console.log(e)
+        this.isInstall = false;
+        this.$message({
+          type: 'error',
+          message: e.data
+        });
+      })
+    },
+    downloadApp (app, action) {
+      if (action == 'upgrade') {
+        app.upgradeLoading = true;
+      } else {
+        app.installLoading = true;
+      }
+      let _this = this;
+
+      installApp({ path: app.id }).then(res => {
+        if (res && res.success) {
+          setTimeout(() => {
+            if (action == 'upgrade') {
+              app.upgradeLoading = false;
+              _this.notify({
+                type:'success',
+                message:'鍗囩骇鎴愬姛'
+              });
+            } else {
+              app.installLoading = false;
+              _this.notify({
+                type:'success',
+                message:'瀹夎鎴愬姛'
+              });
+            }
+            _this.getAllApps();
+            window.parent.postMessage({
+              msg: "AppUpdate"
+            }, '*')
+          }, 3000);
+        }
+      }).catch(e => {
+        console.log(e);
+        if (action == 'upgrade') {
+          app.upgradeLoading = false;
+        } else {
+          app.installLoading = false;
+        }
+      })
+    },
+    getAllApps () {
+      let _this = this;
+      _this.installedApps = [];
+      _this.storeApps = [];
+      getApps().then(res => {
+        if (res && res.success) {
+          //_this.storeApps = res.data;
+          res.data.forEach(item => {
+            if (item.installed) {
+              let obj = Object.assign({ unloadLoading: false, upgradeLoading: false }, item)
+              _this.installedApps.push(obj)
+            } else {
+              let obj = Object.assign({ installLoading: false, upgradeLoading: false }, item)
+              _this.storeApps.push(obj)
+            }
+          });
+          console.log('_this.installedApps', _this.installedApps);
+          console.log('_this.storeApps', _this.storeApps);
+        }
+      })
+    },
+    //鍗歌浇搴旂敤
+    unLoad (app) {
+      app.unloadLoading = true;
+      let _this = this;
+      removeApp({ appId: app.id }).then(res => {
+
+        if (res && res.success) {
+          setTimeout(() => {
+            app.unloadLoading = false;
+            _this.getAllApps();
+            window.parent.postMessage({
+              msg: "AppUpdate"
+            }, '*')
+          }, 3000);
+        }
+      }).catch(e => {
+        console.log(e);
+        app.unloadLoading = false;
+      })
+
+    },
+    // actSdk (id) {
+    //   this.actSdkId = id;
+    //   this.actDrawerShow = true;
+    //   this.actStep = 0;
+    //   this.activeCode = '';
+    //   this.activedSdkOrApp = this.newActInfo()
+    // },
+    actSdkOrApp (id, type = 'sdk') {
+      this.actType = type;
+      this.actId = id;
+      this.actDrawerShow = true;
+      this.actStep = 0;
+      this.activeCode = '';
+      this.activedSdkOrApp = this.newActInfo()
+    },
+    newActInfo () {
+      return {
+        activateCode: '',
+        productName: '',
+        setting: '',
+        expireTime: '',
+        licence: '',
+        devIds: ''
+      }
+    },
+    getUnActivedList () {
+      getUnActivedSdk().then(res => {
+        if (res.code == 200) {
+          this.unActivedSDKList = res.data;
+        }
+      })
+
+    },
+    getUnActivedAppList () {
+      getUnActivedApp().then(res => {
+        if (res.code == 200) {
+          this.unActivedAppList = res.data;
+        }
+      });
+    },
+
+    installFormat (percentage) {
       return percentage === 100 ? '瀹夎鎴愬姛' : `${percentage}%`;
     },
-    actived() {
-      //this.activeCode
-      this.actStep++
+    actived () {
+      let _this = this;
+      if (this.actType == 'sdk') {
+        //婵�娲荤畻娉�
+        actPageAlg(this.actId, this.activeCode).then(res => {
+          if (res.data.isSuccess) {
+            _this.activedSdkOrApp = res.data.successMsg;
+            _this.actStep++;
+            _this.getUnActivedList();
+            _this.findAllSdk();
+          } else {
+            _this.$notify({
+              type: 'error',
+              message: res.data.failMsg.failMsg
+            });
+          }
+        }).catch(e => {
+          console.log(e)
+        });
+      } else if (this.actType == 'app') {
+        //婵�娲诲簲鐢�
+        actApp(this.actId, this.activeCode).then(res => {
+          if (res.data.isSuccess) {
+            _this.activedSdkOrApp = res.data.successMsg;
+            _this.actStep++;
+            _this.getUnActivedAppList();
+            _this.getAllApps();
+          } else {
+            _this.$notify({
+              type: 'error',
+              message: res.data.failMsg.failMsg
+            });
+          }
+        }).catch(e => {
+          console.log(e)
+        });
+      }
     },
-    getCodeDetail() { },
-    checkMyAlgorith() {
+    getCodeDetail () { },
+    checkMyAlgorith () {
       this.actDrawerShow = false;
       this.activeName = "myAlgorithm";
     },
-    onFileUpload(file) {
+    onFileUpload (file) {
       //this.patchUpdateStatus = `<span style="color:green">涓婁紶鎴愬姛, 鐐瑰嚮鍗囩骇鎸夐挳寮�濮嬪畨瑁�</span>`;
       this.patchFile = { ...file };
       this.fileAdded = true;
       const h = this.$createElement;
+      //涓婁紶瀹屾垚鑾峰彇瀹夎淇℃伅
+      let _this = this;
+      getInstallInfo(file).then(res => {
+        _this.installFile = file;
+        if (res.success) {
+          _this.installDialogVisible = true;
+          debugger
+          if (res.data.apps.length > 0) {
+            _this.installAppPackage = {
+              appId: res.data.apps[0].appId,
+              version: res.data.apps[0].version,
+              productName: res.data.productName,
+              installContent: res.data.apps[0].installContent
+            }
+          }
+          if (res.data.sdks.length > 0) {
+            _this.installSdkPackage = {
+              appId: res.data.sdks[0].sdkId,
+              version: res.data.sdks[0].version,
+              productName: res.data.productName,
+              installContent: res.data.sdks[0].installContent
+            }
+          }
+
+          // this.$confirm('', '绠楁硶淇℃伅', {
+          //   message: `<div class="installInfo">
+          //           <div><span>绠楁硶鍚嶇О锛�</span><span>${file.filename}</span></div>
+          //           <div><span>瀹夎鐗堟湰锛�</span><span></span></div>
+          //           <div><span>鏇存柊鍐呭锛�</span><span></span></div>
+          //           <p>纭畾瀹夎姝ょ畻娉曪紵</p>
+          //         </div>`,
+          //   confirmButtonText: '瀹夎',
+          //   cancelButtonText: '鍙栨秷',
+          //   dangerouslyUseHTMLString: true,
+          //   type: ''
+          // }).then(() => {
+          //   this.isInstall = true;
+          //   //瀹夎
+          //   installSdk(file).then(res => {
+          //     debugger
+          //     if (res.success) {
+          //       this.isInstall = false;
+          //       //this.$refs['progressBar'].style.width = 100%
+          //       //this.installPercentage = 100%
+          //       this.$message({
+          //         type: 'success',
+          //         message: '瀹夎鎴愬姛,灏嗚烦杞嚦鎴戠殑绠楁硶涓煡鐪�'
+          //       });
+          //       setTimeout(() => {
+          //         this.findAllSdk();
+          //         this.activeName = 'myAlgorithm';
+          //       }, 3000)
+          //     }
+
+          //   }).catch(e => {
+          //     console.log(e)
+          //     this.isInstall = false;
+          //     this.$message({
+          //       type: 'error',
+          //       message: e.data
+          //     });
+          //   })
+          // }).catch(() => {
+          //   console.log('鍙栨秷瀹夎');
+
+          // })
+        }
+      }).catch(e => {
+        this.$message({
+          type: 'error',
+          message: e.data
+        });
+      })
       // this.$msgbox({
       //     title: '绠楁硶淇℃伅',
       //     message: h('div', null, [
@@ -419,48 +936,16 @@
       //     });
       //   });
 
-      this.$confirm('', '绠楁硶淇℃伅', {
-        message: `<div class="installInfo">
-                    <div><span>绠楁硶鍚嶇О锛�</span><span>${file.filename}</span></div>
-                    <div><span>瀹夎鐗堟湰锛�</span><span></span></div>
-                    <div><span>鏇存柊鍐呭锛�</span><span></span></div>
-                    <p>纭畾瀹夎姝ょ畻娉曪紵</p>
-                  </div>`,
-        confirmButtonText: '瀹夎',
-        cancelButtonText: '鍙栨秷',
-        dangerouslyUseHTMLString: true,
-        type: ''
-      }).then(() => {
-        this.isInstall = true;
-        //瀹夎
-        installSdk(file).then(res => {
-          if (res.success) {
-            debugger
-            this.isInstall = false;
-            //this.$refs['progressBar'].style.width = 100%
-            //this.installPercentage = 100%
-            this.$message({
-              type: 'success',
-              message: '瀹夎鎴愬姛,灏嗚烦杞嚦鎴戠殑绠楁硶涓煡鐪�'
-            });
-            setTimeout(() => {
-              this.findAllSdk();
-              this.activeName = 'myAlgorithm';
-            }, 3000)
-          }
-        });
-      }).catch(() => {
-        console.log('鍙栨秷瀹夎')
-      })
+
 
     },
 
-    onFileAdded(f) {
-      debugger;
+    onFileAdded (f) {
+      ;
       this.patchUpdateStatus = "";
     },
     // 鏍¢獙杈撳叆鐨勬槸鍚︽槸鏁板瓧
-    valiNum(value) {
+    valiNum (value) {
       if (value) {
         let re = /[^\-?\d.]*$/;
         if (!re.test(value)) {
@@ -477,7 +962,7 @@
       }
     },
     // 宸﹁竟鎷栧姩妯″潡寰楁嫋鍔ㄧ粨鏉熷悗鐨勮Е鍙戝嚱鏁�
-    endLeft(env) {
+    endLeft (env) {
       this.dragging = false;
       let taskId = env.to.id;
       let sdkId = this.TaskMange.list1[env.oldIndex].id;
@@ -518,24 +1003,24 @@
       this.addTaskSdk(json);
     },
     // 鍙宠竟鎷栧姩妯″潡寮�濮嬫嫋鍔ㄨЕ鍙戝嚱鏁�
-    startRight(env) {
+    startRight (env) {
       this.$nextTick(() => {
         this.dragging = true;
       });
       // window.window.console.log(env, "right start");
     },
     // 鍙宠竟鎷栧姩妯″潡鎷栧姩缁撴潫瑙﹀彂鍑芥暟
-    endRight(env) {
+    endRight (env) {
       // window.window.console.log(env, "right end");
     },
-    clickSet(data) {
+    clickSet (data) {
       if (data.isSetting) {
         data.isSetting = false;
       } else {
         data.isSetting = true;
       }
     },
-    clickDel(data, Index) {
+    clickDel (data, Index) {
       this.$confirm("鎻愮ず锛氬垹闄ゅ悗锛屾浠诲姟鍦ㄦ憚鍍忔満涓殑搴旂敤澶辨晥锛屾槸鍚﹀垹闄わ紵", {
         center: true,
         showConfirmButton: true,
@@ -548,7 +1033,7 @@
         })
         .catch(err => { });
     },
-    clickSetAlgo(row, data) {
+    clickSetAlgo (row, data) {
       // window.console.log(row, data, "缂栬緫浠诲姟涓煇涓�涓畻娉�");
       if (row.isShowSetAlgo && data.id === this.TaskMange.currentAlgoId) {
         row.isShowSetAlgo = false;
@@ -614,7 +1099,7 @@
         // });
       }
     },
-    async getRulesByTaskSdk(taskId, sdkId) {
+    async getRulesByTaskSdk (taskId, sdkId) {
       let res = await getRulesByTaskSdk({
         taskId: taskId,
         sdkId: sdkId
@@ -650,10 +1135,9 @@
         this.argsList = JSON.parse(JSON.stringify(this.TaskMange.argsList));
       }
     },
-    async findAllSdk() {
+    async findAllSdk () {
       let res = await findAllSdk();
       if (res && res.success) {
-        // debugger
         this.TaskMange.list1 = res.data.map((i, index) => {
           this.$set(i, "isEdit", false);
           //mock 鏈畨瑁�/寰呭崌绾�
@@ -668,7 +1152,7 @@
         });
       }
     },
-    addTask() {
+    addTask () {
       let obj = {
         id: "",
         name: "浠诲姟" + this.TaskMange.list2.length,
@@ -684,7 +1168,7 @@
         taskArea.scrollTop = taskArea.scrollHeight;
       });
     },
-    async findAll() {
+    async findAll () {
       let res = await findAll();
       if (res && res.success) {
         if (res.data && res.data.length !== 0) {
@@ -721,7 +1205,7 @@
         }
       }
     },
-    clickDelSdk(task, sdk) {
+    clickDelSdk (task, sdk) {
       this.$confirm(
         "鎻愮ず锛氬垹闄ゅ悗锛屾绠楁硶鍦ㄦ湰浠诲姟涓Щ闄わ紝鍚屾椂鍦ㄦ憚鍍忔満涓殑搴旂敤澶辨晥锛屾槸鍚﹀垹闄わ紵",
         {
@@ -737,7 +1221,7 @@
         })
         .catch(err => { });
     },
-    selectChange(event, type, data) {
+    selectChange (event, type, data) {
       if (type === "options1") {
         // window.window.console.log(type, data, "閫夋嫨涓嬫媺妗�");
         data.options1.map(i => {
@@ -748,7 +1232,7 @@
       }
     },
     // 鍒犻櫎浠诲姟绠楁硶
-    async delTaskSdk(task, sdk) {
+    async delTaskSdk (task, sdk) {
       let json = {
         taskId: task.id,
         sdkId: sdk.id
@@ -768,7 +1252,7 @@
       }
     },
     // 鍒犻櫎浠诲姟
-    async deleteTask(data, index) {
+    async deleteTask (data, index) {
       // window.console.log(data, "deleteTask");
       let res = await deleteTask({ taskId: data.id });
       // this.$toast({
@@ -785,7 +1269,7 @@
       }
     },
     // 鏇存柊浠诲姟鐘舵��
-    async updateTaskStatus(data) {
+    async updateTaskStatus (data) {
       // window.console.log(data, '鏇存柊浠诲姟鐘舵��')
       let json = {
         taskId: data.id,
@@ -803,7 +1287,7 @@
       });
     },
     // 鏇存柊浠诲姟鍚嶇О
-    async updateTaskName(data) {
+    async updateTaskName (data) {
       let json = {
         taskId: data.id,
         taskName: data.name
@@ -823,7 +1307,7 @@
       }
     },
     // 鑾峰彇搴曞簱鏁版嵁
-    async getBaseList() {
+    async getBaseList () {
       // let res = await getTagList();
       // if (res && res.success) {
       //   let filter = res.data.filter(i => {
@@ -852,7 +1336,7 @@
       ];
     },
     // 鑾峰彇绠楁硶鍙傛暟
-    async getSdkArgs(data) {
+    async getSdkArgs (data) {
       let res = await getSdkArgs({
         sdkId: data.id,
         scope: "TASKRULE"
@@ -874,7 +1358,7 @@
       }
     },
     // 鏌ヨ瀛楀吀
-    async findByType() {
+    async findByType () {
       let res = await findByType();
       if (res && res.success) {
         let list = res.data.RULECOMPUTEBETWEEN.map(i => {
@@ -887,17 +1371,17 @@
       }
     },
     // 绠楁硶閰嶇疆锛屾柊寤�
-    add() {
+    add () {
       this.TaskMange.argsList.push(
         JSON.parse(JSON.stringify(this.TaskMange.baseObject))
       );
     },
     // 绠楁硶閰嶇疆 鍒犻櫎
-    delRule(index) {
+    delRule (index) {
       this.TaskMange.argsList.splice(index, 1);
     },
     // 绠楁硶鍙傛暟淇濆瓨
-    async save() {
+    async save () {
       let list = this.TaskMange.argsList.map(i => {
         let obj = {};
         obj.id = i.id;
@@ -930,7 +1414,7 @@
         }
       }
     },
-    getDefault() {
+    getDefault () {
       this.deleteTaskSdkRule(
         this.TaskMange.currentTaskId,
         this.TaskMange.currentAlgoId
@@ -941,7 +1425,7 @@
         );
       });
     },
-    async deleteTaskSdkRule(taskId, sdkId) {
+    async deleteTaskSdkRule (taskId, sdkId) {
       let json = {
         taskId: taskId,
         sdkId: sdkId
@@ -961,7 +1445,7 @@
       }
     },
     // 缁欎换鍔℃坊鍔犵畻娉�
-    async addTaskSdk(data) {
+    async addTaskSdk (data) {
       let res = await addTaskSdk(data);
       if (res && res.success) {
         // window.console.log(res, 'res')
@@ -969,7 +1453,7 @@
       }
     },
     // 鏂版坊鍔犱换鍔�
-    async addTaskAsync(name) {
+    async addTaskAsync (name) {
       let res = await addTask({ taskname: name });
       // this.$toast({
       //   type: res.success ? "success" : "error",
@@ -985,7 +1469,7 @@
         this.findAll();
       }
     },
-    cancle(row) {
+    cancle (row) {
       if (row.isShowSetAlgo) {
         row.isShowSetAlgo = false;
       }
@@ -995,12 +1479,12 @@
         this.$set(i, "isSelect", false);
       });
     },
-    cancleTask(row) {
+    cancleTask (row) {
       if (row.isSetting) {
         row.isSetting = false;
       }
     },
-    commandAlgo(command, row, item) {
+    commandAlgo (command, row, item) {
       if (command === 1) {
         // console.log('璁剧疆绠楁硶')
         this.clickSetAlgo(row, item);
@@ -1010,26 +1494,13 @@
         this.clickDelSdk(row, item);
       }
     },
-    commandTask(command, row) {
+    commandTask (command, row) {
       if (command === 1) {
         //缂栬緫浠诲姟
         this.clickSet(row);
       }
     },
-    getUser() {
-      // console.log("鐧诲綍鐢ㄦ埛",JSON.parse(sessionStorage.getItem("userInfo")).username)
-      if (
-        sessionStorage.getItem("userInfo") &&
-        (JSON.parse(sessionStorage.getItem("userInfo")).username ==
-          "superadmin" ||
-          JSON.parse(sessionStorage.getItem("userInfo")).username == "basic")
-      ) {
-        this.isSuperUser = true;
-      } else {
-        this.isSuperUser = false;
-      }
-    },
-    donwload(item) {
+    donwload (item) {
       this.downloading = true;
       this.downloadItem = item.id;
 
@@ -1053,15 +1524,15 @@
           this.downloadItem = "";
         });
     },
-    commandAlgLib(item) {
+    commandAlgLib (item) {
       this.$set(item, "isEdit", true);
     },
-    inputBlur(item) {
+    inputBlur (item) {
       // console.log(item, '淇敼鍚嶇О')
       this.$set(item, "isEdit", false);
     },
-    
-    cleanTemplateForm() {
+
+    cleanTemplateForm () {
       this.appSceneForm.name = "";
       this.appSceneForm.desc = "";
       this.appSceneForm.rules = "";
@@ -1069,10 +1540,10 @@
 
       this.$refs.ruleEditor.cleanRule();
     },
-    handleTabClick() {
-     
+    handleTabClick () {
+
     },
-    handleCreateScene() {
+    handleCreateScene () {
       this.sceneDialogVisible = true;
       this.dialogTitle = '鍒涘缓鍦烘櫙妯℃澘';
 
@@ -1085,10 +1556,10 @@
         this.cleanTemplateForm();
       });
     },
-    handleDialogClose() {
+    handleDialogClose () {
       this.sceneDialogVisible = false;
     },
-    handleEditScene(item) {
+    handleEditScene (item) {
       this.appSceneForm.name = item.name;
       this.appSceneForm.desc = item.desc;
 
@@ -1097,8 +1568,8 @@
       this.sceneDialogVisible = true;
       this.dialogTitle = '缂栬緫鍦烘櫙妯℃澘';
     },
-   
-    
+
+
   }
 };
 </script>
@@ -1150,18 +1621,36 @@
   color: #606266;
   cursor: pointer;
 }
-
+.el-loading-mask .el-loading-spinner {
+  top: 40px !important;
+}
+.el-loading-mask .el-loading-spinner svg {
+  transform: none !important;
+  top: 20px !important;
+  left: 40% !important;
+}
+.el-loading-mask .el-loading-spinner p.el-loading-text {
+  display: block !important;
+  text-align: center !important;
+  bottom: 10px !important;
+  top: 80px !important;
+  right: 0 !important;
+  color: #78adf7;
+}
+.el-loading-mask .el-loading-spinner .path {
+  stroke: #78adf7;
+}
 .installInfo {
   text-indent: 2em;
   font-size: 14px;
-  color: #777;
+  line-height: 26px;
   p {
     text-align: center;
-    color: #666;
   }
 }
-.src-title{
-  color: #333;
+.src-title {
+  //color: #bfbfbf;
+  color: #bbcee8;
   font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC';
   font-weight: 650;
   font-style: normal;
@@ -1187,7 +1676,7 @@
       position: absolute;
       top: 50%;
       left: 50%;
-      background: url("/images/algo/green.gif");
+      background: url('/images/algo/green.gif');
       overflow: hidden;
       transform: translate(-50%, -50%);
       .inner-bar {
@@ -1242,7 +1731,15 @@
       height: 100%;
       box-sizing: border-box;
       // float: left;
-
+      .el-drawer__header {
+        border-bottom: 2px solid #eee;
+        padding-bottom: 10px;
+        font-size: 16px;
+        margin-bottom: 0px;
+        span {
+          outline: none !important;
+        }
+      }
       .action-bar {
         margin-bottom: 30px;
         .el-input {
@@ -1250,44 +1747,30 @@
         }
       }
       .task-list {
-        background: #fff;
+        background: #fdfdfd;
         padding: 20px;
         box-sizing: border-box;
-        
+
         .flex-list {
           display: flex;
           flex-direction: row;
           flex-wrap: wrap;
-          // justify-content: space-around;
-          // align-content: space-around;
-          // &:after {
-          //   content: "";
-          //   flex: auto;
-          // }
           .wrap-box {
             width: 16.66%;
           }
           .list-choose-item-left {
-            // width: 220px;
-            // height: 214px;
             width: 80%;
             height: auto;
             margin: auto;
             margin-bottom: 30px;
-            // @media screen and(min-width: 1895px) {
-            //   //margin: 20px 25px 20px 20px;
-            //   width: 230px;
-            //   height: 224px;
-            // }
-            // @media screen and(min-width: 1695px) and(max-width:1895px ) {
-            //   margin: 20px 10px 20px 15px;
-            // }
-            // @media screen and(min-width: 1460px) and(max-width: 1695px) {
-            //   margin: 20px 25px 20px 20px;
-            // }
-            // @media screen and(max-width: 1460px) {
-            //   margin: 20px 15px 20px 10px;
-            // }
+            max-width: 200px;
+            .mask {
+              width: 100%;
+
+              .el-button + .el-button {
+                margin-left: 0 !important;
+              }
+            }
           }
         }
       }
@@ -1327,6 +1810,9 @@
               z-index: 1;
               border-radius: 3px;
               display: none;
+              .el-button + .el-button {
+                margin-left: 0 !important;
+              }
               .tool {
                 position: absolute;
                 top: 49%;
@@ -1450,12 +1936,20 @@
           }
         }
       }
-      .store-list {
+      .store-list,
+      .app-list {
         display: flex;
         flex-wrap: wrap;
         .wrap-box {
           width: 16.6%;
           margin-bottom: 30px;
+          .list-choose-item-left {
+            width: 80%;
+            height: auto;
+            margin: auto;
+            margin-bottom: 30px;
+            max-width: 200px;
+          }
           .inner {
             width: 80%;
             box-sizing: border-box;
@@ -1514,16 +2008,16 @@
         }
       }
       .drawer-content {
-        font-family: "PingFangSC-Regular";
+        font-family: 'PingFangSC-Regular';
         .el-step__title.is-process {
           border-color: #3d68e1 !important;
           color: #3d68e1 !important;
-          font-family: Tahoma, Helvetica, Arial, "\5B8B\4F53", sans-serif;
+          font-family: Tahoma, Helvetica, Arial, '\5B8B\4F53', sans-serif;
         }
         .el-step__head.is-process {
           border-color: #3d68e1 !important;
           color: #3d68e1 !important;
-          font-family: Tahoma, Helvetica, Arial, "\5B8B\4F53", sans-serif;
+          font-family: Tahoma, Helvetica, Arial, '\5B8B\4F53', sans-serif;
         }
         .el-input {
           width: 100%;
@@ -1560,6 +2054,7 @@
         }
         .text-right {
           padding-right: 30px;
+          text-align: right;
           .tip {
             color: #999;
             line-height: 38px;
@@ -1596,7 +2091,13 @@
       z-index: 1;
       border-radius: 3px;
       display: none;
-
+      .info-onmask {
+        color: #8ecaff;
+      }
+      .mask-btn {
+        width: 100%;
+        display: flex;
+      }
       i {
         color: #fff;
         position: relative;
@@ -1660,28 +2161,9 @@
       cursor: pointer;
       position: relative;
       font-size: 14px;
-      // display: inline-block;
-      // @media screen and(min-width: 1895px) {
-      //   //margin: 20px 25px 20px 20px;
-      //   margin: 20px 30px 20px 20px;
-      // }
-      // @media screen and(min-width: 1695px) and(max-width:1895px ) {
-      //   margin: 20px 10px 20px 15px;
-      // }
-      // @media screen and(min-width: 1460px) and(max-width: 1695px) {
-      //   margin: 20px 25px 20px 20px;
-      // }
-      // @media screen and(max-width: 1460px) {
-      //   margin: 20px 15px 20px 10px;
-      // }
-      // width: 126px;
-      // height: 120px;
-      // width: 220px;
-      // height: 214px;
+
       transition: all 1s;
       background: #ffffff;
-      border: 1px solid #e2e2e2;
-      box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.07);
       border-radius: 4px;
       p {
         display: none;
@@ -1701,8 +2183,15 @@
       .mask {
         display: flex;
         align-items: flex-end;
+        flex-wrap: wrap;
+        justify-content: center;
+        top: 0;
         .bot-btn {
           flex: 1;
+        }
+        &.flex-center {
+          align-items: center;
+          justify-content: center;
         }
       }
     }
@@ -1816,11 +2305,12 @@
       color: #222222;
     }
     .alg-name {
-      margin-top: 12px;
+      //margin-top: 12px;
       line-height: 36px;
       font-family: PingFangSC-Regular;
-      font-size: 15px;
-      color: #222222;
+      font-size: 14px;
+      letter-spacing: 0.05em;
+      color: #3e4664;
       // background-color: #ecf5ff;
       .el-input {
         position: relative;
@@ -1852,13 +2342,16 @@
     }
     .list-complete-item-handle {
       height: 100%;
-      padding-bottom: 10px;
+      //padding-bottom: 10px;
       text-align: center;
       .svg-wrap {
-        width: 80%;
+        //width: 80%;
+        width: 100%;
         margin: auto;
         padding-top: 80%;
+        padding-top: 100%;
         position: relative;
+        box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.07);
         svg {
           position: absolute;
           top: 50%;
@@ -1866,10 +2359,31 @@
           transform: translate(-50%, -50%);
         }
         .baseImg {
+          width: 56%;
           position: absolute;
           top: 50%;
           left: 50%;
           transform: translate(-50%, -50%);
+          max-width: 106px;
+          max-height: 106px;
+        }
+      }
+      .willUpGrade {
+        .iconupdate {
+          color: #01e667;
+          position: absolute;
+          top: 5px;
+          right: 5px;
+          font-weight: 550;
+          font-size: 26px;
+        }
+      }
+      &.uninstall {
+        .svg-wrap {
+          background-color: #ddd;
+        }
+        .alg-name {
+          color: darkgray;
         }
       }
     }

--
Gitblit v1.8.0