From 5058e8d5fc8220a4fa31d160935c1aafd6074fb3 Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@iotlink.com>
Date: 星期三, 07 四月 2021 15:46:45 +0800
Subject: [PATCH] 修复以图搜图底库图片显示的问题

---
 src/pages/ai/index/App.vue | 3040 ++++++++++++++++++++++++++++++++--------------------------
 1 files changed, 1,680 insertions(+), 1,360 deletions(-)

diff --git a/src/pages/ai/index/App.vue b/src/pages/ai/index/App.vue
index aa0dbb2..679fc32 100644
--- a/src/pages/ai/index/App.vue
+++ b/src/pages/ai/index/App.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="s-task-manage">
-    <div style="height:100%;">
+    <div style="height: 100%">
       <div class="flex-box task-manage">
         <div class="installModel" v-if="isInstall">
           <div class="progress-bar">
@@ -17,70 +17,84 @@
               v-model="activeName"
               type="border-card"
               @tab-click="handleTabClick"
-              style="height: calc(100% - 20px);"
+              style="height: calc(100% - 20px)"
             >
-              <el-tab-pane label="宸插畨瑁�" name="myAlgorithm">
-                <div class="width-new-line task-list" v-show="activeName === 'myAlgorithm'">
+              <el-tab-pane label="宸叉縺娲�" name="myAlgorithm">
+                <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="'upgrade'+item.id">
+                    <div
+                      class="wrap-box"
+                      v-for="item in installedList"
+                      :key="item.id"
+                    >
                       <div class="list-choose-item-left">
                         <div class="list-complete-item-handle">
-                          <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
+                            class="svg-wrap"
+                            :class="{ willUpGrade: item.isUpgrade }"
+                            v-loading="item.upgradeLoading"
+                            :element-loading-text="item.progressMsg"
+                            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="left-top">
+                                <div>褰撳墠鐗堟湰:{{ item.version }}</div>
+                                <div v-if="item.remoteVersion">
+                                  鏈�鏂扮増鏈�:{{ item.remoteVersion }}
+                                </div>
+                              </div>
+                              <div
+                                class="info-onmask"
+                                @click="checkDetail(item, 'active')"
+                              >
+                                鏌ョ湅璇︽儏
                               </div>
                               <div class="mask-btn">
                                 <el-button
-                                  type="warning"
-                                  class="bot-btn"
+                                  @click="unLoadSdk(item)"
+                                  type="primary"
                                   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;">
-                              <span>{{ item.sdk_name }}</span>
-                            </div>
-                          </div>
-                        </div>
-                      </div>
-                    </div>
-                    <div class="wrap-box" v-for="(item) in installedList" :key="item.id">
-                      <div class="list-choose-item-left">
-                        <div class="list-complete-item-handle">
-                          <div class="svg-wrap">
-                            <div class="mask flex-center" v-if="!item.isEdit">
-                              <div class="info-onmask">
-                                <div>褰撳墠鐗堟湰:{{item.version}}</div>
+                                  class="bot-btn"
+                                  >鍗歌浇</el-button
+                                >
+                                <el-button
+                                  v-if="item.isUpgrade"
+                                  @click="donwload(item,0)"
+                                  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}`"
+                              :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>
+                            <div style="padding: 0px 10px 0px 10px">
+                              <span v-if="!item.isEdit">{{
+                                item.sdk_name
+                              }}</span>
 
                               <el-input
                                 size="small"
@@ -95,31 +109,68 @@
                         </div>
                       </div>
                     </div>
-                    <!-- </draggable> -->
-                    <div class="wrap-box" v-for="(item) in notInstalledList" :key="item.id">
+                    <div
+                      class="wrap-box"
+                      v-for="item in notInstalledList"
+                      :key="item.id"
+                    >
                       <div
                         class="list-choose-item-left list-choose-item-left-uninstal"
                         v-loading="downloading && downloadItem == item.id"
                       >
                         <div class="mask">
-                          <el-button type="primary" class="bot-btn" @click="donwload(item)">瀹夎</el-button>
+                           <div class="left-top">
+                                <div v-if="item.installed">褰撳墠鐗堟湰:{{ item.version }}</div>
+                                <div v-if="item.remoteVersion">
+                                  鏈�鏂扮増鏈�:{{ item.remoteVersion }}
+                                </div>
+                              </div>
+                              <div
+                                class="info-onmask"
+                                @click="checkDetail(item, 'activeNotInstall')"
+                              >
+                                鏌ョ湅璇︽儏
+                              </div>
+                              <div class="mask-btn">
+                                <el-button
+                                 @click="donwload(item,1)"
+                                  type="primary"
+                                  class="bot-btn"
+                                  >瀹夎</el-button
+                                >
+                                
+                              </div>
+                  
                         </div>
                         <div class="click-download" title="涓嬭浇">
                           <span class="iconfont iconxiazai1"></span>
                         </div>
                         <div class="list-complete-item-handle">
-                          <div class="svg-wrap">
+                          <div
+                            class="svg-wrap"
+                            v-loading="
+                              item.installLoading || item.upgradeLoading
+                            "
+                            :element-loading-text="item.progressMsg"
+                            element-loading-background="rgba(0,0,0,.8)"
+                          >
                             <img
                               v-if="item.iconBlob"
                               class="baseImg"
-                              :src="item.iconBlob.indexOf(',')>0? item.iconBlob:`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;">
-                              <span class="list-choose-item-left-uninstal">{{ item.sdk_name }}</span>
+                            <div style="padding: 0px 10px 0px 10px">
+                              <span class="list-choose-item-left-uninstal">{{
+                                item.sdk_name
+                              }}</span>
                             </div>
                           </div>
                         </div>
@@ -128,49 +179,73 @@
                   </div>
                   <p class="src-title">搴旂敤杞欢</p>
                   <div class="flex-list">
-                    <div class="wrap-box" v-for="(item) in installedApps" :key="item.id">
+                    <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?'鍗歌浇涓�':'鍗囩骇涓�'"
+                            :class="{ willUpGrade: item.isUpgrade }"
+                            v-loading="
+                              item.unloadLoading || item.upgradeLoading
+                            "
+                            :element-loading-text="item.progressMsg"
                             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>
+                            <i
+                              class="iconfont iconupdate"
+                              v-if="item.isUpgrade"
+                            ></i>
+                            <div class="mask">
+                              <div class="left-top">
+                                <div>褰撳墠鐗堟湰:{{ item.version }}</div>
+                                <div v-if="item.remoteVersion">
+                                  鏈�鏂扮増鏈�:{{ item.remoteVersion }}
+                                </div>
+                              </div>
+                                  <!-- v-if="!item.isDefault" -->
+                              <div
+                                class="info-onmask"
+                                @click="checkDetail(item,'active')"
+                              >
+                                鏌ョ湅璇︽儏
                               </div>
                               <div class="mask-btn">
                                 <el-button
-                                  v-if="!item.isDefault"
+                                  v-show="!item.isDefault"
                                   @click="unLoad(item)"
                                   type="primary"
                                   size="small"
                                   class="bot-btn"
-                                >鍗歌浇</el-button>
+                                  >鍗歌浇</el-button
+                                >
                                 <el-button
                                   v-if="item.isUpgrade"
-                                  @click="downloadApp(item,'upgrade')"
+                                  @click="downloadApp(item, 'upgrade')"
                                   type="warning"
                                   size="small"
                                   class="bot-btn"
-                                >鍗囩骇</el-button>
+                                  >鍗囩骇</el-button
+                                >
                               </div>
                             </div>
                             <img
                               v-if="item.iconBlob"
                               class="baseImg"
-                              :src="item.iconBlob.indexOf(',')>0? item.iconBlob:`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;">
+                            <div style="padding: 0px 10px 0px 10px">
                               <span v-if="!item.isEdit">{{ item.name }}</span>
                               <el-input
                                 size="small"
@@ -185,32 +260,45 @@
                         </div>
                       </div>
                     </div>
-                    <div class="wrap-box" v-for="item in storeApps" :key="item.id">
+                    <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?'瀹夎涓�':'鍗囩骇涓�'"
+                            v-loading="
+                              item.installLoading || item.upgradeLoading
+                            "
+                            :element-loading-text="item.progressMsg"
                             element-loading-background="rgba(0,0,0,.8)"
                           >
                             <div class="mask">
+                             
                               <el-button
+                                size="small"
                                 type="primary"
                                 class="bot-btn"
                                 @click="downloadApp(item)"
-                              >瀹夎</el-button>
+                                >瀹夎</el-button
+                              >
                             </div>
                             <img
                               v-if="item.iconBlob"
                               class="baseImg"
-                              :src="item.iconBlob.indexOf(',')>0? item.iconBlob:`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;">
+                            <div style="padding: 0px 10px 0px 10px">
                               <span v-if="!item.isEdit">{{ item.name }}</span>
                               <el-input
                                 size="small"
@@ -248,31 +336,78 @@
                   </div>
                 </div>
               </el-tab-pane>
-              <el-tab-pane label="搴旂敤涓績" name="algorithmMall" v-if=" isShow('algorithmManage:buy')">
+              <el-tab-pane
+                label="搴旂敤涓績"
+                name="algorithmMall"
+                v-if="isShow('algorithmManage:buy')"
+              >
                 <div class="tab-content">
                   <p class="src-title">绠楁硶杞欢</p>
                   <div class="store-list flex-list">
-                    <div class="wrap-box" v-for="item in unActivedSDKList" :key="item.id">
+                    <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)">
+                            <!-- <div class="mask" @click="actSdkOrApp(item.id)">
                               <span
                                 class="iconfont iconyunxiazai"
-                                style="color:#ff6a00;font-size:20px;position:absolute;top:45%;left:45%"
+                                style="
+                                  color: #ff6a00;
+                                  font-size: 20px;
+                                  position: absolute;
+                                  top: 45%;
+                                  left: 45%;
+                                "
                               ></span>
