应用中心ui改动

heyujie

2021-09-18 44a3abe105e9b9b4d1a7173772fc9d18c9b59529

 src/pages/ai/index/detail.vue

@@ -16,6 +16,7 @@
            <el-button

              size="mini"

              round

              class="update-btn"

              @click="upgradeSDKinWin"

              v-if="productDetail.isUpgrade"

              >更新</el-button

@@ -34,10 +35,20 @@
              @click="unloadSDKinWin"

              >卸载</el-button

            >



            <el-button

              size="mini"

              round

              v-if="!isActive && showInstallNotActive"

              @click="downloadSdkInSide"

              >安装</el-button

            >

            <!-- suffix-icon="iconfont iconchushaixuanxiang" -->

            <el-input

              class="activeInput"

              placeholder="请输入激活码"

              size="mini"

              clearable

              :autofocus="true"

              v-model="activeCode"

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

            >

@@ -50,17 +61,17 @@
              @click="actived"

              >激活</el-button

            >

            <span

            <!-- <span

              class="icon iconfont"

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

              @click="activeCode = ''"

              >&#xe6cb;</span

            >

            > -->

          </div>

        </div>

        <div class="back-btn" @click="goback">

          <span class="icon iconfont">&#xe680;</span>

          <span class="back-text">返回上页</span>

          <span class="back-text">返回</span>

        </div>

      </div>

      <div class="text-area">

@@ -161,6 +172,43 @@
        </div>

      </div>

    </div>



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

@@ -182,11 +230,8 @@
  actApp,

} from "@/api/app";

import { getUrlKey } from "@/api/utils";

// import FileUploader from "@/components/subComponents/FileUpload/index";

export default {

  components: {

    // FileUploader,

  },

  components: {},

  computed: {

    updateNum() {

      return this.hasNewVersionApp.length + this.hasNewVersionSdk.length;

@@ -207,7 +252,6 @@
    return {

      installedList: [],

      hasNewVersionSdk: [],

      activeTab: 0,

      hasNewVersionApp: [],

      notInstalledList: [],

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

@@ -258,8 +302,6 @@
      showInputCode: false,

      needToUpgradeInWin: false,

      showInstallNotActive: false,

      activeIndex: 0,

      menuArr: ["应用中心", "已激活", "离线升级/安装", "更新"],

    };

  },

  props: {

@@ -334,7 +376,7 @@
        this.actId = this.productDetail.productBaseId;

        this.isSDKDetail = this.productDetail.productTypeName == "SDK";

        this.isDefaultApp = this.productDetail.productBaseId.length < 10;

    


        this.otherProducts = res.data.randoms;

      });

    },

