调整应用图标

zhangzengfei

2021-04-21 3a2c4f13d1554d4e97463abebf085117b3f1e28f

调整应用图标

 src/pages/ai/index/App.vue

@@ -20,17 +20,10 @@
              style="height: calc(100% - 20px)"

            >

              <el-tab-pane label="已激活" name="myAlgorithm">

                <div

                  class="width-new-line task-list"

                  v-show="activeName === '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 installedList"

                      :key="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

@@ -40,42 +33,27 @@
                            :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"

                            >

                            <i class="iconfont iconupdate" v-if="item.isUpgrade"></i>

                            <div class="mask" v-if="!item.isDefault || item.isUpgrade">

                              <div class="left-top">

                                <div>当前版本1:{{ item.version }}</div>

                                <div v-if="item.remoteVersion">

                                  最新版本:{{ item.remoteVersion }}

                                </div>

                                <div v-if="item.remoteVersion">最新版本:{{ item.remoteVersion }}</div>

                              </div>

                              <div

                                class="info-onmask"

                                @click="checkDetail(item, 'active')"

                              >

                                查看详情

                              </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>

                                <el-button

                                  v-if="item.isUpgrade"

                                  @click="donwload(item, 0)"

                                  type="warning"

                                  size="small"

                                  class="bot-btn"

                                  >升级1</el-button

                                >

                                >升级1</el-button>

                              </div>

                            </div>

                            <img

@@ -92,9 +70,11 @@
                          </div>

                          <div class="alg-name">

                            <div style="padding: 0px 10px 0px 10px">

                              <span v-if="!item.isEdit">{{

                              <span v-if="!item.isEdit">

                                {{

                                item.sdk_name

                              }}</span>

                                }}

                              </span>



                              <el-input

                                size="small"

@@ -109,37 +89,22 @@
                        </div>

                      </div>

                    </div>

                    <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">

                          <div class="left-top">

                            <div v-if="item.installed">

                              当前版本:{{ item.version }}

                            </div>

                            <div v-if="item.remoteVersion">

                              最新版本:{{ item.remoteVersion }}

                            </div>

                            <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>

                          <div class="mask-btn">

                            <el-button

                              @click="donwload(item, 1)"

                              type="primary"

                              class="bot-btn"

                              >安装</el-button

                            >

                            <el-button @click="donwload(item, 1)" type="primary" class="bot-btn">安装</el-button>

                          </div>

                        </div>

                        <div class="click-download" title="下载">

@@ -168,9 +133,11 @@
                          </div>

                          <div class="alg-name">

                            <div style="padding: 0px 10px 0px 10px">

                              <span class="list-choose-item-left-uninstal">{{

                              <span class="list-choose-item-left-uninstal">

                                {{

                                item.sdk_name

                              }}</span>

                                }}

                              </span>

                            </div>

                          </div>

                        </div>

@@ -179,11 +146,7 @@
                  </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

@@ -195,24 +158,14 @@
                            :element-loading-text="item.progressMsg"

                            element-loading-background="rgba(0,0,0,.8)"

                          >

                            <i

                              class="iconfont iconupdate"

                              v-if="item.isUpgrade"

                            ></i>

                            <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.remoteVersion">最新版本:{{ item.remoteVersion }}</div>

                              </div>

                              <!-- v-if="!item.isDefault" -->

                              <div

                                class="info-onmask"

                                @click="checkDetail(item, 'active')"

                              >

                                查看详情

                              </div>

                              <div class="info-onmask" @click="checkDetail(item, 'active')">查看详情</div>

                              <div class="mask-btn">

                                <el-button

                                  v-show="!item.isDefault"

@@ -220,16 +173,14 @@
                                  type="primary"

                                  size="small"

                                  class="bot-btn"

                                  >卸载</el-button

                                >

                                >卸载</el-button>

                                <el-button

                                  v-if="item.isUpgrade"

                                  @click="downloadApp(item, 'upgrade')"

                                  type="warning"

                                  size="small"

                                  class="bot-btn"

                                  >升级</el-button

                                >

                                >升级</el-button>

                              </div>

                            </div>

                            <img

@@ -260,11 +211,7 @@
                        </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

@@ -281,8 +228,7 @@
                                type="primary"

                                class="bot-btn"

                                @click="downloadApp(item)"

                                >安装</el-button

                              >

                              >安装</el-button>

                            </div>

                            <img

                              v-if="item.iconBlob"