+                            </div> -->
+                            <div
+                              class="mask"
+                              v-if="!item.isDefault || item.isUpgrade"
+                            >
+                              <div class="left-top">
+                                <div>褰撳墠鐗堟湰:{{ item.version }}</div>
+                                <div v-if="item.remoteVersion">
+                                  鏈�鏂扮増鏈�:{{ item.remoteVersion }}
+                                </div>
+                              </div>
+                              <div
+                                class="info-onmask"
+                                @click="actSdkOrApp(item)"
+                              >
+                                鏌ョ湅璇︽儏
+                              </div>
+                              <div class="mask-btn">
+                                <el-button
+                                  @click="actSdkOrApp(item)"
+                                  type="primary"
+                                  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}`"
+                              :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>
+                            <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"
@@ -289,26 +424,73 @@
                   </div>
                   <p class="src-title">搴旂敤杞欢</p>
                   <div class="app-list flex-list">
-                    <div class="wrap-box" v-for="item in unActivedAppList" :key="item.id">
+                     <div v-if="!unActivedAppList.length" class="empty-tip">
+                      鏆傛棤鏁版嵁
+                    </div>
+                    <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')">
+                            <!-- <div
+                              class="mask"
+                              @click="actSdkOrApp(item, 'app')"
+                            >
                               <span
                                 class="iconfont iconyunxiazai"
-                                style="color:#ff6a00;font-size:20px;position:absolute;top:45%;left:45%"
+                                style="
+                                  color: #ff6a00;
+                                  font-size: 20px;
+                                  position: absolute;
+                                  top: 45%;
+                                  left: 45%;
+                                "
                               ></span>
+                            </div> -->
+                             <div
+                              class="mask"
+                              v-if="!item.isDefault || item.isUpgrade"
+                            >
+                              <div class="left-top">
+                                <div>褰撳墠鐗堟湰:{{ item.version }}</div>
+                                <div v-if="item.remoteVersion">
+                                  鏈�鏂扮増鏈�:{{ item.remoteVersion }}
+                                </div>
+                              </div>
+                              <div
+                                class="info-onmask"
+                                @click="actSdkOrApp(item,'app')"
+                              >
+                                鏌ョ湅璇︽儏
+                              </div>
+                              <div class="mask-btn">
+                                <el-button
+                                  @click="actSdkOrApp(item,'app')"
+                                  type="primary"
+                                  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}`"
+                              :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;">
+                            <div style="padding: 0px 10px 0px 10px">
                               <span v-if="!item.isEdit">{{ item.name }}</span>
                               <el-input
                                 size="small"
@@ -325,62 +507,199 @@
                     </div>
                   </div>
                 </div>
-                <el-drawer title="涓嬭浇" :visible.sync="actDrawerShow" :direction="direction">
-                  <div class="drawer-content">
-                    <div class="current-step">
-                      <el-steps align-center :active="actStep" finish-status="success">
-                        <el-step title="娣诲姞婵�娲荤爜"></el-step>
-                        <el-step title="婵�娲绘垚鍔�"></el-step>
-                      </el-steps>
+                <!--  -->
+                
+              </el-tab-pane>
+              <el-tab-pane name="update">
+                <span slot="label">
+                  <el-badge class="update-badge" :value="updateNum" :hidden="updateNum==0"
+                    >鏇存柊</el-badge
+                  >
+                </span>
+                <div class="task-list">
+                  <div class="flex-title">
+                    <p class="src-title">绠楁硶杞欢</p>
+                    <el-button
+                      @click="batchUpdate('sdk')"
+                      size="mini"
+                      type="primary"
+                      >鏇存柊鍏ㄩ儴</el-button
+                    >
+                  </div>
+                  <div class="flex-list">
+                    <div v-if="hasNewVersionSdk.length==0" class="empty-tip">
+                      {{errMsg?errMsg:"鏆傛棤鏁版嵁"}}
                     </div>
-
-                    <div v-if="actStep==0">
-                      <div class="act-code">
-                        <p>浣跨敤婵�娲荤爜灏嗘柊鐨勭畻娉曟坊鍔犲埌鎮ㄧ殑璐︽埛</p>
-                        <el-input
-                          v-model="activeCode"
-                          placeholder="00000-00000-00000-00000-00000"
-                          @blur="getCodeDetail"
-                        ></el-input>
-                      </div>
-                      <div class="text-right">
-                        <el-button type="primary" @click="actived">婵�娲�</el-button>
-                      </div>
-                    </div>
-                    <div v-else-if="actStep==1">
-                      <ul class="desc">
-                        <li>
-                          <label>婵�娲荤爜:</label>
-                          <span>{{activedSdkOrApp.activateCode}}</span>
-                        </li>
-                        <li>
-                          <label>浜у搧鍚嶇О:</label>
-                          <span>{{activedSdkOrApp.productName}}</span>
-                        </li>
-                        <li>
-                          <label>閰嶇疆璇︽儏:</label>
-                          <span>{{activedSdkOrApp.setting}}</span>
-                        </li>
-                        <li>
-                          <label>鏈嶅姟鍒版湡鏃�:</label>
-                          <span>{{activedSdkOrApp.expireTime}}</span>
-                        </li>
-                        <li>
-                          <label>璁稿彲璇�:</label>
-                          <span>{{activedSdkOrApp.licence}}</span>
-                        </li>
-                        <!-- <li>
-                          <label>璁惧ID:</label>
-                          <span>3342-235f-ret55-fdsg</span>
-                        </li>-->
-                      </ul>
-                      <div class="text-right">
-                        <el-button type="primary" @click="checkMyAlgorith">纭畾</el-button>
-                        <p class="tip">鎻愮ず锛氳鍦ㄢ�滄垜鐨勭畻娉曗�濅腑鏌ョ湅骞跺畨瑁呯畻娉�</p>
+                    <div
+                      class="wrap-box"
+                      v-for="item in hasNewVersionSdk"
+                      :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.upgradeLoading"
+                            :element-loading-text="item.progressMsg"
+                            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="left-top">
+                                <div>褰撳墠鐗堟湰:{{ item.version }}</div>
+                                <div v-if="item.remoteVersion">
+                                  鏈�鏂扮増鏈�:{{ item.remoteVersion }}
+                                </div>
+                              </div>
+                              <div
+                                class="info-onmask"
+                                @click="checkDetail(item,'active')"
+                              >
+                                鏌ョ湅璇︽儏
+                              </div>
+                              <div class="mask-btn">
+                                <el-button
+                                  @click="unLoadSdk(item)"
+                                  type="primary"
+                                  size="small"
+                                  class="bot-btn"
+                                  >鍗歌浇</el-button
+                                >
+                                <el-button
+                                  v-if="item.isUpgrade"
+                                  @click="donwload(item,0)"
+                                  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.sdk_name
+                              }}</span>
+                            </div>
+                          </div>
+                        </div>
                       </div>
                     </div>
                   </div>
-                </el-drawer>
+                  <div class="flex-title">
+                    <p class="src-title">搴旂敤杞欢</p>
+                    <el-button
+                      @click="batchUpdate('app')"
+                      type="primary"
+                      size="mini"
+                      >鏇存柊鍏ㄩ儴</el-button
+                    >
+                  </div>
+                  <div class="flex-list">
+                    <div v-if="!hasNewVersionApp.length" class="empty-tip">
+                      鏆傛棤鏁版嵁
+                    </div>
+                    <div
+                      class="wrap-box"
+                      v-for="item in hasNewVersionApp"
+                      :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.progressMsg"
+                            element-loading-background="rgba(0,0,0,.8)"
+                          >
+                            <i
+                              class="iconfont iconupdate"
+                              v-if="item.isUpgrade"
+                            ></i>
+                            <div class="mask">
+                              <div class="left-top">
+                                <div>褰撳墠鐗堟湰:{{ item.version }}</div>
+                                <div v-if="item.remoteVersion">
+                                  鏈�鏂扮増鏈�:{{ item.remoteVersion }}
+                                </div>
+                              </div>
+                              <div
+                                class="info-onmask"
+                                @click="checkDetail(item,'active')"
+                              >
+                                鏌ョ湅璇︽儏
+                              </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>
+                </div>
               </el-tab-pane>
             </el-tabs>
           </div>
@@ -398,15 +717,15 @@
           <div>
             <div>
               <span>瀹夎鍖呭悕绉帮細</span>
-              <span>{{installAppPackage.productName}}</span>
+              <span>{{ installAppPackage.productName }}</span>
             </div>
             <div>
               <span>瀹夎鐗堟湰锛�</span>
-              <span>{{installAppPackage.version}}</span>
+              <span>{{ installAppPackage.version }}</span>
             </div>
             <div>
               <span>鏇存柊鍐呭锛�</span>
-              <span>{{installAppPackage.installContent}}</span>
+              <span>{{ installAppPackage.installContent }}</span>
             </div>
           </div>
         </template>
@@ -414,15 +733,15 @@
           <div>
             <div>
               <span>瀹夎鍖呭悕绉帮細</span>
-              <span>{{installSdkPackage.productName}}</span>
+              <span>{{ installSdkPackage.productName }}</span>
             </div>
             <div>
               <span>瀹夎鐗堟湰锛�</span>
-              <span>{{installSdkPackage.version}}</span>
+              <span>{{ installSdkPackage.version }}</span>
             </div>
             <div>
               <span>鏇存柊鍐呭锛�</span>
-              <span>{{installSdkPackage.installContent}}</span>
+              <span>{{ installSdkPackage.installContent }}</span>
             </div>
           </div>
         </template>
@@ -433,59 +752,302 @@
         <el-button type="primary" @click="offlineInstall">瀹� 瑁�</el-button>
       </div>
     </el-dialog>