@@ -613,7 +655,8 @@
    },

    checkMyAlgorith() {

      this.showActivateSuccess = false;

      this.activeName = "myAlgorithm";

      this.goback();

      this.activeName = "已激活";

    },

    onFileUpload(file) {

      this.patchFile = { ...file };

@@ -720,18 +763,9 @@
            .then((res) => {

              if (res && res.success) {

                sdk.unloadLoading = false;

                this.$notify({

                  title: "成功",

                  message: "卸载完成",

                  type: "success",

                });

                this.$notify.success("卸载完成");

                _this.getAllSdk();

                window.parent.postMessage(

                  {

                    msg: "AppUpdate",

                  },

                  "*"

                );

                window.parent.postMessage({ msg: "AppUpdate" }, "*");

              }

            })

            .catch((e) => {

@@ -781,17 +815,11 @@
        .then((rsp) => {

          this.productDetailVisible = false;

          this.downloadItem = "";

          this.$notify({

            type: "success",

            message: "算法已安装",

          });

          this.$notify.success("算法已安装");

          this.isUpgrading = false;

        })

        .catch((err) => {

          this.$notify({

            type: "warning",

            message: err.data,

          });

          this.$notify.warning(err.data);

          this.downloadItem = "";

          this.isUpgrading = false;

        });

@@ -849,14 +877,12 @@
.detail-page {

  width: 100% !important;

  height: 100%;

  //   background-color: cornsilk;

  box-sizing: border-box;

  text-align: left;

  //   min-width: 1106px;

  .detail-top {

    padding: 35px 60px;

    padding-bottom: 20px;

    //   margin-bottom: 40px;

    border-bottom: 3px solid #f2f2f2;

    .title-area {

      display: flex;

@@ -866,7 +892,7 @@
        position: absolute;

        right: 0;

        top: 0;

        width: 80px;

        width: 51px;

        height: 20px;

        line-height: 20px;

        display: flex;

@@ -874,12 +900,12 @@
        align-items: center;

        cursor: pointer;

        .icon {

          margin-right: 2px;

          margin-right: 3px;

          font-size: 18px;

        }

        .back-text {

          font-size: 14px;

          letter-spacing: 0.1px;

          letter-spacing: 0.5px;

        }

      }

      .icon-img {

@@ -915,6 +941,19 @@
        .right-info-2 {

          display: flex;

          align-items: center;

          .activeInput {

            .el-input__suffix {

              display: flex;

              align-items: center;

              .el-input__suffix-inner {

                border-color: none;

                .el-icon-circle-close:before {

                  content: "\e79d" !important;

                  font-size: 14px;

                }

              }

            }

          }

          .iconfont {

            margin-left: 10px;

            font-size: 15px;

@@ -922,7 +961,8 @@
          }

          .el-input {

            margin-right: 12px;

            width: 220px;

            width: 224px;

            font-size: 12px;

            .el-input__inner {

              border: 1px solid #bdbdbd;

              border-radius: 20px;

@@ -938,19 +978,23 @@
            background: #f2f2f7;

            border: 1px solid #f2f2f7;

          }

          .update-btn {

            border-color: #23d7ee;

            background-color: rgba(29, 212, 236, 0.1);

          }

          .act-btn {

            background: #23d7ee;

            border: 1px solid #23d7ee;

            color: #f2f2f2;

          }

          .act-btn:hover {

            background: #089fb3 !important;

            border-color: #089fb3 !important;

          }

          .el-button:hover {

            border-color: #23d7ee;

            background-color: rgba(29, 212, 236, 0.1);

          }

          // .act-btn:hover {

          //   background: #089fb3 !important;

          //   border-color: #089fb3 !important;

          // }

          // .el-button:hover {

          //   border-color: #23d7ee;

          //   background-color: rgba(29, 212, 236, 0.1);

          // }

          .el-button + .el-button {

            margin-left: 12px;

          }

@@ -961,8 +1005,6 @@
      .text-line {

        line-height: 17px;

        height: 25px;



        // margin-top: 6px;

        .icon {

          font-size: 14px;

          margin-right: 2px;

@@ -1046,7 +1088,7 @@
      font-weight: bold;

      letter-spacing: 0.5px;

      line-height: 26px;

          margin-bottom: 20px;

      margin-bottom: 20px;

    }

  }

  .rec-items {

@@ -1054,7 +1096,7 @@
      float: left;

      display: flex;

      margin: 0 15px;

         margin-bottom: 30px;

      margin-bottom: 30px;

      padding: 2px 0;

      height: 62px;

      box-sizing: border-box;

@@ -1086,7 +1128,6 @@
        }

      }

      .right-btn {

        // width: 20px;

        padding: 5px 0;

        .el-button {

          padding: 3px 12px;

@@ -1094,10 +1135,6 @@
          border-color: #1dd4ec !important;

          border-radius: 22px;

        }

        // .el-button--primary:focus {

        //   background: #0cabc0 !important;

        //   border-color: #0cabc0 !important;

        // }

        .el-button--primary:hover {

          background: #089fb3 !important;

          border-color: #089fb3 !important;