@@ -335,19 +281,11 @@
                  </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">

@@ -362,31 +300,20 @@
                                  left: 45%;

                                "

                              ></span>

                            </div> -->

                            <div

                              class="mask"

                              v-if="!item.isDefault || item.isUpgrade"

                            >

                            </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 v-if="item.remoteVersion">最新版本:{{ item.remoteVersion }}</div>

                              </div>

                              <div

                                class="info-onmask"

                                @click="actSdkOrApp(item)"

                              >

                                查看详情

                              </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

                                >

                                >激活</el-button>

                              </div>

                            </div>

                            <img

@@ -403,9 +330,11 @@
                          </div>

                          <div class="alg-name">

                            <div style="padding: 0px 10px 0px 10px">

                              <span v-if="!item.isEdit">{{

                              <span v-if="!item.isEdit">

                                {{

                                item.sdk_name

                              }}</span>

                                }}

                              </span>

                              <el-input

                                size="small"

                                v-model="item.sdk_name"

@@ -422,14 +351,8 @@
                  </div>

                  <p class="src-title">应用软件</p>

                  <div class="app-list flex-list">

                    <div v-if="!unActivedAppList.length" class="empty-tip">

                      暂无数据

                    </div>

                    <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">

@@ -447,31 +370,20 @@
                                  left: 45%;

                                "

                              ></span>

                            </div> -->

                            <div

                              class="mask"

                              v-if="!item.isDefault || item.isUpgrade"

                            >

                            </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 v-if="item.remoteVersion">最新版本:{{ item.remoteVersion }}</div>

                              </div>

                              <div

                                class="info-onmask"

                                @click="actSdkOrApp(item, 'app')"

                              >

                                查看详情

                              </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

                                >

                                >激活</el-button>

                              </div>

                            </div>

                            <img

@@ -508,32 +420,19 @@
              </el-tab-pane>

              <el-tab-pane name="update">

                <span slot="label">

                  <el-badge

                    class="update-badge"

                    :value="updateNum"

                    :hidden="updateNum == 0"

                    >更新</el-badge

                  >

                  <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

                    >

                    <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

                      class="wrap-box"

                      v-for="item in hasNewVersionSdk"

                      :key="item.id"

                    >

                      v-if="hasNewVersionSdk.length == 0"

                      class="empty-tip"

                    >{{ errMsg ? errMsg : "暂无数据" }}</div>

                    <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

@@ -543,42 +442,27 @@
                            :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"

                            >

                            <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 v-if="item.remoteVersion">最新版本:{{ item.remoteVersion }}</div>

                              </div>

                              <div

                                class="info-onmask"

                                @click="checkDetail(item, 'active')"

                              >

                                查看详情

                              </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>

                                <el-button

                                  v-if="item.isUpgrade"

                                  @click="donwload(item, 0)"

                                  type="warning"

                                  size="small"

                                  class="bot-btn"

                                  >升级</el-button

                                >

                                >升级</el-button>

                              </div>

                            </div>

                            <img

@@ -595,9 +479,11 @@
                          </div>

                          <div class="alg-name">

                            <div style="padding: 0px 10px 0px 10px">

                              <span v-if="!item.isEdit">{{

                              <span v-if="!item.isEdit">

                                {{

                                item.sdk_name

                              }}</span>

                                }}

                              </span>

                            </div>

                          </div>

                        </div>

@@ -606,22 +492,11 @@
                  </div>

                  <div class="flex-title">

                    <p class="src-title">应用软件</p>

                    <el-button

                      @click="batchUpdate('app')"

                      type="primary"

                      size="mini"

                      >更新全部</el-button

                    >

                    <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 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

@@ -633,23 +508,13 @@
                            :element-loading-text="item.progressMsg"

                            element-loading-background="rgba(0,0,0,.8)"

                          >

                            <i

                              class="iconfont iconupdate"

                              v-if="item.isUpgrade"

                            ></i>

                            <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.remoteVersion">最新版本:{{ item.remoteVersion }}</div>

                              </div>

                              <div

                                class="info-onmask"

                                @click="checkDetail(item, 'active')"

                              >

                                查看详情

                              </div>

                              <div class="info-onmask" @click="checkDetail(item, 'active')">查看详情</div>

                              <div class="mask-btn">

                                <el-button

                                  v-if="!item.isDefault"

