应用中心-算法软件实时显示安装/升级进度

hanbaoshan

2020-10-23 28c0c2dcec08b4932a4fc5bfd6bcf0dc036edb23

应用中心-算法软件实时显示安装/升级进度

 src/pages/ai/index/App.vue

@@ -23,10 +23,16 @@
                <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 ungradeList" :key="'upgrade'+item.id">

                      <div class="list-choose-item-left">

                        <div class="list-complete-item-handle">

                          <div class="svg-wrap" :class="{willUpGrade:item.isUpgrade}">

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

                              <div class="info-onmask">

@@ -42,9 +48,6 @@
                                >升级</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"

@@ -60,14 +63,43 @@
                          </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="svg-wrap"

                            :class="{willUpGrade:item.isUpgrade}"

                            v-loading="item.upgradeLoading"

                            :element-loading-text="item.progressMsg"

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

                          >

                            <!-- <div class="mask flex-center">

                              <div class="info-onmask">

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

                              </div>

                            </div> -->

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

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

                              <div class="info-onmask">

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

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

                              </div>

                              <div class="mask-btn">

                                <!-- <el-button

                                  v-if="!item.isDefault"

                                  @click="unLoad(item)"

                                  type="primary"

                                  size="small"

                                  class="bot-btn"

                                >卸载</el-button> -->

                                <el-button

                                  v-if="item.isUpgrade"

                                  @click="donwload(item)"

                                  type="warning"

                                  size="small"

                                  class="bot-btn"

                                >升级</el-button>

                              </div>

                            </div>

                            <img

@@ -448,23 +480,26 @@
    FileUploader

  },

  computed: {

    notInstalledList() {

      return this.sdkList.filter(sdk => {

        return sdk.installed === false;

      });

    },

    installedList() {

      return this.sdkList.filter(sdk => {

        return sdk.installed === true && !sdk.isUpgrade;

      });

    },

    ungradeList() {

      // 升级处理会导致重复的key,需要修改

      //return [];

      return this.sdkList.filter(sdk => {

        return sdk.isUpgrade === true;

      });

    },

    // 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") &&

@@ -480,6 +515,9 @@
  data() {

    return {

      sdkList: [],

      installedList: [],

      ungradeList: [],

      notInstalledList: [],

      buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],

      activeName: "myAlgorithm",

      patchUpdateStatus: "",

@@ -643,13 +681,13 @@
      removeApp({ appId: app.id }).then(res => {



        if (res && res.success) {

          setTimeout(() => {

          //setTimeout(() => {

            app.unloadLoading = false;

            _this.getAllApps();

            window.parent.postMessage({

              msg: "AppUpdate"

            }, '*')

          }, 3000);

          //}, 3000);

        }

      }).catch(e => {

        console.log(e);

@@ -783,17 +821,45 @@
    },



    async getAllSdk() {

      let installedList = [];

      let unInstalledList = [];

      let res = await findAllSdk();

      if (res && res.success) {

        this.sdkList = res.data.map((i, index) => {

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

          return i;

        });



        res.data.forEach(item => {

          let obj = Object.assign({ unloadLoading: false, upgradeLoading: false }, item)

          if (obj.progressMsg !== "" && obj.progressMsg !== "已安装") {

            obj.upgradeLoading = true;



            this.appUpgreading = true;

            this.startAutoFresh();

      }



          //算法软件 已安装其中包含待升级 未安装

          item.installed ? installedList.push(obj) : unInstalledList.push(obj)



        });





        // this.sdkList = res.data.map((i, index) => {

        //   if (i.progressMsg !== "" && i.progressMsg !== "已安装") {

        //     i.upgradeLoading = true;



        //     this.appUpgreading = true;

        //     this.startAutoFresh();

        //   }

        //   this.$set(i, "isEdit", false);

        //   return i;

        // });

      }

      this.installedList = installedList;

      this.notInstalledList = unInstalledList;

    },



    donwload(item) {

      this.downloading = true;

      debugger

      item.upgradeLoading = true;

      //this.downloading = true;

      this.downloadItem = item.id;



      downloadSdk({ path: item.id })

@@ -802,7 +868,8 @@
            type: "success",

            message: "算法已安装"

          });

          this.downloading = false;

          item.upgradeLoading = false;

          //this.downloading = false;

          this.downloadItem = "";

          this.getAllSdk();

        })

@@ -811,10 +878,13 @@
            type: "warning",

            message: err.data

          });



          this.downloading = false;

          item.upgradeLoading = false;

          //this.downloading = false;

          this.downloadItem = "";

        });

        // 开启自动刷新

      this.appUpgreading = true;

      this.startAutoFresh();

    },

    inputBlur(item) {

      // console.log(item, '修改名称')

@@ -906,7 +976,7 @@
.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;

@@ -931,7 +1001,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 {

@@ -1093,16 +1163,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%;