+    <!-- <div class="dialog-content" v-if="productDetailVisible" > -->
+    <el-dialog
+      class="product-detail-dialog"
+      :visible="productDetailVisible"
+      @close="closeDial"
+    >
+    <!-- <el-button-group> -->
+      <div class="button-group" v-show="!backDisable||!forwardDisable">
+  <el-button    size="small" @click="backwards" :disabled="backDisable"> <span>&#60;</span> </el-button>
+  <!-- <el-button type="primary" size="small" icon="el-icon-arrow-left"></el-button> -->
+  <el-button    size="small" @click="forwards" :disabled="forwardDisable">></el-button>
+  <!-- <el-button type="primary" size="small"><i class="el-icon-arrow-right el-icon--right"></i></el-button> -->
+
+      </div>
+<!-- </el-button-group> -->
+      <div class="dialog-title" slot="title">{{isSDKDialog?"绠楁硶璇︽儏":"搴旂敤璇︽儏"}}</div>
+      <div class="dialog-content">
+        <div class="box-top">
+          <div class="top-left">
+            <div class="banner">
+              <el-carousel
+                ref="carousel"
+                :autoplay="false"
+                indicator-position="none"
+                :arrow="
+                  productDetail.pics !== undefined
+                    ? productDetail.pics.length > 1
+                      ? 'always'
+                      : 'never'
+                    : 'never'
+                "
+                @change="changeHandle"
+              >
+                <!-- :arrow="productDetail.pics.length > 1 ? 'always' : 'never'" -->
+                <el-carousel-item
+                  v-for="(item, index) in productDetail.pics"
+                  :key="index"
+                >
+                  <div class="imgwrap">
+                    <img
+                      v-if="item.type != 'video'"
+                      :src="'/httpImage/' + item.url"
+                      class="cursor-pointer"
+                      preview
+                    />
+                    <video
+                      v-if="item.type == 'video'"
+                      :src="'/httpImage/' + item.url"
+                      controls
+                    ></video>
+                  </div>
+                </el-carousel-item>
+              </el-carousel>
+            </div>
+          </div>
+          <div class="top-right">
+            <!-- <div class="title">{{curCheckTarget.sdk_name}}</div> -->
+            <div class="summary">
+              <div class="icon">
+                <img
+                  v-if="productDetail.iconBlob"
+                  class="baseImg"
+                  :src="
+                    productDetail.iconBlob.indexOf(',') > 0
+                      ? productDetail.iconBlob
+                      : `data:image/png;base64,${productDetail.iconBlob}`
+                  "
+                  alt
+                />
+              </div>
+              <div class="right-desc">
+                  
+                <div class="name"><el-tooltip class="" effect="dark" :content="productDetail.productName  " placement="right-start">
+                  <span>{{ productDetail.productName  }}</span>
+                </el-tooltip></div>
+                <div class="tags">
+                  <el-tag type="info" size="small" color="#fff" v-if="!isSDKDialog">搴旂敤</el-tag>
+                  <el-tag type="info" size="small" color="#fff" v-if="isSDKDialog">绠楁硶</el-tag>
+                </div>
+                <div class="btns">
+                  <el-button size="small" type="warning"  v-if="needToUpgradeInWin||productDetail.isUpgrade" @click="upgradeSDKinWin" >{{
+                    isUpgrading ? "鍗囩骇涓�.." : "鍗囩骇"
+                  }}</el-button>
+                  <el-button size="small" type="primary" v-if="isActive&&!isDefaultApp" @click="unloadSDKinWin">鍗歌浇</el-button>
+                  <el-button size="small" type="primary" v-if="!isActive&&!showInstallNotActive" @click="showInputCode=!showInputCode">婵�娲�</el-button>
+                  <el-button size="small" type="primary" v-if="!isActive&&showInstallNotActive" @click="downloadSdkInSide">{{isUpgrading?"瀹夎涓�..":"瀹夎"}}</el-button>
+                  <el-button size="small" type="success" v-if="!isSDKDialog&&isActive" @click="openApp">鎵撳紑</el-button>
+                </div>
+               
+              </div>
+            </div>
+            <div class="jihuo-input" v-if="showInputCode">
+                        <el-input size="small"
+                          v-model="activeCode"
+                          placeholder="00000-00000-00000-00000-00000"
+                          @blur="getCodeDetail"
+                        ></el-input>
+                         <el-button type="primary" size="small" @click="actived"
+                          >婵�娲�</el-button
+                        >
+                           <el-button type="primary" size="small" @click="cancelActivate"
+                          >鍙栨秷</el-button
+                        >
+                      </div>
+            <div class="product-intruduction">
+              <div class="part-title" v-if="!showInputCode">绠�浠�</div>
+              <div class="text">
+                <div class="single-desc">
+                  <div>鐗堟湰锛�</div>
+                  <div>
+                    {{
+                      productDetail.productVersion === ""
+                        ? "鏆傛棤"
+                        : productDetail.productVersion
+                    }}
+                  </div>
+                </div>
+                <div class="single-desc">
+                  <div>姒傝堪锛�</div>
+                  <div>
+                    {{
+                      productDetail.description === ""
+                        ? "鏆傛棤"
+                        : productDetail.description
+                    }}
+                  </div>
+                </div>
+                <div class="single-desc">
+                  <div>璇﹁堪锛�</div>
+                  <div>
+                    {{
+                      productDetail.summary === ""
+                        ? "鏆傛棤"
+                        : productDetail.summary
+                    }}
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="box-bottom">
+          <div class="bot-left">
+            <div class="part-title">{{isSDKDialog?"搴旂敤鍦烘櫙":"鍔熻兘鐗圭偣"}}</div>
+            <div class="list-zone">
+              <div
+                class="list-item"
+                v-for="(item, index) in productDetail.funcInfo"
+                :key="index"
+              >
+                <el-tag type="" size="small" effect="dark">
+                  {{ item.title === "" ? "鏆傛棤鏁版嵁" : item.title }}
+                </el-tag>
+                <div class="desc">
+                  {{
+                    item.desc === ""
+                      ? "鏆傛棤鏁版嵁"
+                      : item.desc
+                  }}
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="bot-right">
+            <div class="part-title">鎺ㄨ崘绠楁硶</div>
+            <div class="item-zone">
+              <div
+                class="item"
+                v-for="(item, index) in otherProducts"
+                :key="index"
+              >
+                <el-tag type="info" color="inherit" size="small">{{
+                  item.productTypeName === ""
+                    ? "鏆傛棤鏁版嵁"
+                    : item.productTypeName
+                }}</el-tag>
+                <div class="icon">
+                  <img
+                    v-if="item.iconBlob"
+                    class="baseImg"
+                    :src="
+                      item.iconBlob.indexOf(',') > 0
+                        ? item.iconBlob
+                        : `data:image/png;base64,${item.iconBlob}`
+                    "
+                    alt
+                  />
+
+                <div class="icon-name">
+                  <el-tooltip class="" effect="dark" :content="item.name === '' ? '鏆傛棤鏁版嵁':item.name" placement="top-start">
+                  <span>{{ item.name === "" ? "鏆傛棤鏁版嵁" : item.name }}</span>
+                </el-tooltip>
+                  </div>
+                  
+                </div>
+                <div class="look-button">
+                  <el-button type="primary" size="mini" @click="checkInWindow(item)">鏌ョ湅</el-button>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </el-dialog>
+    <el-dialog 
+    :visible.sync="showActivateSuccess"
+    title="婵�娲绘垚鍔燂紒"
+  width="30%"
+  class="active-Dial"
+  :before-close="handleClose"
+    >
+      <div class="dialog-active">
+        <ul class="desc">
+          <li>
+            <label>婵�娲荤爜:</label>
+            <span>{{ activedSdkOrApp.activateCode }}</span>
+          </li>
+          <li>
+            <label>浜у搧鍚嶇О:</label>
+            <span>{{ activedSdkOrApp.productName }}</span>
+          </li>
+          <li>
+            <label>閰嶇疆璇︽儏:</label>
+            <span>{{ activedSdkOrApp.setting }}</span>
+          </li>
+          <li>
+            <label>鏈嶅姟鍒版湡鏃�:</label>
+            <span>{{ activedSdkOrApp.expireTime }}</span>
+          </li>
+          <li>
+            <label>璁稿彲璇�:</label>
+            <span>{{ activedSdkOrApp.licence }}</span>
+          </li>
+        </ul>
+        <div class="text-right">
+          <el-button type="primary" @click="checkMyAlgorith"
+            >纭畾</el-button
+          >
+          <p class="tip">鎻愮ず锛氳鍦ㄢ�滃凡婵�娲烩�濅腑鏌ョ湅骞跺畨瑁呯畻娉�</p>
+        </div>
+      </div>
+    </el-dialog>
   </div>
 </template>
 <script>
-
 import {
   findAllSdk,
-  findAll,
-  addTaskSdk,
-  delTaskSdk,
-  deleteTask,
-  updateTaskStatus,
-  updateTaskName,
-  getSdkArgs,
-  saveTaskSdkRule,
-  addTask,
-  getRulesByTaskSdk,
-  deleteTaskSdkRule,
-  findByType,
-  getTagList,
   downloadSdk,
   installSdk,
-  getInstallInfo
+  getInstallInfo,
+  removeSdk,
 } from "./api";
-import { getApps, installApp, removeApp, getUnActivedSdk, actPageAlg, getUnActivedApp, actApp } from "@/api/app";
+import {
+  getApps,
+  installApp,
+  getAppDetail,
+  removeApp,
+  getUnActivedSdk,
+  actPageAlg,
+  getUnActivedApp,
+  actApp,
+} from "@/api/app";
 
+import bus from '@/plugin/bus'
 import FileUploader from "@/components/subComponents/FileUpload/index";