@@ -657,16 +522,14 @@
                                  type="primary"

                                  size="small"

                                  class="bot-btn"

                                  >卸载</el-button

                                >

                                >卸载</el-button>

                                <el-button

                                  v-if="item.isUpgrade"

                                  @click="downloadApp(item, 'upgrade')"

                                  type="warning"

                                  size="small"

                                  class="bot-btn"

                                  >升级</el-button

                                >

                                >升级</el-button>

                              </div>

                            </div>

                            <img

@@ -752,26 +615,18 @@
      </div>

    </el-dialog>

    <!-- <div class="dialog-content" v-if="productDetailVisible" > -->

    <el-dialog

      class="product-detail-dialog"

      :visible="productDetailVisible"

      @close="closeDial"

    >

    <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 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-title" slot="title">{{ isSDKDialog ? "算法详情" : "应用详情" }}</div>

      <div class="dialog-content">

        <div class="box-top">

          <div class="top-left">

@@ -790,10 +645,7 @@
                @change="changeHandle"

              >

                <!-- :arrow="productDetail.pics.length > 1 ? 'always' : 'never'" -->

                <el-carousel-item

                  v-for="(item, index) in productDetail.pics"

                  :key="index"

                >

                <el-carousel-item v-for="(item, index) in productDetail.pics" :key="index">

                  <div class="imgwrap">

                    <img

                      v-if="item.type != 'video'"

@@ -801,11 +653,7 @@
                      class="cursor-pointer"

                      preview

                    />

                    <video

                      v-if="item.type == 'video'"

                      :src="'/httpImage/' + item.url"

                      controls

                    ></video>

                    <video v-if="item.type == 'video'" :src="'/httpImage/' + item.url" controls></video>

                  </div>

                </el-carousel-item>

              </el-carousel>

@@ -829,7 +677,7 @@
              <div class="right-desc">

                <div class="name">

                  <el-tooltip

                    class=""

                    class

                    effect="dark"

                    :content="productDetail.productName"

                    placement="right-start"

@@ -838,20 +686,8 @@
                  </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

                  >

                  <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

@@ -859,36 +695,31 @@
                    type="warning"

                    v-if="needToUpgradeInWin || productDetail.isUpgrade"

                    @click="upgradeSDKinWin"

                    >{{ isUpgrading ? "升级中.." : "升级" }}</el-button

                  >

                  >{{ isUpgrading ? "升级中.." : "升级" }}</el-button>

                  <el-button

                    size="small"

                    type="primary"

                    v-if="isActive && !isDefaultApp"

                    @click="unloadSDKinWin"

                    >卸载</el-button

                  >

                  >卸载</el-button>

                  <el-button

                    size="small"

                    type="primary"

                    v-if="!isActive && !showInstallNotActive"

                    @click="showInputCode = !showInputCode"

                    >激活</el-button

                  >

                  >激活</el-button>

                  <el-button

                    size="small"

                    type="primary"

                    v-if="!isActive && showInstallNotActive"

                    @click="downloadSdkInSide"

                    >{{ isUpgrading ? "安装中.." : "安装" }}</el-button

                  >

                  >{{ isUpgrading ? "安装中.." : "安装" }}</el-button>

                  <el-button

                    size="small"

                    type="success"

                    v-if="!isSDKDialog && isActive"

                    @click="openApp"

                    >打开</el-button

                  >

                  >打开</el-button>

                </div>

              </div>

            </div>

@@ -899,12 +730,8 @@
                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

              >

              <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>

@@ -913,9 +740,9 @@
                  <div>版本：</div>

                  <div>

                    {{

                      productDetail.productVersion === ""

                        ? "暂无"

                        : productDetail.productVersion

                    productDetail.productVersion === ""

                    ? "暂无"

                    : productDetail.productVersion

                    }}

                  </div>

                </div>

@@ -923,9 +750,9 @@
                  <div>概述：</div>

                  <div>

                    {{

                      productDetail.description === ""

                        ? "暂无"

                        : productDetail.description

                    productDetail.description === ""

                    ? "暂无"

                    : productDetail.description

                    }}

                  </div>

                </div>

@@ -933,9 +760,9 @@
                  <div>详述：</div>

                  <div>

                    {{

                      productDetail.summary === ""

                        ? "暂无"

                        : productDetail.summary

                    productDetail.summary === ""

                    ? "暂无"

                    : productDetail.summary

                    }}

                  </div>

                </div>

