修复以图搜图底库图片显示的问题

zhangzengfei

2021-04-07 5058e8d5fc8220a4fa31d160935c1aafd6074fb3

 src/pages/ai/index/App.vue

@@ -26,47 +26,6 @@
                >

                  <p class="src-title">算法软件</p>

                  <div class="flex-list">

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

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

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

                                <div>最新版本:{{item.remoteVersion}}</div>

                              </div>

                              <div class="mask-btn">

                                <el-button

                                  type="warning"

                                  class="bot-btn"

                                  size="small"

                                  @click="donwload(item)"

                                >升级</el-button>

                              </div>

                            </div>

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

@@ -111,7 +70,7 @@
                                >

                                <el-button

                                  v-if="item.isUpgrade"

                                  @click="donwload(item)"

                                  @click="donwload(item,0)"

                                  type="warning"

                                  size="small"

                                  class="bot-btn"

@@ -150,7 +109,6 @@
                        </div>

                      </div>

                    </div>

                    <!-- </draggable> -->

                    <div

                      class="wrap-box"

                      v-for="item in notInstalledList"

@@ -161,12 +119,28 @@
                        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>

@@ -232,16 +206,16 @@
                                  最新版本:{{ item.remoteVersion }}

                                </div>

                              </div>

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

                              <div

                                class="info-onmask"

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

                                  v-if="!item.isDefault"

                              >

                                查看详情

                              </div>

                              <div class="mask-btn">

                                <el-button

                                  v-if="!item.isDefault"

                                  v-show="!item.isDefault"

                                  @click="unLoad(item)"

                                  type="primary"

                                  size="small"

@@ -302,6 +276,7 @@
                            element-loading-background="rgba(0,0,0,.8)"

                          >

                            <div class="mask">

                             
                              <el-button

                                size="small"

                                type="primary"

@@ -449,6 +424,9 @@
                  </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"

@@ -529,78 +507,12 @@
                    </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>

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

                    </div>

                  </div>

                </el-drawer>

                <!--  -->

                
              </el-tab-pane>

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

                <span slot="label">

                  <el-badge class="update-badge" :value="updateNum"

                  <el-badge class="update-badge" :value="updateNum" :hidden="updateNum==0"

                    >更新</el-badge

                  >

                </span>

@@ -616,7 +528,7 @@
                  </div>

                  <div class="flex-list">

                    <div v-if="hasNewVersionSdk.length==0" class="empty-tip">

                      {{errMsg?errMsg:"暂无数据，请稍后重试..."}}

                      {{errMsg?errMsg:"暂无数据"}}

                    </div>

                    <div

                      class="wrap-box"

@@ -662,7 +574,7 @@
                                >

                                <el-button

                                  v-if="item.isUpgrade"

                                  @click="donwload(item)"

                                  @click="donwload(item,0)"

                                  type="warning"

                                  size="small"

                                  class="bot-btn"

@@ -704,7 +616,7 @@
                  </div>

                  <div class="flex-list">

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

                      暂无数据，请稍后重试...

                      暂无数据

                    </div>

                    <div

                      class="wrap-box"