-import TaskManage from "@/Pool/TaskMange";
-import VideoManageData from "@/Pool/VideoManageData";
 export default {
   name: "algorithmManage",
   props: {},
   components: {
-    FileUploader
+    FileUploader,
   },
   computed: {
-    notInstalledList () {
-      return this.TaskMange.list1.filter(sdk => {
-        return sdk.installed === false;
-      });
+    updateNum() {
+      return this.hasNewVersionApp.length + this.hasNewVersionSdk.length;
     },
-    installedList () {
-      return this.TaskMange.list1.filter(sdk => {
-        return sdk.installed === true;
-      });
-    },
-    ungradeList () {
-      // 鍗囩骇澶勭悊浼氬鑷撮噸澶嶇殑key,闇�瑕佷慨鏀�
-      //return [];
-      return this.TaskMange.list1.filter(sdk => {
-        return sdk.isUpgrade === true;
-      });
-    },
-    isAdmin () {
+    // notInstalledList () {
+    //   return this.sdkList.filter(sdk => {
+    //     return sdk.installed === false;
+    //   });
+    // },
+    // installedList () {
+    //   return this.sdkList.filter(sdk => {
+    //     return sdk.installed === true && !sdk.isUpgrade;
+    //   });
+    // },
+    // ungradeList () {
+    //   // 鍗囩骇澶勭悊浼氬鑷撮噸澶嶇殑key,闇�瑕佷慨鏀�
+    //   let arr = this.sdkList.filter(sdk => {
+    //     return sdk.isUpgrade === true;
+    //   });
+    //   arr.forEach(sdk => {
+    //     sdk.upgradeLoading = false;
+    //   });
+    //   return arr;
+    // },
+    isAdmin() {
       if (
         sessionStorage.getItem("userInfo") &&
         sessionStorage.getItem("userInfo") !== ""
@@ -497,1080 +1059,712 @@
       return false;
     },
   },
-  data () {
+  data() {
     return {
-      TaskMange: new TaskManage,
-      VideoManageData: new VideoManageData,
+      sdkList: [],
+      installedList: [],
+      hasNewVersionSdk: [],
+      hasNewVersionApp: [],
+      notInstalledList: [],
       buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
       activeName: "myAlgorithm",
       patchUpdateStatus: "",
-      dragging: false,
-      list1: [
-        {
-          sdk_name: "浜鸿劯鎻愬彇"
-        }
-      ],
-      list2: [
-        {
-          id: "001",
-          name: "浠诲姟1",
-          child: [
-            {
-              id: "1",
-              sdk_name: "浜鸿劯妫�娴�",
-              isSelect: false
-            },
-            {
-              id: "2",
-              sdk_name: "浜鸿劯瀵规瘮",
-              isSelect: false
-            }
-          ],
-          isSetting: false,
-          isShowSetAlgo: false
-        }
-      ],
-      argsList: [],
-      baseObject: {
-        id: "",
-        algoId: "",
-        options1: [],
-        options2: [],
-        options3: [],
-        value1: "",
-        value2: "",
-        value3: "",
-        unit: ""
-      },
-      currentAlgoId: "",
-      currentTaskId: "",
-      isSuperUser: false,
       downloadItem: "",
       downloading: false,
-      sceneDialogVisible: false,
-      dialogTitle: '',
       direction: "rtl",
-      actDrawerShow: false,
       actStep: 0,
+      showActivateSuccess:false,
       activeCode: "",
-      sceneTemplates: [],
-      appSceneForm: {
-        id: "",
-        name: "",
-        desc: "",
-        rules: "",
-        txt: ""
-      },
-      sceneSdks: [],
-      sceneRuleList: "",
       isInstall: false,
       installDialogVisible: false,
       installPackage: {},
       installAppPackage: null,
       installSdkPackage: null,
+      isActive:true,
+      isDefaultApp:false,
       installPercentage: 0,
       unActivedSDKList: [],
       unActivedAppList: [],
+      isSDKDialog:true,
       //actSdkId: '',
-      actType: '',
-      actId: '',
+      actType: "",
+      actId: "",
       activedSdkOrApp: {
-        activateCode: '',
-        productName: '',
-        setting: '',
-        expireTime: '',
-        licence: '',
-        devIds: ''
+        activateCode: "",
+        productName: "",
+        setting: "",
+        expireTime: "",
+        licence: "",
+        devIds: "",
       },
       // unloadLoading: false,
       // installLoading: false,
       installedApps: [],
       storeApps: [],
-      installFile: {}
-    }
-  },
-  watch: {
-    list2: {
-      handler (newVal, oldVal) {
-        // window.console.log(newVal, oldVal, '鐩戝惉list2')
-        if (newVal !== oldVal) {
-          // window.console.log(newVal, '鐩戝惉list2')
-          newVal.map((i, index) => {
-            i.child.map(j => {
-              this.$set(j, "parentId", i.id);
-            });
-          });
-        }
-      },
-      deep: true
-    }
+      installFile: {},
+      freshTimer: null,
+      appUpgreading: true,
+      sdkUpgreading: true,
+      autoRefresh: true,
+      curCheckTarget: {},
+      productDetailVisible: false,
+      isUpgrading: false,
+      productDetail: {},
+      otherProducts: [],
+      backStack: [],
+      forwardStack: [],
+      backDisable:true,
+      forwardDisable:true,
+      showInputCode:false,
+      needToUpgradeInWin:false,
+      errMsg:"",
+      showInstallNotActive:false
+    };
   },
   directives: {
     focus: {
       inserted: function (el) {
         el.querySelector("input").focus();
-      }
-    }
+      },
+    },
   },
-  mounted () {
-    this.getAllApps();
-    this.findAllSdk();
-    this.findByType();
-    this.getBaseList();
-    this.findAll();
+
+  mounted() {
+    // 鑾峰彇鎵�鏈夊簲鐢�
+    this.autoRefreshAppAndSdkState();
+
     this.getUnActivedList();
     this.getUnActivedAppList();
-    // this.TaskMange.findAllSdk();
-    // this.TaskMange.findByType();
-    this.VideoManageData.init();
+    
+  },
+  beforeDestroy() {
+    this.autoRefresh = false;
   },
   methods: {
-    isShow (authority) {
-      return this.isAdmin || this.buttonAuthority.indexOf("," + authority + ",") > -1
+    isShow(authority) {
+      return (
+        this.isAdmin || this.buttonAuthority.indexOf("," + authority + ",") > -1
+      );
+    },
+    batchUpdate(type) {
+      if (type == "sdk") {
+        this.hasNewVersionSdk.forEach((sdk) => {
+          this.donwload(sdk,0);
+        });
+      } else {
+        this.hasNewVersionApp.forEach((app) => {
+          this.downloadApp(app, "upgrade");
+        });
+      }
+    },
+    closeDial(){
+      this.productDetailVisible = false
+      this.productDetail = {}
+      this.otherProducts = []
+    },
+    checkDetail(item,type) {
+      if (type =='inactive') {
+        this.isActive =false
+         this.showInstallNotActive = false
+        this.showInputCode = false
+      }else if (type =='active'){
+        this.showInputCode = false
+         this.showInstallNotActive = false
+         this.isActive =true
+      }else if (type =='activeNotInstall'){
+        this.showInputCode = false
+         this.isActive =false
+         this.showInstallNotActive = true
+      }
+      this.checkIsDefOrNot(item.id)
+        this.needToUpgradeInWin = item.isUpgrade?true:false
+      this.resetStack()
+      if (item.sdk_type===undefined) {
+       this.isSDKDialog=false
+      }else{
+       this.isSDKDialog=true
+      }
+      this.productDetailVisible = true;
+      let _this = this;
+      getAppDetail({ id: item.id }).then((res) => {
+        _this.productDetail = res.data.detail;
+        _this.productDetail.isUpgrade = item.isUpgrade
+        _this.productDetail.iconBlob = item.iconBlob
+
+        _this.otherProducts = res.data.randoms;
+
+      });
+    },
+    resetStack(){
+      this.forwardStack = []
+       this.backStack = []
+       this.backDisable = true
+       this.forwardDisable = true
+
+    },
+    checkInWindow(item){
+      this.backStack.push([this.productDetail, this.otherProducts])
+      this.backDisable = false
+      this.checkIsDefOrNot(item.id)
+
+      let _this = this;
+      getAppDetail({ id: item.id }).then((res) => {
+        _this.productDetail = res.data.detail;
+        _this.productDetail.iconBlob = item.iconBlob
+        this.actId = _this.productDetail.productBaseId
+        let flag=false
+       const allNeedToNew = [...this.hasNewVersionSdk,...this.hasNewVersionApp]
+        for (let i = 0; i < allNeedToNew.length; i++) {
+          const item = allNeedToNew[i];
+          if (item.id == _this.productDetail.productBaseId) {
+            flag=true
+          }
+        }
+        this.needToUpgradeInWin = flag
+          _this.productDetail.isUpgrade = flag
+
+        _this.otherProducts = res.data.randoms;
+      });
+    },
+    checkIsDefOrNot(id){
+      if (id.length>10) {
+        this.isDefaultApp=false
+      }else {
+        this.isDefaultApp=true
+      }
+    },
+    backwards(){
+      if (this.backStack.length ==0) {
+        this.backDisable = true
+      return
+      }
+
+   this.forwardStack.push([this.productDetail,this.otherProducts])
+   let item = this.backStack.pop()
+   this.productDetail =  item[0]
+   this.checkIsDefOrNot(this.productDetail.productBaseId) 
+   this.otherProducts = item[1]
+  this.forwardDisable=false
+ if (this.backStack.length ==0) {
+        this.backDisable = true
+      
+      }
+    },
+    forwards(){
+      if(this.forwardStack.length==0){
+        this.forwardDisable=true
+        return
+      }
+
+        this.backStack.push([this.productDetail,this.otherProducts])
+        this.backDisable=false
+        let item = this.forwardStack.pop()
+
+        this.productDetail = item[0]
+        this.otherProducts = item[1]
+      if (this.forwardStack.length==0) {
+        this.forwardDisable=true
+      }
+      
     },
     //绂荤嚎瀹夎
-    offlineInstall () {
+    offlineInstall() {
       this.installDialogVisible = false;
       this.isInstall = true;
       //瀹夎
-      installSdk(this.installFile).then(res => {
-        debugger
-        if (res.success) {
+      installSdk(this.installFile)
+        .then((res) => {
+          if (res.success) {
+            this.isInstall = false;
+            this.$message({
+              type: "success",
+              message: '瀹夎鎴愬姛,灏嗚烦杞嚦"宸叉縺娲�"涓煡鐪�',
+            });
+            setTimeout(() => {
+              this.getAllSdk();
+              window.parent.postMessage(
+                {
+                  msg: "AppUpdate",
+                },
+                "*"
+              );
+              this.activeName = "myAlgorithm";
+            }, 3000);
+          }
+        })
+        .catch((e) => {
           this.isInstall = false;
           this.$message({
-            type: 'success',
-            message: '瀹夎鎴愬姛,灏嗚烦杞嚦鎴戠殑绠楁硶涓煡鐪�'
+            type: "error",
+            message: e.data,
           });
-          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') {
+
+    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 => {
+      installApp({ path: app.id })
+        .then((res) => {
+          if (res && res.success) {
+            _this.$notify({
+               title: "鎴愬姛",
+               message: "瀹夎搴旂敤鎴愬姛",
+               type: "success",
+             });
+            setTimeout(() => {
+              if (action == "upgrade") {
+                app.upgradeLoading = false;
+              } else {
+                app.installLoading = false;
+              }
+              // _this.getAllApps();
+              window.parent.postMessage(
+                {
+                  msg: "AppUpdate",
+                },
+                "*"
+              );
+            }, 3000);
+          }else {
+        
+          }
+        })
+        .catch((e) => {
+            _this.$notify({
+              title: "瀹夎澶辫触",
+              message: e.data,
+              type: "warning",
+            });
+          if (action == "upgrade") {
+            app.upgradeLoading = false;
+          } else {
+            app.installLoading = false;
+          }
+        });
 
-        if (res && res.success) {
-          setTimeout(() => {
-            app.unloadLoading = false;
-            _this.getAllApps();
-            window.parent.postMessage({
-              msg: "AppUpdate"
-            }, '*')
-          }, 3000);
-        }
-      }).catch(e => {
-        console.log(e);
-        app.unloadLoading = false;
-      })
+      // 寮�鍚嚜鍔ㄥ埛鏂�
+      this.appUpgreading = true;
+    },
+    async getAllApps() {
+      let iArry = [];
+      let sArry = [];
+      let nArry = [];
+      let rsp = await getApps();
+      if (rsp && rsp.success) {
+        // 閬嶅巻app鐨勮繃绋嬮噸缃�
+        this.appUpgreading = 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: ''
+        rsp.data.forEach((item) => {
+          let obj = Object.assign(
+            { unloadLoading: false, upgradeLoading: false },
+            item
+          );
+          if (obj.progressMsg !== "" && obj.progressMsg !== "宸插畨瑁�") {
+            obj.upgradeLoading = true;
+
+            this.appUpgreading = true;
+          }
+          item.installed ? iArry.push(obj) : sArry.push(obj);
+          item.isUpgrade && nArry.push(obj);
+        });
       }
+      this.installedApps = iArry;
+      this.storeApps = sArry;
+      this.hasNewVersionApp = nArry;
     },
-    getUnActivedList () {
-      getUnActivedSdk().then(res => {
+
+    //鍗歌浇
+    unLoad(app) {
+      let _this = this;
+      this.$confirm("纭畾瑕佸嵏杞借搴旂敤鍚�?", "鎻愮ず")
+        .then(() => {
+      _this.productDetailVisible = false
+
+          app.unloadLoading = true;
+          removeApp({ appId: app.id })
+            .then((res) => {
+              if (res && res.success) {
+                app.unloadLoading = false;
+                _this.getAllApps();
+                window.parent.postMessage(
+                  {
+                    msg: "AppUpdate",
+                  },
+                  "*"
+                );
+                _this.$notify({
+                  title: "鎴愬姛",
+                  message: "鍗歌浇搴旂敤鎴愬姛",
+                  type: "success",
+                });
+              }
+            })
+            .catch((e) => {
+              console.log(e);
+              app.unloadLoading = false;
+            });
+        })
+        .catch((e) => {
+          console.log(e);
+        });
+    },
+
+    actSdkOrApp(item, type = "sdk") {
+      this.checkDetail(item, 'inactive')
+      this.actType = type;
+      this.actId = item.id;
+      this.actStep = 0;
+      this.activeCode = "";
+      this.activedSdkOrApp = this.newActInfo();
+    },
+
+    cancelActivate(){
+      this.showInputCode= false
+      this.activeCode = ""
+    },
+    newActInfo() {
+      return {
+        activateCode: "",
+        productName: "",
+        setting: "",
+        expireTime: "",
+        licence: "",
+        devIds: "",
+      };
+    },
+    getUnActivedList() {
+      getUnActivedSdk().then((res) => {
         if (res.code == 200) {
           this.unActivedSDKList = res.data;
         }
-      })
-
+      });
     },
-    getUnActivedAppList () {
-      getUnActivedApp().then(res => {
+    getUnActivedAppList() {
+      getUnActivedApp().then((res) => {
         if (res.code == 200) {
           this.unActivedAppList = res.data;
         }
       });
     },
-
-    installFormat (percentage) {
-      return percentage === 100 ? '瀹夎鎴愬姛' : `${percentage}%`;
-    },
-    actived () {
+    actived() {
       let _this = this;
-      if (this.actType == 'sdk') {
+      if (this.activeCode.trim()=="") {
+        this.$notify({
+          type: "error",
+          message: "婵�娲荤爜涓嶈兘涓虹┖",
+        });
+        return
+      }
+      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') {
+        actPageAlg(this.actId, this.activeCode)
+          .then((res) => {
+            if (res.data.isSuccess) {
+              this.productDetailVisible = false
+              _this.activedSdkOrApp = res.data.successMsg;
+              this.showActivateSuccess=true
+              _this.actStep++;
+              _this.getUnActivedList();
+              _this.getAllSdk();
+            } 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)
-        });
+        actApp(this.actId, this.activeCode)
+          .then((res) => {
+            if (res.data.isSuccess) {
+              this.productDetailVisible = false
+              _this.activedSdkOrApp = res.data.successMsg;
+              this.showActivateSuccess=true
+              _this.actStep++;
+              _this.getUnActivedAppList();
+              _this.getAllApps();
+            } else {
+              _this.$notify({
+                type: "error",
+                message: res.data.failMsg.failMsg,
+              });
+            }
+          })
+          .catch((e) => {
+            console.log(e);
+          });
       }
     },
-    getCodeDetail () { },
-    checkMyAlgorith () {
-      this.actDrawerShow = false;
+    getCodeDetail() {},
+    checkMyAlgorith() {
+      this.showActivateSuccess = 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
+      getInstallInfo(file)
+        .then((res) => {
+          _this.installFile = file;
+          if (res.success) {
+            _this.installDialogVisible = true;
+            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,
+              };
             }
           }
-          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
+        })
+        .catch((e) => {
+          this.$message({
+            type: "error",
+            message: e.data,
+          });
         });
-      })
-      // this.$msgbox({
-      //     title: '绠楁硶淇℃伅',
-      //     message: h('div', null, [
-      //       h('span', null, '绠楁硶鍚嶇О锛� '),
-      //       h('i', { style: 'color: teal' }, file.filename)
-      //     ]),
-      //     showCancelButton: true,
-      //     confirmButtonText: '纭畾',
-      //     cancelButtonText: '鍙栨秷',
-      //     beforeClose: (action, instance, done) => {
-      //       if (action === 'confirm') {
-      //         instance.confirmButtonLoading = true;
-      //         instance.confirmButtonText = '鎵ц涓�...';
-      //         setTimeout(() => {
-      //           done();
-      //           setTimeout(() => {
-      //             instance.confirmButtonLoading = false;
-      //           }, 300);
-      //         }, 3000);
-      //       } else {
-      //         done();
-      //       }
-      //     }
-      //   }).then(action => {
-      //     this.$message({
-      //       type: 'info',
-      //       message: 'action: ' + action
-      //     });
-      //   });
-
-
-
+    },
+    openApp(){
+      let message = 'toOpenApp?' + this.productDetail.productBaseId;
+      window.parent.postMessage({
+        msg: message
+      }, "*")
     },
 
-    onFileAdded (f) {
-      ;
+    onFileAdded(f) {
       this.patchUpdateStatus = "";
     },
-    // 鏍¢獙杈撳叆鐨勬槸鍚︽槸鏁板瓧
-    valiNum (value) {
-      if (value) {
-        let re = /[^\-?\d.]*$/;
-        if (!re.test(value)) {
-          // this.$toast({
-          //   type: "warning",
-          //   message: "璇疯緭鍏ユ暟瀛楋紒"
-          // });
-          this.$notify({
-            title: "鎻愮ず",
-            message: "璇疯緭鍏ユ暟瀛楋紒",
-            type: "warning"
-          });
-        }
-      }
-    },
-    // 宸﹁竟鎷栧姩妯″潡寰楁嫋鍔ㄧ粨鏉熷悗鐨勮Е鍙戝嚱鏁�
-    endLeft (env) {
-      this.dragging = false;
-      let taskId = env.to.id;
-      let sdkId = this.TaskMange.list1[env.oldIndex].id;
-      if (!taskId.length || !sdkId.length) {
-        return;
-      }
-      // 鑾峰彇鍒拌浠诲姟鎵�鍦ㄧ殑鍏冪礌
-      let task = this.TaskMange.list2.find(i => {
-        return i.id === taskId;
-      });
-      let arr = task.child.filter(i => {
-        return i.id === sdkId;
-      });
-      // window.console.log(task, "鎷栬繘鏉ョ殑浠诲姟淇℃伅", sdkId, arr);
-      if (arr && arr.length >= 2) {
-        // this.$toast({
-        //   type: "warning",
-        //   message: "璇ョ畻娉曞凡瀛樺湪锛�"
-        // });
-        this.$notify({
-          title: "鎻愮ず",
-          message: "璇ョ畻娉曞凡瀛樺湪锛�",
-          type: "warning"
-        });
-        task.child.splice(env.newIndex, 1);
-        return true;
-      }
-      let list = task.child.map((i, index) => {
-        let obj = {};
-        obj.sdkId = i.id;
-        obj.sort = index + 1;
-        return obj;
-      });
-      let json = {
-        taskId: taskId,
-        sdks: list
-      };
-      this.addTaskSdk(json);
-    },
-    // 鍙宠竟鎷栧姩妯″潡寮�濮嬫嫋鍔ㄨЕ鍙戝嚱鏁�
-    startRight (env) {
-      this.$nextTick(() => {
-        this.dragging = true;
-      });
-      // window.window.console.log(env, "right start");
-    },
-    // 鍙宠竟鎷栧姩妯″潡鎷栧姩缁撴潫瑙﹀彂鍑芥暟
-    endRight (env) {
-      // window.window.console.log(env, "right end");
-    },
-    clickSet (data) {
-      if (data.isSetting) {
-        data.isSetting = false;
-      } else {
-        data.isSetting = true;
-      }
-    },
-    clickDel (data, Index) {
-      this.$confirm("鎻愮ず锛氬垹闄ゅ悗锛屾浠诲姟鍦ㄦ憚鍍忔満涓殑搴旂敤澶辨晥锛屾槸鍚﹀垹闄わ紵", {
-        center: true,
-        showConfirmButton: true,
-        showCancelButton: true,
-        confirmButtonClass: "comfirm-class-sure",
-        cancelButtonClass: "comfirm-class-cancle"
-      })
-        .then(() => {
-          this.deleteTask(data);
-        })
-        .catch(err => { });
-    },
-    clickSetAlgo (row, data) {
-      // window.console.log(row, data, "缂栬緫浠诲姟涓煇涓�涓畻娉�");
-      if (row.isShowSetAlgo && data.id === this.TaskMange.currentAlgoId) {
-        row.isShowSetAlgo = false;
-        data.isSelect = false;
-        return false;
-      }
-      if (data.id !== this.TaskMange.currentAlgoId) {
-        let isEdit = false;
-        if (this.argsList && this.argsList.length !== 0) {
-          this.TaskMange.argsList.map((i, index) => {
-            if (i.value2 !== this.argsList[index].value2) {
-              isEdit = true;
-            }
-            if (i.value3 !== this.argsList[index].value3) {
-              isEdit = true;
-            }
-          });
-        }
-        if (isEdit) {
-          this.$notify({
-            title: "鎻愮ず",
-            message: "璇峰厛淇濆瓨鏈繚瀛樼殑閰嶇疆锛�",
-            type: "warning"
-          });
-          return false;
-        } else {
-          let task = this.TaskMange.list2.find(element => {
-            return element.isShowSetAlgo;
-          });
-          // console.log(task, '鏄惁鏈夊凡缁忔墦寮�缂栬緫鐨�')
-          if (task !== undefined) {
-            this.$set(task, "isShowSetAlgo", false);
-            task.child.map(i => {
-              this.$set(i, "isSelect", false);
-            });
-          }
-        }
-      }
-      this.TaskMange.currentAlgoId = data.id;
-      this.TaskMange.currentTaskId = row.id;
-      let task = this.TaskMange.list2.find(element => {
-        return element.isShowSetAlgo;
-      });
-      if (task === undefined) {
-        this.getSdkArgs(data).then(() => {
-          this.getRulesByTaskSdk(row.id, data.id);
-        });
-        if (row.isShowSetAlgo) {
-          row.isShowSetAlgo = false;
-        } else {
-          row.isShowSetAlgo = true;
-          data.isSelect = true;
-        }
-      } else {
-        // this.$toast({
-        //   type: "warning",
-        //   message: "璇峰厛淇濆瓨鏈繚瀛樼殑閰嶇疆锛�"
-        // });
-        // this.$notify({
-        //   title: "鎻愮ず",
-        //   message: "璇峰厛淇濆瓨鏈繚瀛樼殑閰嶇疆锛�",
-        //   type: "warning"
-        // });
-      }
-    },
-    async getRulesByTaskSdk (taskId, sdkId) {
-      let res = await getRulesByTaskSdk({
-        taskId: taskId,
-        sdkId: sdkId
-      });
-      if (res && res.success) {
-        if (res.data.rules && res.data.rules.length !== 0) {
-          this.TaskMange.argsList = res.data.rules.map((i, index) => {
-            let sdk = res.data.argList.find(j => {
-              return j.alias === i.sdk_arg_alias;
-            });
-            let obj = JSON.parse(JSON.stringify(this.TaskMange.baseObject));
-            obj.value1 = i.sdk_arg_alias ? i.sdk_arg_alias : "";
-            obj.value2 = i.operator ? i.operator : "";
-            obj.value3 = i.sdk_arg_value ? i.sdk_arg_value : "";
-            obj.unit = sdk.unit ? sdk.unit : "";
-            obj.id = i.Id ? i.Id : "";
-            obj.algoId = sdkId;
-            return obj;
-          });
-        } else {
-          this.TaskMange.argsList = res.data.argList.map(i => {
-            let obj = JSON.parse(JSON.stringify(this.TaskMange.baseObject));
-            obj.value1 = i.alias ? i.alias : "";
-            obj.value2 = i.default_operator ? i.default_operator : "";
-            obj.value3 = i.default_value ? i.default_value : "";
-            obj.unit = i.unit ? i.unit : "";
-            obj.id = "";
-            obj.algoId = sdkId;
-            return obj;
-          });
-        }
-        // window.console.log(res, '鏌ユ壘绠楁硶瑙勫垯', this.argsList)
-        this.argsList = JSON.parse(JSON.stringify(this.TaskMange.argsList));
-      }
-    },
-    async findAllSdk () {
+
+    async getAllSdk() {
+      let installedList = [];
+      let unInstalledList = [];
+      let hasNewVersionList = [];
       let res = await findAllSdk();
       if (res && res.success) {
-        this.TaskMange.list1 = res.data.map((i, index) => {
-          this.$set(i, "isEdit", false);
-          //mock 鏈畨瑁�/寰呭崌绾�
-          // if (index == 1 || index == 2) {
-          //   this.$set(i, "isUpgrade", true);
-          // }
-          // if (index == 3 || index == 4) {
-          //   this.$set(i, "installed", false);
-          // }
-          //mock end
-          return i;
-        });
-      }
-    },
-    addTask () {
-      let obj = {
-        id: "",
-        name: "浠诲姟" + this.TaskMange.list2.length,
-        child: [],
-        isSetting: false,
-        isShowSetAlgo: false
-      };
-      // window.console.log(this.TaskMange.list2, "addTask");
-      this.TaskMange.list2.push(obj);
-      this.addTaskAsync(obj.name);
-      this.$nextTick(() => {
-        let taskArea = document.getElementById("taskArea");
-        taskArea.scrollTop = taskArea.scrollHeight;
-      });
-    },
-    async findAll () {
-      let res = await findAll();
-      if (res && res.success) {
-        if (res.data && res.data.length !== 0) {
-          let list = res.data.map(i => {
-            let obj = {};
-            obj.id = i.task.taskid;
-            obj.name = i.task.taskname;
-            obj.enable = i.task.enable;
-            obj.is_alarm = i.task.is_alarm;
-            obj.child = [];
-            if (i.sdks && i.sdks.length !== 0) {
-              obj.child = i.sdks.map(j => {
-                let t = {};
-                t.id = j.id;
-                t.ipc_id = j.ipc_id;
-                if (i.sdks.length == 1) {
-                  t.sdk_name = i.task.taskname;
-                  // console.log("鍗曚釜sdk绠楁硶锛�",t.sdk_name)
-                } else {
-                  t.sdk_name = j.sdk_name;
-                  // console.log("澶氫釜sdk绠楁硶锛�",t.sdk_name)
-                }
-                t.icon = j.icon;
-                t.enable = j.enable;
-                t.isSelect = false;
-                return t;
-              });
-            }
-            obj.isSetting = false;
-            obj.isShowSetAlgo = false;
-            return obj;
-          });
-          this.TaskMange.list2 = list;
-        }
-      }
-    },
-    clickDelSdk (task, sdk) {
-      this.$confirm(
-        "鎻愮ず锛氬垹闄ゅ悗锛屾绠楁硶鍦ㄦ湰浠诲姟涓Щ闄わ紝鍚屾椂鍦ㄦ憚鍍忔満涓殑搴旂敤澶辨晥锛屾槸鍚﹀垹闄わ紵",
-        {
-          center: true,
-          showConfirmButton: true,
-          showCancelButton: true,
-          confirmButtonClass: "comfirm-class-sure",
-          cancelButtonClass: "comfirm-class-cancle"
-        }
-      )
-        .then(() => {
-          this.delTaskSdk(task, sdk);
-        })
-        .catch(err => { });
-    },
-    selectChange (event, type, data) {
-      if (type === "options1") {
-        // window.window.console.log(type, data, "閫夋嫨涓嬫媺妗�");
-        data.options1.map(i => {
-          if (i.value === data.value1) {
-            this.$set(data, "unit", i.unit ? i.unit : "");
+        this.sdkUpgreading = false;
+
+        res.data.forEach((item) => {
+          let obj = Object.assign(
+            { unloadLoading: false, upgradeLoading: false },
+            item
+          );
+          if (obj.progressMsg !== "" && obj.progressMsg !== "宸插畨瑁�") {
+            obj.upgradeLoading = true;
+
+            this.sdkUpgreading = true;
           }
+
+          //绠楁硶杞欢 宸插畨瑁呭叾涓寘鍚緟鍗囩骇 鏈畨瑁�
+          item.installed ? installedList.push(obj) : unInstalledList.push(obj);
+          item.isUpgrade ? hasNewVersionList.push(obj): null
         });
       }
+      this.installedList = installedList;
+      this.notInstalledList = unInstalledList;
+      this.hasNewVersionSdk = hasNewVersionList;
     },
-    // 鍒犻櫎浠诲姟绠楁硶
-    async delTaskSdk (task, sdk) {
-      let json = {
-        taskId: task.id,
-        sdkId: sdk.id
-      };
-      let res = await delTaskSdk(json);
-      if (res && res.success) {
-        // this.$toast({
-        //   type: "success",
-        //   message: "鍒犻櫎浠诲姟绠楁硶鎴愬姛!"
-        // });
+    unloadSDKinWin(){
+
+      let appToUnload
+      let sdkToUnload
+      if (this.productDetail.productTypeName=="搴旂敤") {
+        appToUnload= this.installedApps.find((item)=>{
+          return item.id == this.productDetail.productBaseId
+        })
+        this.unLoad(appToUnload)
+      }else{
+          sdkToUnload= this.installedList.find((item)=>{
+          return item.id == this.productDetail.productBaseId
+        })
+        this.unLoadSdk(sdkToUnload)
+      }
+    },
+    //鍗歌浇绠楁硶
+    unLoadSdk(sdk) {
+      let _this = this;
+      this.$confirm("纭畾瑕佸嵏杞借绠楁硶鍚�?", "鎻愮ず")
+        .then(() => {
+      _this.productDetailVisible = false
+          sdk.unloadLoading = true;
+          removeSdk({ sdkId: sdk.id })
+            .then((res) => {
+              if (res && res.success) {
+                sdk.unloadLoading = false;
+                this.$notify({
+                title: "鎴愬姛",
+                message: "鍗歌浇瀹屾垚",
+                type: "success",
+              });
+                _this.getAllSdk();
+                window.parent.postMessage(
+                  {
+                    msg: "AppUpdate",
+                  },
+                  "*"
+                );
+              }
+            })
+            .catch((e) => {
+              console.log(e);
+              sdk.unloadLoading = false;
+            });
+        })
+        .catch((e) => {
+          console.log(e);
+        });
+    },
+    upgradeSDKinWin(){
+
+      this.isUpgrading = !this.isUpgrading;
+
+      let _this = this;
+      if (this.productDetail.productTypeName=="搴旂敤") {
+      installApp({ path: this.productDetail.productBaseId})
+        .then((res) => {
+          if (res && res.success) {
+         this.$notify({
+          title: "鎴愬姛",
+          message: "鍗囩骇瀹屾垚",
+          type: "success",
+        });
+        this.needToUpgradeInWin=false
+        this.productDetail.isUpgrade = false
+        this.isUpgrading = !this.isUpgrading;
+        
+          }
+        })
+        .catch((e) => {
+            _this.$notify({
+              title: "鍗囩骇澶辫触",
+              message: e.data,
+              type: "warning",
+            });
+             this.isUpgrading = !this.isUpgrading;
+        });
+
+      // 寮�鍚嚜鍔ㄥ埛鏂�
+      this.appUpgreading = true;
+      }else{
+        downloadSdk({path:this.productDetail.productBaseId}).then((res)=>{
+          this.needToUpgradeInWin=false
+        this.productDetail.isUpgrade = false
+        this.isUpgrading = !this.isUpgrading;
         this.$notify({
           title: "鎴愬姛",
-          message: "鍒犻櫎浠诲姟绠楁硶鎴愬姛!",
-          type: "success"
+          message: "鍗囩骇瀹屾垚",
+          type: "success",
         });
-        this.findAll();
+      }).catch((err)=>{
+        this.$notify({
+          title: "鍗囩骇澶辫触",
+          message: err.data,
+          type: "warning",
+        });
+        this.isUpgrading = !this.isUpgrading;
+      })
+      this.sdkUpgreading = true;
       }
-    },
-    // 鍒犻櫎浠诲姟
-    async deleteTask (data, index) {
-      // window.console.log(data, "deleteTask");
-      let res = await deleteTask({ taskId: data.id });
-      // this.$toast({
-      //   type: res.success ? "success" : "error",
-      //   message: res.msg
-      // });
-      this.$notify({
-        title: res.success ? "鎴愬姛" : "澶辫触",
-        message: res.msg,
-        type: res.success ? "success" : "error"
-      });
-      if (data.id && res.success) {
-        this.findAll();
-      }
-    },
-    // 鏇存柊浠诲姟鐘舵��
-    async updateTaskStatus (data) {
-      // window.console.log(data, '鏇存柊浠诲姟鐘舵��')
-      let json = {
-        taskId: data.id,
-        enable: data.enable
-      };
-      let res = await updateTaskStatus(json);
-      // this.$toast({
-      //   type: res.success ? "success" : "error",
-      //   message: res.msg
-      // });
-      this.$notify({
-        title: res.success ? "鎴愬姛" : "澶辫触",
-        message: res.msg,
-        type: res.success ? "success" : "error"
-      });
-    },
-    // 鏇存柊浠诲姟鍚嶇О
-    async updateTaskName (data) {
-      let json = {
-        taskId: data.id,
-        taskName: data.name
-      };
-      let res = await updateTaskName(json);
-      // this.$toast({
-      //   type: res.success ? "success" : "error",
-      //   message: res.msg
-      // });
-      this.$notify({
-        title: res.success ? "鎴愬姛" : "澶辫触",
-        message: res.msg,
-        type: res.success ? "success" : "error"
-      });
-      if (res && res.success) {
-        this.$set(data, "isSetting", false);
-      }
-    },
-    // 鑾峰彇搴曞簱鏁版嵁
-    async getBaseList () {
-      // let res = await getTagList();
-      // if (res && res.success) {
-      //   let filter = res.data.filter(i => {
-      //     return i.status === 0;
-      //   });
-      //   let list = filter.map(i => {
-      //     let obj = {};
-      //     obj.id = i.key;
-      //     obj.name = i.title;
-      //     obj.value = i.value;
-      //     return obj;
-      //   });
-      //   list.unshift({
-      //     id: "",
-      //     name: "鍏ㄩ儴搴曞簱",
-      //     value: ""
-      //   })
 
-      //   // this.TaskMange.baseObject.options3 = [...all, ...list];
-      //   this.TaskMange.baseObject.options3 = [...list];
-      // }
 
-      this.TaskMange.baseObject.options3 = [
-        { id: true, name: true, value: true },
-        { id: false, name: false, value: false }
-      ];
+      
     },
-    // 鑾峰彇绠楁硶鍙傛暟
-    async getSdkArgs (data) {
-      let res = await getSdkArgs({
-        sdkId: data.id,
-        scope: "TASKRULE"
-      });
-      if (res && res.success) {
-        // window.console.log(res, "鏌ヨ绠楁硶鍙傛暟");
-        let list = res.data.map(i => {
-          let obj = {};
-          obj.name = i.name;
-          obj.id = i.alias;
-          obj.value = i.alias;
-          obj.unit = i.unit;
-          obj.must = i.must;
-          obj.range = i.range;
-          obj.sort = i.sort;
-          return obj;
-        });
-        this.TaskMange.baseObject.options1 = [...list];
-      }
-    },
-    // 鏌ヨ瀛楀吀
-    async findByType () {
-      let res = await findByType();
-      if (res && res.success) {
-        let list = res.data.RULECOMPUTEBETWEEN.map(i => {
-          let obj = {};
-          obj.name = i.name;
-          obj.value = i.value;
-          return obj;
-        });
-        this.TaskMange.baseObject.options2 = [...list];
-      }
-    },
-    // 绠楁硶閰嶇疆锛屾柊寤�
-    add () {
-      this.TaskMange.argsList.push(
-        JSON.parse(JSON.stringify(this.TaskMange.baseObject))
-      );
-    },
-    // 绠楁硶閰嶇疆 鍒犻櫎
-    delRule (index) {
-      this.TaskMange.argsList.splice(index, 1);
-    },
-    // 绠楁硶鍙傛暟淇濆瓨
-    async save () {
-      let list = this.TaskMange.argsList.map(i => {
-        let obj = {};
-        obj.id = i.id;
-        obj.operator = i.value2;
-        obj.sdk_arg_alias = i.value1;
-        obj.sdk_arg_value = i.value3;
-        return obj;
-      });
-      let json = {
-        rules: list,
-        sdkId: this.TaskMange.currentAlgoId,
-        taskId: this.TaskMange.currentTaskId
-      };
-      let res = await saveTaskSdkRule(json);
-      this.$notify({
-        title: "鎻愮ず",
-        type: res.success ? "success" : "error",
-        message: res.msg
-      });
-      if (res && res.success) {
-        let task = this.TaskMange.list2.find(i => {
-          return i.id === this.TaskMange.currentTaskId;
-        });
-        if (task) {
-          this.$set(task, "isShowSetAlgo", false);
-          this.TaskMange.argsList = [];
-          task.child.map(i => {
-            this.$set(i, "isSelect", false);
-          });
-        }
-      }
-    },
-    getDefault () {
-      this.deleteTaskSdkRule(
-        this.TaskMange.currentTaskId,
-        this.TaskMange.currentAlgoId
-      ).then(() => {
-        this.getRulesByTaskSdk(
-          this.TaskMange.currentTaskId,
-          this.TaskMange.currentAlgoId
-        );
-      });
-    },
-    async deleteTaskSdkRule (taskId, sdkId) {
-      let json = {
-        taskId: taskId,
-        sdkId: sdkId
-      };
-      let res = await deleteTaskSdkRule(json);
-      // this.$toast({
-      //   type: res.success ? "success" : "error",
-      //   message: res.msg
-      // });
-      this.$notify({
-        title: res.success ? "鎴愬姛" : "澶辫触",
-        message: res.msg,
-        type: res.success ? "success" : "error"
-      });
-      if (res && res.success) {
-        // window.console.log(res, "鎭㈠榛樿鍊�");
-      }
-    },
-    // 缁欎换鍔℃坊鍔犵畻娉�
-    async addTaskSdk (data) {
-      let res = await addTaskSdk(data);
-      if (res && res.success) {
-        // window.console.log(res, 'res')
-        this.findAll();
-      }
-    },
-    // 鏂版坊鍔犱换鍔�
-    async addTaskAsync (name) {
-      let res = await addTask({ taskname: name });
-      // this.$toast({
-      //   type: res.success ? "success" : "error",
-      //   message: res.msg
-      // });
-      // window.console.log(res, "addTaskAsync");
-      this.$notify({
-        title: res.success ? "鎴愬姛" : "澶辫触",
-        message: res.msg,
-        type: res.success ? "success" : "error"
-      });
-      if (res && res.success) {
-        this.findAll();
-      }
-    },
-    cancle (row) {
-      if (row.isShowSetAlgo) {
-        row.isShowSetAlgo = false;
-      }
-      this.TaskMange.argsList = [];
-      this.TaskMange.currentAlgoId = "";
-      row.child.map(i => {
-        this.$set(i, "isSelect", false);
-      });
-    },
-    cancleTask (row) {
-      if (row.isSetting) {
-        row.isSetting = false;
-      }
-    },
-    commandAlgo (command, row, item) {
-      if (command === 1) {
-        // console.log('璁剧疆绠楁硶')
-        this.clickSetAlgo(row, item);
-      }
-      if (command === 2) {
-        // console.log('鍒犻櫎绠楁硶')
-        this.clickDelSdk(row, item);
-      }
-    },
-    commandTask (command, row) {
-      if (command === 1) {
-        //缂栬緫浠诲姟
-        this.clickSet(row);
-      }
-    },
-    donwload (item) {
-      this.downloading = true;
-      this.downloadItem = item.id;
-
-      downloadSdk({ path: item.id })
-        .then(rsp => {
+    downloadSdkInSide(){
+      this.downloadItem = this.productDetail.productBaseId;
+      this.isUpgrading = true
+      downloadSdk({ path: this.productDetail.productBaseId })
+        .then((rsp) => {
+          this.productDetailVisible = false
+          this.downloadItem = "";
           this.$notify({
             type: "success",
             message: "绠楁硶宸插畨瑁�"
           });
-          this.downloading = false;
-          this.downloadItem = "";
-          this.findAllSdk();
+      this.isUpgrading=false
         })
-        .catch(err => {
+        .catch((err) => {
           this.$notify({
             type: "warning",
-            message: err.data
+            message: err.data,
           });
+          this.downloadItem = "";
+      this.isUpgrading=false
+        });
+      // 寮�鍚嚜鍔ㄥ埛鏂�
+      this.sdkUpgreading = true;
+    },
+    donwload(item,typ) {
+      item.upgradeLoading = true;
+      this.downloadItem = item.id;
 
-          this.downloading = false;
+      downloadSdk({ path: item.id })
+        .then((rsp) => {
+          item.upgradeLoading = false;
+          //this.downloading = false;
+          this.downloadItem = "";
+          this.$notify({
+            type: "success",
+            message: typ==1? "绠楁硶瀹夎鎴愬姛":"绠楁硶鍗囩骇鎴愬姛"
+          });
+        })
+        .catch((err) => {
+          this.$notify({
+            type: "warning",
+            message: err.data,
+          });
+          item.upgradeLoading = false;
+          //this.downloading = false;
           this.downloadItem = "";
         });
+      // 寮�鍚嚜鍔ㄥ埛鏂�
+      this.sdkUpgreading = true;
     },
-    commandAlgLib (item) {
-      this.$set(item, "isEdit", true);
-    },
-    inputBlur (item) {
-      // console.log(item, '淇敼鍚嶇О')
+    inputBlur(item) {
       this.$set(item, "isEdit", false);
     },
+    handleTabClick() {},
+    autoRefreshAppAndSdkState() {
+      // 鍏抽棴鍚庨��鍑�
+      if (!this.autoRefresh) {
+        return;
+      }
 
-    cleanTemplateForm () {
-      this.appSceneForm.name = "";
-      this.appSceneForm.desc = "";
-      this.appSceneForm.rules = "";
-      this.appSceneForm.txt = "";
+      if (this.appUpgreading) {
+        this.getAllApps();
+      }
 
-      this.$refs.ruleEditor.cleanRule();
+      if (this.sdkUpgreading) {
+        this.getAllSdk();
+      }
+
+      let _this = this;
+      setTimeout(() => {
+        _this.autoRefreshAppAndSdkState();
+      }, 500);
     },
-    handleTabClick () {
-
-    },
-    handleCreateScene () {
-      this.sceneDialogVisible = true;
-      this.dialogTitle = '鍒涘缓鍦烘櫙妯℃澘';
-
-      this.sceneSdks = this.TaskMange.list1.filter(sdk => {
-        return sdk.installed === true;
-      });
-      this.sceneRuleList = "";
-
-      this.$nextTick(() => {
-        this.cleanTemplateForm();
-      });
-    },
-    handleDialogClose () {
-      this.sceneDialogVisible = false;
-    },
-    handleEditScene (item) {
-      this.appSceneForm.name = item.name;
-      this.appSceneForm.desc = item.desc;
-
-      this.sceneSdks = item.sdks;
-      this.sceneRuleList = item.rules;
-      this.sceneDialogVisible = true;
-      this.dialogTitle = '缂栬緫鍦烘櫙妯℃澘';
-    },
-
-
-  }
+  },
 };
 </script>
 <style lang="scss">
@@ -1580,16 +1774,7 @@
   box-sizing: border-box;
   text-align: left;
   min-width: 1106px;
-  // background-color: #f2f6fc;
-  .s-video-manage-breadcrumb {
-    height: 5%;
-    box-sizing: border-box;
-    border: 1px solid #e4e7ed;
-    background-color: rgb(255, 255, 255);
-    -webkit-box-shadow: #e4e7ed 0px 0px 9px inset;
-    box-shadow: #e4e7ed 0px 0px 9px inset;
-    border-radius: 5px;
-  }
+
   .el-tabs {
     height: calc(100% - 50px);
     // margin-top: 5px !important;
@@ -1615,12 +1800,288 @@
     width: 100%;
     height: 100%;
   }
+  .product-detail-dialog {
+    .dialog-title{
+          font-size: 13px;
+
+    }
+    .el-dialog {
+      width: 50%;
+      min-width: 920px;
+      position: relative;
+    }
+    .el-dialog__header {
+      text-align: center;
+          padding: 6px;
+
+      .el-dialog__headerbtn {
+          position: absolute;
+             top: 5px;
+
+          right: 20px;
+          padding: 0;
+          background: transparent;
+          outline: none;
+          cursor: pointer;
+          font-size: 20px;
+      }
+    }
+    .el-dialog__body {
+      background-color: rgba(222, 225, 230, 1);
+          padding: 8px 3px;
+      .button-group{
+        position: absolute;
+               top: 3px;
+
+            left:6px;
+                left: 10px;
+      .el-button--small {
+        padding: 5px 12px;
+
+    }
+        button{
+          font-size: 18px;
+        line-height: 12px;  
+        }
+      }
+    }
+
+    .dialog-content {
+      .box-top {
+        height: 330px;
+        .top-left {
+          float: left;
+          width: 55%;
+          background-color: rgba(253, 253, 253, 1);
+          margin: 0 0.5%;
+          height: 330px;
+          border-radius: 2px;
+          .banner {
+        text-align: center;
+        margin-top: 3px;
+           video {
+
+            margin: 0px auto;
+                 margin-top: 23px;
+
+            width: 443px;
+          height: 277px;
+          }
+          img{
+                max-width: 90%;
+                     margin-top: 28px;
+          }
+          }
+        }
+        .top-right {
+          float: left;
+          width: 43%;
+          margin: 0 0.5%;
+          height: 330px;
+          background-color: rgba(253, 253, 253, 1);
+          position: relative;
+          border-radius: 2px;
+          overflow: hidden;
+          .summary {
+                height: 120px;
+
+
+                margin: 5px 5px 0 5px;
+
+            .icon {
+             margin: 0 10px;
+                margin-top: 8px;
+
+              float: left;
+              .baseImg{
+         max-width: 106px;
+    max-height: 106px;
+              }
+            }
+            
+            .right-desc {
+              float: left;
+              position: absolute;
+                 left: 140px;
+              .name {
+                    font-size: 28px;
+
+                margin-bottom: 5px;
+                text-overflow: ellipsis;
+          white-space: nowrap;
+          overflow: hidden;
+          width: 250px;
+              }
+              .tags {
+                margin-bottom: 10px;
+                .el-tag {
+                  margin-right: 10px;
+                }
+              }
+            }
+           
+          }
+           .jihuo-input{
+             margin-left: 10px;
+             margin-bottom: 10px;
+              .el-input{
+                float: left;
+                width: 63%;
+                margin-bottom: 8px;
+                margin-right: 10px;
+              }
+              el-button{
+                float: left;
+              }
+            }
+          .product-intruduction {
+            height: 200px;
+               margin-top: 3px;
+
+            .part-title {
+              display: block;
+                  line-height: 20px;
+
+              font-size: 16px;
+              margin-left: 24px;
+              border-bottom: 3px solid #3d68e1;
+              width: fit-content;
+                 height: 26px;
+            margin-bottom: 8px;
+
+            }
+            .text {
+                height: 156px;
+              overflow: auto;
+              padding: 0 15px 0px 15px;
+
+
+              .single-desc {
+                   margin-bottom: 10px;
+                        font-size: 13px;
+
+
+              }
+            }
+          }
+        }
+      }
+      .box-bottom {
+            margin-top: 8px;
+
+        height: 240px;
+        .bot-left {
+          width: 49%;
+          height: 240px;
+          background-color: rgba(253, 253, 253, 1);
+          margin: 0 0.5%;
+          border-radius: 2px;
+          float: left;
+          .part-title {
+            display: block;
+            line-height: 35px;
+            font-size: 16px;
+            margin-left: 24px;
+            border-bottom: 3px solid #3d68e1;
+            width: fit-content;
+               margin-bottom: 10px;
+
+              height: 33px;
+
+          }
+          .list-zone {
+            overflow: auto;
+                height: 190px;
+                padding: 0 20px;
+            .list-item {
+              .desc {
+                background-color: rgba(242, 242, 242, 1.3);
+                      margin: 5px 12px 0 12px;
+                    font-size: 12px;
+                        line-height: 18px;
+
+              }
+               margin-bottom: 12px;
+            }
+          }
+        }
+        .bot-right {
+          height: 240px;
+          float: left;
+          background-color: rgba(253, 253, 253, 1);
+          width: 49%;
+          margin: 0 0.5%;
+          border-radius: 2px;
+
+          .part-title {
+            display: block;
+            line-height: 35px;
+            font-size: 16px;
+            margin-left: 24px;
+            border-bottom: 3px solid #3d68e1;
+            width: fit-content;
+            margin-bottom: 5px;
+                height: 33px;
+
+          }
+          .item-zone {
+            overflow: auto;
+            height: 225px;
+              padding: 0px 12px;
+
+            .item {
+              height: 165px;
+              width: 130px;
+              float: left;
+              border-radius: 10px;
+              box-shadow: 0px 5px 14px rgba(0, 0, 0, 0.0666666666666667);
+              position: relative;
+
+              .el-tag {
+                float: right;
+                margin: 8px;
+              }
+              .icon {
+                margin: 0 auto;
+                img {
+                  max-width: 60px;
+                  max-height: 60px;
+                      position: absolute;
+                top: 20%;
+                left: 26%;
+                }
+                .icon-name {
+                 text-align: center;
+                position: absolute;
+                top: 61%;
+                   left: 12%;
+            width: 100px;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            overflow: hidden;
+              font-size: 13px;
+
+                }
+              }
+              .look-button {
+                position: absolute;
+                      left: 30%;
+
+                top: 76%;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
 }
-.el-breadcrumb__inner {
-  font-weight: bold;
-  color: #606266;
-  cursor: pointer;
+.flex-title {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
 }
+
 .el-loading-mask .el-loading-spinner {
   top: 40px !important;
 }
@@ -1651,12 +2112,20 @@
 .src-title {
   //color: #bfbfbf;
   color: #bbcee8;
-  font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC';
+  font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC";
   font-weight: 650;
   font-style: normal;
   height: 36px;
   font-size: 15px;
   padding-left: 25px;
+}
+.update-badge .el-badge__content.is-fixed {
+  top: 10px;
+  right: 4px;
+}
+.empty-tip {
+  padding-left: 25px;
+  color: #ccc;
 }
 .task-manage {
   height: 100%;
@@ -1676,7 +2145,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 {
@@ -1707,16 +2176,8 @@
   //     width: 58% !important;
   //   }
   // }
-  .edit-rules-box {
-    padding: 0 2px 0 13px;
-  }
-  .common {
-    .rigth-box {
-      width: 90% !important;
-    }
-  }
-  .super,
-  .common {
+
+  .super {
     width: 100%;
     height: 100%;
     .title {
@@ -1755,6 +2216,7 @@
           display: flex;
           flex-direction: row;
           flex-wrap: wrap;
+          min-height: 200px;
           .wrap-box {
             width: 16.66%;
           }
@@ -1766,172 +2228,11 @@
             max-width: 200px;
             .mask {
               width: 100%;
-
+              
+            
               .el-button + .el-button {
                 margin-left: 0 !important;
               }
-            }
-          }
-        }
-      }
-      .appScenarios-list {
-        display: flex;
-        flex-wrap: wrap;
-        .wrap-box {
-          width: 16.6%;
-          margin-bottom: 30px;
-          .inner {
-            width: 80%;
-
-            box-sizing: border-box;
-            position: relative;
-            font-size: 14px;
-            padding: 20px 0 50px;
-            transition: all 1s;
-            background: #ffffff;
-            border: 1px solid #e2e2e2;
-            box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.07);
-            border-radius: 4px;
-            margin: auto;
-            &:hover {
-              .mask {
-                display: block;
-              }
-            }
-            .mask {
-              position: absolute;
-              top: 0;
-              left: 0;
-              width: 100%;
-              height: 100%;
-              background: rgba(0, 0, 0, 0.65);
-              backdrop-filter: blur(1px) brightness(100%);
-              text-align: center;
-              z-index: 1;
-              border-radius: 3px;
-              display: none;
-              .el-button + .el-button {
-                margin-left: 0 !important;
-              }
-              .tool {
-                position: absolute;
-                top: 49%;
-                left: 50%;
-                transform: translate(-50%, -50%);
-                i {
-                  font-size: 50px;
-                }
-                i:nth-of-type(1) {
-                  margin-right: 30px;
-                }
-                i:nth-of-type(2) {
-                  color: red;
-                }
-              }
-            }
-            .scenario-icon {
-              display: flex;
-              width: 100%;
-              height: 100%;
-              margin: auto;
-              justify-content: center;
-              align-content: center;
-              align-items: center;
-              .single,
-              .double,
-              .third,
-              .four {
-                width: 80%;
-                padding-top: 80%;
-                position: relative;
-                margin: auto;
-                display: flex;
-                flex-wrap: wrap;
-                justify-content: center;
-                .svg-wrap {
-                  width: 50%;
-                  position: absolute;
-                  height: 0;
-                  padding-top: 50%;
-                  text-align: center;
-                  box-shadow: 0 0 3px 2px rgb(247, 247, 247) inset;
-                  svg {
-                    position: absolute;
-                    top: 50%;
-                    left: 50%;
-                    transform: translate(-50%, -50%);
-                  }
-                  .baseImg {
-                    position: absolute !important;
-                    top: 50%;
-                    left: 50%;
-                    transform: translate(-50%, -50%);
-                  }
-                }
-              }
-              .single {
-                margin: auto;
-                .svg-wrap {
-                  top: 50%;
-                  left: 50%;
-                  transform: translate(-50%, -50%);
-                  box-shadow: none;
-                }
-              }
-              .double {
-                .svg-wrap:nth-of-type(1) {
-                  top: 50%;
-                  transform: translateY(-50%);
-                  left: 0;
-                }
-                .svg-wrap:nth-of-type(2) {
-                  top: 50%;
-                  transform: translateY(-50%);
-                  right: 0;
-                }
-              }
-              .third {
-                .svg-wrap:nth-of-type(1) {
-                  top: 0;
-                  left: 0;
-                }
-                .svg-wrap:nth-of-type(2) {
-                  top: 0;
-                  right: 0;
-                }
-                .svg-wrap:nth-of-type(3) {
-                  top: 50%;
-                  left: 50%;
-                  transform: translateX(-50%);
-                }
-              }
-              .four {
-                .svg-wrap:nth-of-type(1) {
-                  top: 0;
-                  left: 0;
-                }
-                .svg-wrap:nth-of-type(2) {
-                  top: 0;
-                  right: 0;
-                }
-                .svg-wrap:nth-of-type(3) {
-                  top: 50%;
-                  left: 0;
-                }
-                .svg-wrap:nth-of-type(4) {
-                  top: 50%;
-                  right: 0;
-                }
-              }
-            }
-            .scenario-name {
-              width: 100%;
-              height: 36px;
-              line-height: 36px;
-              text-align: center;
-              position: absolute;
-              bottom: 10px;
-              left: 0;
             }
           }
         }
@@ -2008,16 +2309,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%;
@@ -2065,22 +2366,6 @@
         padding: 30px 20px;
       }
     }
-
-    .right-box {
-      height: 100%;
-      padding: 10px 10px;
-      box-sizing: border-box;
-      float: left;
-      .task-manage-table {
-        height: calc(100% - 30px);
-        margin-top: 5px;
-        overflow-x: hidden;
-        overflow-y: auto;
-      }
-      // .task-manage-table::-webkit-scrollbar {
-      //   width: 0 !important ;
-      // }
-    }
     .mask {
       position: absolute;
       width: 100%;
@@ -2092,7 +2377,14 @@
       border-radius: 3px;
       display: none;
       .info-onmask {
-        color: #8ecaff;
+        color: #fff;
+      }
+      .left-top {
+        position: absolute;
+        left: 5px;
+        top: 5px;
+        font-size: 12px;
+        color: #90d6ff;
       }
       .mask-btn {
         width: 100%;
@@ -2186,6 +2478,7 @@
         flex-wrap: wrap;
         justify-content: center;
         top: 0;
+       
         .bot-btn {
           flex: 1;
         }
@@ -2318,16 +2611,6 @@
         display: inline-block;
         width: 100%;
       }
-    }
-    .task-name {
-      text-align: center;
-      margin-top: 16px;
-      line-height: 28px;
-      font-family: PingFangSC-Regular;
-      font-size: 13px;
-      color: #222222;
-      text-align: center;
-      // background-color: #ecf5ff;
     }
     .unit-class {
       margin-left: 10px;
@@ -2469,5 +2752,42 @@
     }
   }
 }
+.active-Dial{
+  .el-dialog{
+
+    min-width: 400px;
+  }
+
+  .dialog-active{
+          .desc {
+          padding: 0 30px;
+          margin-bottom: 30px;
+          li {
+            border-bottom: 1px solid #eee;
+            height: 45px;
+            line-height: 45px;
+            font-size: 14px;
+            &:last-child {
+              border-bottom: none;
+            }
+            label {
+              display: inline-block;
+              width: 90px;
+              padding-left: 14px;
+              font-weight: bold;
+            }
+          }
+        }
+        .text-right {
+          padding-right: 30px;
+          text-align: right;
+          .tip {
+            color: #999;
+            line-height: 38px;
+          }
+        }
+}
+}
+
 </style>
 

--
Gitblit v1.8.0