@@ -945,37 +772,29 @@
        </div>

        <div class="box-bottom">

          <div class="bot-left">

            <div class="part-title">

              {{ isSDKDialog ? "应用场景" : "功能特点" }}

            </div>

            <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 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">{{

              <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>

                  ? "暂无数据"

                  : item.productTypeName

                  }}

                </el-tag>

                <div class="icon">

                  <img

                    v-if="item.iconBlob"

@@ -990,24 +809,21 @@


                  <div class="icon-name">

                    <el-tooltip

                      class=""

                      class

                      effect="dark"

                      :content="item.name === '' ? '暂无数据' : item.name"

                      placement="top-start"

                    >

                      <span>{{

                      <span>

                        {{

                        item.name === "" ? "暂无数据" : item.name

                      }}</span>

                        }}

                      </span>

                    </el-tooltip>

                  </div>

                </div>

                <div class="look-button">

                  <el-button

                    type="primary"

                    size="mini"

                    @click="checkInWindow(item)"

                    >查看</el-button

                  >

                  <el-button type="primary" size="mini" @click="checkInWindow(item)">查看</el-button>

                </div>

              </div>

            </div>

@@ -1559,7 +1375,7 @@
          });

      }

    },

    getCodeDetail() {},

    getCodeDetail() { },

    checkMyAlgorith() {

      this.showActivateSuccess = false;

      this.activeName = "myAlgorithm";

@@ -1769,7 +1585,7 @@
      this.sdkUpgreading = true;

    },

    donwload(item, typ) {

      


      item.upgradeLoading = true;

      this.downloadItem = item.id;



@@ -1798,7 +1614,7 @@
    inputBlur(item) {

      this.$set(item, "isEdit", false);

    },

    handleTabClick() {},

    handleTabClick() { },

    autoRefreshAppAndSdkState() {

      // 关闭后退出

      if (!this.autoRefresh) {

@@ -2682,13 +2498,13 @@
          transform: translate(-50%, -50%);

        }

        .baseImg {

          width: 56%;

          width: 100%;

          position: absolute;

          top: 50%;

          left: 50%;

          transform: translate(-50%, -50%);

          max-width: 106px;

          max-height: 106px;

          // max-width: 106px;

          // max-height: 106px;

        }

      }

      .willUpGrade {


 src/pages/desktop/index/components/ToolsEntry.vue

@@ -34,26 +34,6 @@
                </div>

              </div>

            </div>

            <!-- </draggable> -->

            <!-- <div class="app" v-for="dock in stateDocks" :key="dock.id" @click="dockClick(dock)">

              <div class="wrap">

                <div class="app-icon">

                  <img :src="dock.src" :alt="dock.alt" />

                </div>

                <div class="app-name">{{dock.title}}</div>

              </div>

            </div>

            <div class="app sdk" v-for="(item,index) in sdkList" :key="index+'sdk'">

              <div class="wrap">

                <div class="app-icon">

                  <img

                    :src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"

                    style="width:82%"

                  />

                </div>

                <div class="app-name">{{item.sdk_name}}</div>

              </div>

            </div>-->

          </div>

        </el-carousel-item>

      </el-carousel>

@@ -298,7 +278,7 @@
              vertical-align: middle;

              margin-right: -3px;

              width: 82px;

              height: 82px;

              // height: 82px;

            }

            .badge {

              position: absolute;


 src/pages/systemMonitor/api/api.ts

New file
@@ -0,0 +1,8 @@
import request from "@/scripts/httpRequest";

export const showSystemStates = () => {
  return request({
    url: "/data/api-z/system/ShowSystemStates",
    method: "get"
  });
};

 src/pages/systemMonitor/index/App.vue

New file
@@ -0,0 +1,382 @@
<template>
  <div class="s-system-monitor">
    <el-tabs id="systemMonitor" v-model="activeName">
      <el-tab-pane label="单元" name="proc">
        <div class="form-title">
          <b>算法单元</b>(正在进行5个算法单元)
        </div>
        <el-divider></el-divider>

        <div class="form-title">
          <b>应用单元</b>(正在进行5个应用单元)
        </div>
        <el-divider></el-divider>
      </el-tab-pane>

      <el-tab-pane label="性能" name="top">
        <div class="column-left" ref="left">
          <div class="resize-bar">
            <div class="ax_default">
              <div class="ax_default_pic"></div>
              <div>CPU</div>
              <div>100%</div>
            </div>

            <div class="ax_default">
              <div class="ax_default_pic"></div>
              <div>内存</div>
              <div>100%</div>
            </div>

            <div class="ax_default">
              <div class="ax_default_pic"></div>
              <div>磁盘</div>
              <div>100%</div>
            </div>

            <div class="ax_default">
              <div class="ax_default_pic"></div>
              <div>算力</div>
              <div>100%</div>
            </div>

            <div class="ax_default">
              <div class="ax_default_pic"></div>
              <div>网络</div>
              <div>100%</div>
            </div>
          </div>

          <div class="resize-line"></div>
        </div>
        <div class="column-right">
          <div ref="graphs" class="graphs-chart"></div>
        </div>
      </el-tab-pane>

      <el-tab-pane label="服务" name="service">
        <el-table height="93%" :data="services" border :cell-style="cellStyle">
          <el-table-column label="名称" align="center" show-overflow-tooltip>
            <template slot-scope="scope">
              <span>{{ scope.row.name}}</span>
            </template>
          </el-table-column>
          <el-table-column label="状态" prop="status" align="center" width="130px"></el-table-column>
          <el-table-column label="描述" prop="text" align="center"></el-table-column>
        </el-table>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import echarts from "echarts";
import { showSystemStates } from "../api/api"

export default {
  components: {
    

  },
  data() {
    return {
      activeName: "proc",
      eChartsObj: {},
      eChartsBaseOpt: {
        animation: false,
        xAxis: {
          type: "category",
          boundaryGap: false,
          data: Array.from({ length: 100 }, () => 0),
          axisLabel: {
            show: false
          },
          axisTick: {
            show: false
          }
        },
        yAxis: {
          type: 'value',
          axisLabel: {
            show: false
          },
          axisTick: {
            show: false
          }
        },
        series: [
          {
            type: 'line',
            symbol: 'none',
            data: Array.from({ length: 100 }, () => 0),
            // smooth: true,
            areaStyle: {}
          }
        ]
      },
      services: [
        {
          name: "系统配置服务",
          status: "已启动",
          text: "实现系统的通用功能配置"

        }
      ]
    };
  },
  mounted() {
    this.initChart();
    if (!this.isShow('vindicate:device')) {
      this.activeName = "dbvdc"
    }
  },
  computed: {
    isAdmin() {
      if (
        sessionStorage.getItem('userInfo') &&
        sessionStorage.getItem('userInfo') !== ''
      ) {
        let loginName = JSON.parse(sessionStorage.getItem('userInfo')).username
        return (
          loginName === 'superadmin' || loginName === 'basic'
        )
      }
      return false;
    }
  },
  methods: {
    isShow(authority) {
      if (this.isAdmin) {
        return true
      } else if (
        this.buttonAuthority.indexOf(',' + authority + ',') > -1
      ) {
        return true
      } else {
        return false
      }
    },
    format(array) {
      return [
        this.$moment(array[0]).format("YYYY-MM-DD"),
        this.$moment(array[1]).format("YYYY-MM-DD")
      ];
    },
    initChart() {
      this.eChartsObj = echarts.init(this.$refs.graphs);
      this.eChartsObj.setOption(this.eChartsBaseOpt);
      this.cpuMonitor()
    },
    cpuMonitor() {
      let rate = Math.floor(Math.random() * 100);
      let data = this.eChartsBaseOpt.series[0].data.slice(1);
      data.push(rate)
      this.eChartsBaseOpt.series[0].data = data;
      this.eChartsObj.setOption(this.eChartsBaseOpt);
      setTimeout(() => {
        this.cpuMonitor()
      }, 1000)
    }

  }
};
</script>
<style lang="scss">
.s-system-monitor {
  width: 100% !important;
  min-width: 759px;
  box-sizing: border-box;
  padding: 10px;
  // background-color: #e9ebf2;
  background-color: #fff;
  .form-title {
    text-align: left;
    font-size: 14px;
  }

  .graphs-chart {
    height: 380px;
    width: 450px;
    // border: 1px solid rgb(69, 69, 172);
  }
  .column-left {
    background-color: #fff;
    position: relative;
    float: left;
  }
  .column-right {
    //overflow: hidden;
    overflow-y: hidden;
    overflow-x: auto;
  }
  .resize-bar {
    width: 200px;
    height: 400px;
  }
  /* 拖拽线 */
  .resize-line {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    border-right: 1px solid #efefef;
    border-left: 1px solid #e0e0e0;
    pointer-events: none;
  }

  .ax_default {
    font-family: "Arial Normal", "Arial";
    font-weight: 400;
    font-style: normal;
    font-size: 13px;
    text-align: center;
    line-height: normal;
    width: 200px;
    height: 50px;
    font-size: 16px;
    cursor: pointer;
    margin-bottom: 15px;
  }

  .ax_default_pic {
    position: absolute;
    border-width: 0px;
    width: 65px;
    height: 45px;
    background: inherit;
    background-color: rgba(255, 255, 255, 0);
    box-sizing: border-box;
    border-width: 1px;
    border-style: solid;
    border-color: rgba(255, 153, 0, 1);
    border-radius: 0px;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
  }

  .s-system-monitor-breadcrumb {
    height: 5%;
    box-sizing: border-box;
    border: 1px solid #e4e7ed;
    box-shadow: #e4e7ed 0px 0px 9px inset;
    box-shadow: #e4e7ed 0px 0px 9px inset;
    border-radius: 5px;
  }

  .el-tabs--border-card {
    border: 0px solid #dcdfe6;
    -webkit-box-shadow: none;
    box-shadow: none;
    .el-tabs__header {
      border: 0px solid #dcdfe6;
      .el-tabs__item {
        padding: 5px 50px;
        height: 50px;
        font-family: PingFangSC-Regular;
        font-size: 15px;
        color: #222222;
        text-align: center;
        border: 0px solid transparent;
      }
      .el-tabs__item:nth-child(2) {
        padding-left: 50px !important;
      }
      .el-tabs__item:last-child {
        padding-right: 50px !important;
      }
      .el-tabs__item.is-active {
        color: #3d68e1;
        font-weight: bold;
        // border-right-color: #fff;
        // border-left-color: #fff;
      }
      .el-tabs__item:not(.is-disabled):hover {
        color: #3d68e1;
      }
    }
  }
  .el-tabs__content {
    height: calc(100% - 64px);
    width: calc(100% - 20px);
    box-sizing: border-box;
    overflow-y: auto;
    padding: 10px 40px !important;
    .el-tab-pane {
      width: 100%;
      .s-title {
        text-align: left;
        padding: 15px 0px;
        font-size: 16px;
      }
    }
  }

  .s-table {
    border: 1px solid #e8e8e9;
    margin-top: 40px;
  }

  .ui-top-title {
    padding-bottom: 10px;
    /* border-bottom: 1px solid #ebebeb; */
    position: relative;
    text-align: left;
    padding-left: 15px;
    font-size: 16px;
    font-weight: bold;
  }

  .ui-top-title:before {
    content: " ";
    border-left: 4px solid #f53d3d;
    display: inline-block;
    height: 16px;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -13px;
  }

  .el-button--text {
    color: #3d68e1;
    text-decoration: underline;
  }
}

#systemMonitor {
  .el-tabs__header {
    border: 0px solid #dcdfe6;
    .el-tabs__item {
      padding: 5px 50px;
      height: 50px;
      font-family: PingFangSC-Regular;
      font-size: 14px;
      color: #222222;
      text-align: center;
      border: 0px solid transparent;
    }
    .el-tabs__item:nth-child(2) {
      padding-left: 50px;
    }
    .el-tabs__item:last-child {
      padding-right: 50px;
    }
    .el-tabs__item.is-active {
      color: #ff7733;
      font-weight: bold;
      // border-right-color: #fff;
      // border-left-color: #fff;
    }
    .el-tabs__item:not(.is-disabled):hover {
      color: #ff7733;
    }
  }
  .el-tabs__active-bar {
    background-color: #ff7733;
  }
  .el-tabs__content {
    padding-left: 15px !important;
  }
}
</style>

 src/pages/systemMonitor/index/main.ts

New file
@@ -0,0 +1,16 @@
import Vue from 'vue';
import App from './App.vue';

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import "@/assets/css/element-variables.scss";

import moment from 'moment';

Vue.use(ElementUI)
Vue.prototype.$moment = moment;

new Vue({
  el: '#app',
  render: h => h(App)
})