@@ -900,35 +812,33 @@
            <div class="summary">

              <div class="icon">

                <img

                  v-if="curCheckTarget.iconBlob"

                  v-if="productDetail.iconBlob"

                  class="baseImg"

                  :src="

                    curCheckTarget.iconBlob.indexOf(',') > 0

                      ? curCheckTarget.iconBlob

                      : `data:image/png;base64,${curCheckTarget.iconBlob}`

                    productDetail.iconBlob.indexOf(',') > 0

                      ? productDetail.iconBlob

                      : `data:image/png;base64,${productDetail.iconBlob}`

                  "

                  alt

                />

              </div>

              <div class="right-desc">

                <div class="name">{{ productDetail.productName }}</div>

                  
                <div class="name"><el-tooltip class="" effect="dark" :content="productDetail.productName  " placement="right-start">

                  <span>{{ productDetail.productName  }}</span>

                </el-tooltip></div>

                <div class="tags">

                  <!-- <span

                  class="tag"

                  v-for="(id, index) in curCheckTarget.productLabelId"

                  :key="index+'i'" 
                >{{showNameById(id)}}</span> -->

                  <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 size="small" type="warning"  v-if="needToUpgradeInWin" @click="upgradeSDKinWin" >{{

                  <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" @click="unloadSDKinWin">卸载</el-button>

                  <el-button size="small" type="primary" v-if="!isActive" @click="showInputCode=!showInputCode">下载激活</el-button>

                  <el-button size="small" type="success" v-if="!isSDKDialog" @click="openApp">打开</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>

@@ -1047,9 +957,10 @@
      </div>

    </el-dialog>

    <el-dialog 

    :visible.sync="showActivateSuccess"

    title="激活成功！"

  :visible.sync="showActivateSuccess"

  width="30%"

  class="active-Dial"

  :before-close="handleClose"

    >

      <div class="dialog-active">

@@ -1079,7 +990,7 @@
          <el-button type="primary" @click="checkMyAlgorith"

            >确定</el-button

          >

          <p class="tip">提示：请在“我的算法”中查看并安装算法</p>

          <p class="tip">提示：请在“已激活”中查看并安装算法</p>

        </div>

      </div>

    </el-dialog>

@@ -1161,7 +1072,6 @@
      downloadItem: "",

      downloading: false,

      direction: "rtl",

      actDrawerShow: false,

      actStep: 0,

      showActivateSuccess:false,

      activeCode: "",

@@ -1171,10 +1081,10 @@
      installAppPackage: null,

      installSdkPackage: null,

      isActive:true,

      isDefaultApp:false,

      installPercentage: 0,

      unActivedSDKList: [],

      unActivedAppList: [],

      // dialogTitle: "",

      isSDKDialog:true,

      //actSdkId: '',

      actType: "",

@@ -1208,6 +1118,7 @@
      showInputCode:false,

      needToUpgradeInWin:false,

      errMsg:"",

      showInstallNotActive:false

    };

  },

  directives: {

@@ -1238,7 +1149,7 @@
    batchUpdate(type) {

      if (type == "sdk") {

        this.hasNewVersionSdk.forEach((sdk) => {

          this.donwload(sdk);

          this.donwload(sdk,0);

        });

      } else {

        this.hasNewVersionApp.forEach((app) => {

@@ -1254,24 +1165,32 @@
    checkDetail(item,type) {

      if (type =='inactive') {

        this.isActive =false

         this.showInstallNotActive = false

        this.showInputCode = false

      }else{

      }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()

      this.curCheckTarget = item;

      if (item.sdk_type===undefined) {

       this.isSDKDialog=false

      }else{

       this.isSDKDialog=true

      }

      // debugger

      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;



      });

@@ -1284,14 +1203,14 @@


    },

    checkInWindow(item){

      this.backStack.push([this.productDetail,this.otherProducts])

      // debugger

      this.backStack.push([this.productDetail, this.otherProducts])

      this.backDisable = false

      this.curCheckTarget = item;

      // this.productDetailVisible = true;

      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]

@@ -1301,21 +1220,29 @@
            flag=true

          }

        }

        this.needToUpgradeInWin = 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

      // forwardDisable:false,

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

@@ -1340,7 +1267,6 @@
      }

      

    },



    //离线安装

    offlineInstall() {

      this.installDialogVisible = false;

@@ -1386,19 +1312,16 @@
      installApp({ path: app.id })

        .then((res) => {

          if (res && res.success) {

            _this.$notify({

               title: "成功",

               message: "安装应用成功",

               type: "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(

@@ -1408,10 +1331,16 @@
                "*"

              );

            }, 3000);

          }else {

        
          }

        })

        .catch((e) => {

          console.log(e);

            _this.$notify({

              title: "安装失败",

              message: e.data,

              type: "warning",

            });

          if (action == "upgrade") {

            app.upgradeLoading = false;

          } else {

@@ -1450,11 +1379,13 @@
      this.hasNewVersionApp = nArry;

    },



    //卸载应用

    //卸载

    unLoad(app) {

      let _this = this;

      this.$confirm("确定要卸载该应用吗?", "提示")

        .then(() => {

      _this.productDetailVisible = false



          app.unloadLoading = true;

          removeApp({ appId: app.id })

            .then((res) => {

@@ -1467,6 +1398,11 @@
                  },

                  "*"

                );

                _this.$notify({

                  title: "成功",

                  message: "卸载应用成功",

                  type: "success",

                });

              }

            })

            .catch((e) => {

@@ -1478,19 +1414,11 @@
          console.log(e);

        });

    },

    // actSdk (id) {

    //   this.actSdkId = id;

    //   this.actDrawerShow = true;

    //   this.actStep = 0;

    //   this.activeCode = '';

    //   this.activedSdkOrApp = this.newActInfo()

    // },



    actSdkOrApp(item, type = "sdk") {

      this.checkDetail(item, 'inactive')

      this.actType = type;

      // debugger

      this.actId = item.id;

      // this.actDrawerShow = true;

      this.actStep = 0;

      this.activeCode = "";

      this.activedSdkOrApp = this.newActInfo();

@@ -1498,6 +1426,7 @@


    cancelActivate(){

      this.showInputCode= false

      this.activeCode = ""

    },

    newActInfo() {

      return {

@@ -1525,6 +1454,13 @@
    },

    actived() {

      let _this = this;

      if (this.activeCode.trim()=="") {

        this.$notify({

          type: "error",

          message: "激活码不能为空",

        });

        return

      }

      if (this.actType == "sdk") {

        //激活算法

        actPageAlg(this.actId, this.activeCode)

@@ -1612,7 +1548,7 @@
        });

    },

    openApp(){

      let message = 'toOpenApp?'+this.productDetail.productBaseId;

      let message = 'toOpenApp?' + this.productDetail.productBaseId;

      window.parent.postMessage({

        msg: message

      }, "*")

@@ -1651,34 +1587,37 @@
      this.hasNewVersionSdk = hasNewVersionList;

    },

    unloadSDKinWin(){

      let _this = this;

      this.$confirm("确定要卸载该算法么？", "提示").then(()=>{

        _this.productDetailVisible = false

        removeSdk({sdkId:this.productDetail.productBaseId}).then((res)=>{

          _this.getAllSdk();

          window.parent.postMessage(

            {

              msg: "AppUpdate",

            },

            "*"

          );

        }).catch((err)=>{

           console.log(err);



      let appToUnload

      let sdkToUnload

      if (this.productDetail.productTypeName=="应用") {

        appToUnload= this.installedApps.find((item)=>{

          return item.id == this.productDetail.productBaseId

        })

      }).catch(()=>{

        
      })

        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(

                  {

@@ -1701,13 +1640,43 @@


      this.isUpgrading = !this.isUpgrading;



      downloadSdk({path:this.productDetail.productBaseId}).then((res)=>{

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

        });

        this.isUpgrading = !this.isUpgrading;

      }).catch((err)=>{

        this.$notify({

          title: "升级失败",

@@ -1717,22 +1686,48 @@
        this.isUpgrading = !this.isUpgrading;

      })

      this.sdkUpgreading = true;

    },

      }



    donwload(item) {



      
    },

    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.isUpgrading=false

        })

        .catch((err) => {

          this.$notify({

            type: "warning",

            message: err.data,

          });

          this.downloadItem = "";

      this.isUpgrading=false

        });

      // 开启自动刷新

      this.sdkUpgreading = true;

    },

    donwload(item,typ) {

      item.upgradeLoading = true;

      //this.downloading = true;

      this.downloadItem = item.id;



      downloadSdk({ path: item.id })

        .then((rsp) => {

          // this.$notify({

          //   type: "success",

          //   message: "算法已安装"

          // });

          item.upgradeLoading = false;

          //this.downloading = false;

          this.downloadItem = "";

          this.$notify({

            type: "success",

            message: typ==1? "算法安装成功":"算法升级成功"

          });

        })

        .catch((err) => {

          this.$notify({

@@ -1747,7 +1742,6 @@
      this.sdkUpgreading = true;

    },

    inputBlur(item) {

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

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

    },

    handleTabClick() {},

@@ -1846,8 +1840,6 @@


    }

        button{

          // margin-right: 6px;

          // background-color: #ecf5ff;

          font-size: 18px;

        line-height: 12px;  

        }

@@ -1874,15 +1866,10 @@


            width: 443px;

          height: 277px;

            // background: aquamarine;

          }

          img{

                max-width: 90%;



                     margin-top: 28px;







          }

          }

        }

@@ -1890,7 +1877,6 @@
          float: left;

          width: 43%;

          margin: 0 0.5%;

          // background-color: lightgoldenrodyellow;

          height: 330px;

          background-color: rgba(253, 253, 253, 1);

          position: relative;

@@ -1916,12 +1902,15 @@
            .right-desc {

              float: left;

              position: absolute;

             left: 145px;

                 left: 140px;

              .name {

                    font-size: 28px;



                // font-weight: bold;

                margin-bottom: 5px;

                text-overflow: ellipsis;

          white-space: nowrap;

          overflow: hidden;

          width: 250px;

              }

              .tags {

                margin-bottom: 10px;

@@ -1937,8 +1926,9 @@
             margin-bottom: 10px;

              .el-input{

                float: left;

                width: 64%;

                 margin-bottom: 8px;

                width: 63%;

                margin-bottom: 8px;

                margin-right: 10px;

              }

              el-button{

                float: left;

@@ -1954,18 +1944,16 @@


              font-size: 16px;

              margin-left: 24px;

              // height: 30px;

              border-bottom: 3px solid #3d68e1;

              width: fit-content;

              // margin-bottom: 8px;

                 height: 26px;

            margin-bottom: 8px;



            }

            .text {

                 height: 156px;

    overflow: auto;

    padding: 0 15px 0px 15px;

                height: 156px;

              overflow: auto;

              padding: 0 15px 0px 15px;





              .single-desc {

@@ -1989,28 +1977,29 @@
          margin: 0 0.5%;

          border-radius: 2px;

          float: left;

          // background-color: lightblue;

          .part-title {

            display: block;

            line-height: 35px;

            font-size: 16px;

            margin-left: 24px;

            // height: 30px;

            border-bottom: 3px solid #3d68e1;

            width: fit-content;

            margin-bottom: 8px;

            height: 35px;

               margin-bottom: 10px;



              height: 33px;



          }

          .list-zone {

            overflow: auto;

            height: 225px;

               padding: 0 12px;



                height: 190px;

                padding: 0 20px;

            .list-item {

              .desc {

                background-color: rgba(242, 242, 242, 1.3);

                    margin: 4px 12px 0 12px;

                      margin: 5px 12px 0 12px;

                    font-size: 12px;

                        line-height: 18px;



              }

               margin-bottom: 12px;

            }

@@ -2021,7 +2010,6 @@
          float: left;

          background-color: rgba(253, 253, 253, 1);

          width: 49%;

          // background-color: lightgoldenrodyellow;

          margin: 0 0.5%;

          border-radius: 2px;



@@ -2030,11 +2018,11 @@
            line-height: 35px;

            font-size: 16px;

            margin-left: 24px;

            // height: 30px;

            border-bottom: 3px solid #3d68e1;

            width: fit-content;

            margin-bottom: 5px;

            height: 35px;

                height: 33px;



          }

          .item-zone {

            overflow: auto;

@@ -2045,7 +2033,6 @@
              height: 165px;

              width: 130px;

              float: left;

              // text-align: center;

              border-radius: 10px;

              box-shadow: 0px 5px 14px rgba(0, 0, 0, 0.0666666666666667);

              position: relative;

@@ -2055,32 +2042,24 @@
                margin: 8px;

              }

              .icon {

                // width: 100%;

                // height: 68px;

                // width: 68px;

                // position: absolute;

                // margin: 0 auto;

                margin: 0 auto;

                // top: 21%;

                // left: 26%;

                img {

                  // display: block;

                  max-width: 60px;

                  max-height: 60px;

                      position: absolute;

    top: 20%;

    left: 26%;

                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;

            width: 100px;

            text-overflow: ellipsis;

            white-space: nowrap;

            overflow: hidden;

              font-size: 13px;



                }

              }

@@ -2249,7 +2228,8 @@
            max-width: 200px;

            .mask {

              width: 100%;



              
            
              .el-button + .el-button {

                margin-left: 0 !important;

              }

@@ -2498,6 +2478,7 @@
        flex-wrap: wrap;

        justify-content: center;

        top: 0;

       
        .bot-btn {

          flex: 1;

        }

@@ -2771,7 +2752,13 @@
    }

  }

}

.dialog-active{

.active-Dial{

  .el-dialog{



    min-width: 400px;

  }



  .dialog-active{

          .desc {

          padding: 0 30px;

          margin-bottom: 30px;

@@ -2800,5 +2787,7 @@
          }

        }

}

}



</style>