From 8e40a69fcfe8bc799fee141fec953a2b0892dbd4 Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@smartai.com>
Date: 星期一, 09 十月 2023 15:54:26 +0800
Subject: [PATCH] 修改wifi扫描的交互
---
src/pages/ai/index/App.vue | 3227 +++++++++++++++++++++++++++++------------------------------
1 files changed, 1,590 insertions(+), 1,637 deletions(-)
diff --git a/src/pages/ai/index/App.vue b/src/pages/ai/index/App.vue
index 6552cac..68b8825 100644
--- a/src/pages/ai/index/App.vue
+++ b/src/pages/ai/index/App.vue
@@ -1,1637 +1,1590 @@
-<template>
- <div class="s-task-manage">
- <div style="height: 100%">
- <div class="flex-box task-manage">
- <div class="installModel" v-if="isInstall">
- <div class="progress-bar">
- <div class="inner-bar"></div>
- </div>
- </div>
- <div class="super">
- <div class="left-box" v-if="!inDetail">
- <div class="nav-box">
- <div class="nav-box-menu">
- <div
- v-for="(name, index) in menuArr"
- :key="index"
- class="menu-item"
- :class="activeName == name ? 'menu-item-actiove' : ''"
- @click="pickMenu(name)"
- >
- {{ name }}
- <sup v-if="index == 3 && updateNum != 0">{{ updateNum }}</sup>
- </div>
- </div>
- <div class="nav-box-search">
- <span class="icon iconfont all-scene"></span>
- <el-input
- placeholder="鎼滅储"
- v-model="input3"
- class="input-with-select"
- >
- <i class="el-icon-search" slot="prepend"></i>
- <el-select
- v-model="select"
- slot="append"
- placeholder="閫夋嫨鍦烘櫙"
- :popper-append-to-body="false"
- >
- <el-option label="閾佽矾鍦烘櫙" value="1">
- <span class="icon iconfont"></span>
- <span>閾佽矾鍦烘櫙</span>
- </el-option>
- <el-option label="瀹夊叏鍦烘櫙" value="2">
- <span class="icon iconfont"></span>
- <span>瀹夊叏鍦烘櫙</span>
- </el-option>
- <el-option label="閫氱敤鍦烘櫙" value="3">
- <span class="icon iconfont"></span>
- <span>閫氱敤鍦烘櫙</span>
- </el-option>
- <el-option label="鏍″洯鍥尯" value="4">
- <span class="icon iconfont"></span>
- <span>鏍″洯鍥尯</span>
- </el-option>
- </el-select>
- </el-input>
- </div>
-
- <div class="bg-img-wrap">
- <img src="/images/appCenter/Group-112.png" alt="" />
- </div>
- </div>
- <div class="quick-path" v-if="showQuickPath">
- <div class="left-items">
- <div
- class="quick-item"
- v-for="(item, index) in recomandUpdateList"
- :key="index"
- @click="checkDetail(item, 'inactive')"
- >
- <div class="icon-img">
- <span class="icon iconfont" v-if="item.isUpgrade"
- ></span
- >
- <img
- v-if="item.iconBlob"
- :src="
- item.iconBlob.indexOf(',') > 0
- ? item.iconBlob
- : `data:image/png;base64,${item.iconBlob}`
- "
- alt
- />
- <img v-else :src="item.icon" alt />
- </div>
- <div class="desc">
- <div class="desc-1">{{ item.sdk_name || item.name }}</div>
- <div class="desc-2">鐗堟湰 {{ item.version }}</div>
- </div>
- <div class="right-icon">
- <span class="icon iconfont"></span>
- </div>
- </div>
- </div>
-
- <!-- <div class="down-all-btn">
- <el-button plain size="small" @click="batchUpdate('both')" round
- >鍏ㄩ儴鏇存柊</el-button
- >
- </div> -->
- </div>
-
- <div class="main-content">
- <!-- <div class="main-title">搴旂敤涓績</div> -->
- <div class="tab-btns" v-if="activeName != '绂荤嚎鍗囩骇/瀹夎'">
- <div class="group-left">
- <div
- class="tab"
- @click="pickTab('sdk')"
- :class="activeTab == 'sdk' ? 'tab-active' : ''"
- >
- 绠楁硶杞欢
- </div>
- <div
- class="tab"
- @click="pickTab('app')"
- :class="activeTab == 'app' ? 'tab-active' : ''"
- >
- 搴旂敤杞欢
- </div>
- </div>
-
- <div
- class="batch-update"
- v-if="activeName == '鏇存柊' && tempList.length"
- >
- <el-button
- size="small"
- type="primary"
- round
- @click="batchUpdate"
- >鍏ㄩ儴鏇存柊</el-button
- >
- </div>
- </div>
- <div
- class="front-page-items"
- v-if="activeName != '绂荤嚎鍗囩骇/瀹夎'"
- >
- <div
- class="front-page-item"
- v-for="(item, index) in tempList"
- :key="index"
- @click="checkDetail(item)"
- >
- <div class="icon-img">
- <span class="icon iconfont" v-if="item.isUpgrade"
- ></span
- >
- <img
- v-if="item.iconBlob"
- :src="
- item.iconBlob.indexOf(',') > 0
- ? item.iconBlob
- : `data:image/png;base64,${item.iconBlob}`
- "
- alt
- />
- <img v-else :src="item.icon" alt />
- </div>
- <div class="desc">
- <div class="desc-1">{{ item.sdk_name || item.name }}</div>
- <div class="desc-2">鐗堟湰 {{ item.version }}</div>
- </div>
- <div class="right-btn">
- <el-button
- size="small"
- type="primary"
- class="other-btn"
- round
- @click="checkDetail(item)"
- v-if="activeName == '搴旂敤涓績'&&item.price>0"
- >婵�娲�</el-button
- >
- <el-button
- size="small"
- type="primary"
- class="update-btn"
- round
- @click.stop="actived(item)"
- v-if="activeName == '搴旂敤涓績'&&item.price==0"
- >瀹夎</el-button
- >
- <el-button
- size="small"
- type="primary"
- class="check-btn"
- round
- v-if="
- activeName == '宸叉縺娲�' &&
- ((activeTab == 'sdk' && !item.isUpgrade) ||
- (activeTab == 'app' &&
- !item.isUpgrade &&
- !item.isDefault))
- "
- >鏌ョ湅</el-button
- >
- <el-button
- size="small"
- type="primary"
- class="check-btn"
- round
- v-if="
- activeName == '宸叉縺娲�' &&
- activeTab == 'app' &&
- item.isDefault &&
- !item.isUpgrade
- "
- >鏌ョ湅</el-button
- >
- <el-button
- size="small"
- type="primary"
- class="other-btn"
- round
- v-if="
- activeName == '宸叉縺娲�' &&
- activeTab == 'app' &&
- item.isDefault &&
- item.isUpgrade
- "
- >鍗囩骇</el-button
- >
- <el-button
- size="small"
- type="primary"
- class="update-btn"
- round
- @click.stop="donwloadSDK(item)"
- v-if="
- (activeName == '鏇存柊' || activeName == '宸叉縺娲�') &&
- activeTab == 'sdk' &&
- item.isUpgrade &&
- !item.upgradeLoading
- "
- >鏇存柊</el-button
- >
- <span
- class="icon iconfont rocket-icon"
- v-if="
- activeName == '鏇存柊' &&
- item.isUpgrade &&
- item.upgradeLoading &&
- rocketIf
- "
- ></span
- >
- <span
- class="icon iconfont rocket-icon"
- v-if="
- activeName == '鏇存柊' &&
- item.isUpgrade &&
- item.upgradeLoading &&
- !rocketIf
- "
- ></span
- >
- <el-button
- size="small"
- type="primary"
- class="update-btn"
- round
- @click.stop="downloadApp(item, 'upgrade')"
- v-if="
- (activeName == '鏇存柊' || activeName == '宸叉縺娲�') &&
- activeTab == 'app' &&
- item.isUpgrade &&
- !item.upgradeLoading
- "
- >鏇存柊</el-button
- >
-
- <div class="status">
- {{ item.progressMsg }}
- </div>
- </div>
- </div>
-
- <div
- class="front-page-item item-dimmed"
- v-for="(item, index) in tempDarkList"
- :key="index"
- @click="checkDetail(item, 'activeNotInstall')"
- >
- <div class="icon-img">
- <img
- v-if="item.iconBlob"
- :src="
- item.iconBlob.indexOf(',') > 0
- ? item.iconBlob
- : `data:image/png;base64,${item.iconBlob}`
- "
- alt
- />
- <img v-else :src="item.icon" alt />
- </div>
- <div class="desc">
- <div class="desc-1">{{ item.sdk_name || item.name }}</div>
- <div class="desc-2">鐗堟湰 {{ item.version }}</div>
- </div>
- <div class="right-btn">
- <el-button
- size="small"
- type="primary"
- class="other-btn"
- round
- v-if="activeTab == 'sdk' && !item.upgradeLoading"
- @click.stop="donwloadSDK(item)"
- >瀹夎</el-button
- >
- <el-button
- size="small"
- type="primary"
- class="other-btn"
- round
- v-if="activeTab == 'app' && !item.upgradeLoading"
- @click.stop="downloadApp(item)"
- >瀹夎</el-button
- >
- <div class="spin-icon">
- <span
- class="icon iconfont anz-font"
- v-if="item.upgradeLoading"
- ></span
- >
- </div>
- <div class="status">
- {{ item.progressMsg }}
- </div>
- </div>
- </div>
- </div>
-
- <div class="upload-pkg" v-if="activeName == '绂荤嚎鍗囩骇/瀹夎'">
- <div class="upload-head">
- <div class="left">
- <span class="icon iconfont"></span>
- <span class="txt">涓婁紶瀹夎杞欢</span>
- </div>
- </div>
-
- <FileUploader
- class="upload-demo"
- single
- tip
- :isDrag="true"
- tipWords="鐐瑰嚮涓婁紶"
- uploadPlaceholder="绠楁硶杞欢"
- url="/data/api-v/sdk/upload"
- @complete="onFileUpload"
- @file-added="onFileAdded"
- />
- </div>
- </div>
- </div>
-
- <detailPage
- :detailProductID="detailProductID"
- :detailType="detailType"
- v-if="inDetail"
- @flushSdk="getAllSdk"
- @flushApp="getAllApps"
- @goback="goback"
- ></detailPage>
- </div>
- </div>
- </div>
-
- <el-dialog
- title="瀹夎鍖呬俊鎭�"
- :visible.sync="installDialogVisible"
- width="40%"
- :close-on-click-modal="false"
- >
- <div class="installInfo">
- <template v-if="installAppPackage != null">
- <div>
- <div>
- <span>瀹夎鍖呭悕绉帮細</span>
- <span>{{ installAppPackage.productName }}</span>
- </div>
- <div>
- <span>瀹夎鐗堟湰锛�</span>
- <span>{{ installAppPackage.version }}</span>
- </div>
- <div>
- <span>鏇存柊鍐呭锛�</span>
- <span>{{ installAppPackage.installContent }}</span>
- </div>
- </div>
- </template>
- <template v-if="installSdkPackage != null">
- <div>
- <div>
- <span>瀹夎鍖呭悕绉帮細</span>
- <span>{{ installSdkPackage.productName }}</span>
- </div>
- <div>
- <span>瀹夎鐗堟湰锛�</span>
- <span>{{ installSdkPackage.version }}</span>
- </div>
- <div>
- <span>鏇存柊鍐呭锛�</span>
- <span>{{ installSdkPackage.installContent }}</span>
- </div>
- </div>
- </template>
- <p>纭畾瀹夎锛�</p>
- </div>
- <div slot="footer" class="dialog-footer">
- <el-button @click="installDialogVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="offlineInstall">瀹� 瑁�</el-button>
- </div>
- </el-dialog>
- </div>
-</template>
-<script>
-import {
- findAllSdk,
- downloadSdk,
- installSdk,
- getInstallInfo,
- removeSdk,
- uploadSDK,
-} from "./api";
-import {
- getApps,
- installApp,
- getAppDetail,
- removeApp,
- getUnActivedSdk,
- actPageAlg,
- getUnActivedApp,
- actApp,
-} from "@/api/app";
-import { getUrlKey } from "@/api/utils";
-import FileUploader from "../FileUpload/index";
-import detailPage from "./detail";
-export default {
- name: "algorithmManage",
- components: {
- FileUploader,
- detailPage,
- },
- computed: {
- updateNum() {
- return this.hasNewVersionApp.length + this.hasNewVersionSdk.length;
- },
- isAdmin() {
- if (
- sessionStorage.getItem("userInfo") &&
- sessionStorage.getItem("userInfo") !== ""
- ) {
- let loginName = JSON.parse(sessionStorage.getItem("userInfo")).username;
- return loginName === "superadmin" || loginName === "basic";
- }
- return false;
- },
- },
- data() {
- return {
- installedList: [],
- recomandUpdateList: [],
- hasNewVersionSdk: [],
- activeTab: "sdk",
- hasNewVersionApp: [],
- tempDarkList: [],
- notInstalledList: [],
- showUpload: false,
- detailType: "",
- detailProductID: "",
- buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
- activeName: "搴旂敤涓績",
- patchUpdateStatus: "",
- downloadItem: "",
- downloading: false,
- actStep: 0,
- showQuickPath: true,
- showActivateSuccess: false,
- activeCode: "",
- isInstall: false,
- installDialogVisible: false,
- installAppPackage: null,
- installSdkPackage: null,
- isActive: true,
- isDefaultApp: false,
- unActivedSDKList: [],
- unActivedAppList: [],
- inDetail: false,
- isSDKDialog: true,
- actType: "",
- actId: "",
- input3: "",
- tempList: [],
- select: "",
- activedSdkOrApp: {
- activateCode: "",
- productName: "",
- setting: "",
- expireTime: "",
- licence: "",
- devIds: "",
- },
- installedApps: [],
- storeApps: [],
- installFile: {},
- appUpgreading: true,
- sdkUpgreading: true,
- autoRefresh: true,
- productDetailVisible: false,
- isUpgrading: false,
- productDetail: {},
- otherProducts: [],
- backStack: [],
- toUpdateArr1: [],
- forwardStack: [],
- rocketIf: false,
- backDisable: true,
- forwardDisable: true,
- showInputCode: false,
- needToUpgradeInWin: false,
- showInstallNotActive: false,
- menuArr: ["搴旂敤涓績", "宸叉縺娲�", "绂荤嚎鍗囩骇/瀹夎", "鏇存柊"],
- };
- },
- directives: {
- focus: {
- inserted: function (el) {
- el.querySelector("input").focus();
- },
- },
- },
- mounted() {
- var name = getUrlKey("activeName");
- if (name) {
- this.pickMenu(name);
- }
- this.autoRefreshAppAndSdkState();
- this.getUnActivedList(1);
- this.getUnActivedAppList();
- },
- beforeDestroy() {
- this.autoRefresh = false;
- },
- methods: {
- goback() {
- this.inDetail = false;
- },
- // isShow(authority) {
- // return (
- // this.isAdmin || this.buttonAuthority.indexOf("," + authority + ",") > -1
- // );
- // },
- batchUpdate(s) {
- if (s == "both") {
- this.batchUpdateSDK();
- this.batchUpdateApp();
- } else if (this.activeTab == "sdk") {
- this.batchUpdateSDK();
- } else {
- this.batchUpdateApp();
- }
- },
- batchUpdateSDK() {
- this.hasNewVersionSdk.forEach((sdk) => {
- this.donwloadSDK(sdk);
- });
- },
- batchUpdateApp() {
- this.hasNewVersionApp.forEach((app) => {
- this.downloadApp(app, "upgrade");
- });
- },
- pickMenu(name) {
- this.activeName = name;
- this.activeTab = "sdk";
- this.showQuickPath = true;
- switch (name) {
- case "搴旂敤涓績":
- this.tempList = this.unActivedSDKList;
- this.tempDarkList = [];
- break;
- case "宸叉縺娲�":
- this.tempList = this.installedList;
- this.tempDarkList = this.notInstalledList;
- break;
-
- case "鏇存柊":
- this.showQuickPath = false;
- this.tempList = this.hasNewVersionSdk;
- this.tempDarkList = [];
- break;
- default:
- this.tempList = [];
- this.tempDarkList = [];
- break;
- }
- },
- pickTab(val) {
- if (val) {
- this.activeTab = val;
- }
- if (this.activeName == "搴旂敤涓績") {
- this.tempList =
- this.activeTab == "sdk"
- ? this.unActivedSDKList
- : this.unActivedAppList;
- this.tempDarkList = [];
- } else if (this.activeName == "宸叉縺娲�") {
- this.tempList =
- this.activeTab == "sdk" ? this.installedList : this.installedApps;
- this.tempDarkList =
- this.activeTab == "sdk" ? this.notInstalledList : this.storeApps;
- } else if (this.activeName == "鏇存柊") {
- this.tempList =
- this.activeTab == "sdk"
- ? this.hasNewVersionSdk
- : this.hasNewVersionApp;
-
- this.tempDarkList = [];
- }
- },
- // closeDial() {
- // this.productDetailVisible = false;
- // this.productDetail = {};
- // this.otherProducts = [];
- // },
- checkDetail(item, typ) {
- this.inDetail = true;
- this.detailProductID = item.id;
- if (typ) {
- this.detailType = typ;
- } else {
- this.detailType = this.activeName == "搴旂敤涓績" ? "inactive" : "active";
- }
- },
- // checkInWindow(item) {
- // this.backStack.push([this.productDetail, this.otherProducts]);
- // this.backDisable = false;
- // this.checkIsDefOrNot(item.id);
-
- // let _this = this;
- // getAppDetail({ id: item.id }).then((res) => {
- // _this.productDetail = res.data.detail;
- // _this.productDetail.iconBlob = item.iconBlob;
- // this.actId = _this.productDetail.productBaseId;
- // let flag = false;
- // const allNeedToNew = [
- // ...this.hasNewVersionSdk,
- // ...this.hasNewVersionApp,
- // ];
- // for (let i = 0; i < allNeedToNew.length; i++) {
- // const item = allNeedToNew[i];
- // if (item.id == _this.productDetail.productBaseId) {
- // flag = true;
- // }
- // }
- // this.needToUpgradeInWin = flag;
- // _this.productDetail.isUpgrade = flag;
-
- // _this.otherProducts = res.data.randoms;
- // });
- // },
- checkIsDefOrNot(id) {
- if (id.length > 10) {
- this.isDefaultApp = false;
- } else {
- this.isDefaultApp = true;
- }
- },
- // backwards() {
- // if (this.backStack.length == 0) {
- // this.backDisable = true;
- // return;
- // }
- // this.forwardStack.push([this.productDetail, this.otherProducts]);
- // let item = this.backStack.pop();
- // this.productDetail = item[0];
- // this.checkIsDefOrNot(this.productDetail.productBaseId);
- // this.otherProducts = item[1];
- // this.forwardDisable = false;
- // if (this.backStack.length == 0) {
- // this.backDisable = true;
- // }
- // },
- forwards() {
- if (this.forwardStack.length == 0) {
- this.forwardDisable = true;
- return;
- }
-
- this.backStack.push([this.productDetail, this.otherProducts]);
- this.backDisable = false;
- let item = this.forwardStack.pop();
-
- this.productDetail = item[0];
- this.otherProducts = item[1];
- if (this.forwardStack.length == 0) {
- this.forwardDisable = true;
- }
- },
- offlineInstall() {
- this.installDialogVisible = false;
- this.isInstall = true;
- installSdk(this.installFile)
- .then((res) => {
- if (res.success) {
- this.isInstall = false;
- this.$message.success('瀹夎鎴愬姛,灏嗚烦杞嚦"宸叉縺娲�"涓煡鐪�');
- setTimeout(() => {
- this.getAllSdk();
- window.parent.postMessage({ msg: "AppUpdate" }, "*");
- this.activeName = "宸叉縺娲�";
- }, 3000);
- }
- })
- .catch((e) => {
- this.isInstall = false;
- this.$message.error(e.data);
- });
- },
- downloadApp(app, action) {
- let timer = null;
- app.upgradeLoading = true;
- timer = setInterval(() => {
- this.rocketIf = !this.rocketIf;
- }, 350);
-
- let _this = this;
- installApp({ path: app.id })
- .then((res) => {
- if (res && res.success) {
- _this.$notify.success("瀹夎搴旂敤鎴愬姛");
- clearInterval(timer);
- app.upgradeLoading = false;
- setTimeout(() => {
- window.parent.postMessage({ msg: "AppUpdate" }, "*");
- }, 3000);
- } else {
- }
- })
- .catch((e) => {
- _this.$notify.warning(e.data);
- clearInterval(timer);
- app.upgradeLoading = false;
- });
- // 寮�鍚嚜鍔ㄥ埛鏂�
- this.appUpgreading = true;
- },
- async getAllApps() {
- let iArry = [];
- let sArry = [];
- let nArry = [];
- let rsp = await getApps();
- if (rsp && rsp.success) {
- // 閬嶅巻app鐨勮繃绋嬮噸缃�
- this.appUpgreading = false;
-
- rsp.data.forEach((item) => {
- let obj = Object.assign(
- { unloadLoading: false, upgradeLoading: false },
- item
- );
- if (
- obj.progressMsg !== "" &&
- obj.progressMsg !== "宸插畨瑁�" &&
- obj.progressMsg != "100%"
- ) {
- obj.upgradeLoading = true;
- this.appUpgreading = true;
- }
-
- if (obj.upgradeDone) {
- this.$notify.success(1 ? "绠楁硶瀹夎鎴愬姛" : "绠楁硶鍗囩骇鎴愬姛");
- }
-
- item.installed ? iArry.push(obj) : sArry.push(obj);
- item.isUpgrade && nArry.push(obj);
- });
- }
- this.installedApps = iArry;
- this.storeApps = sArry;
- this.hasNewVersionApp = nArry;
- },
- unloadApp(app) {
- let _this = this;
- this.$confirm("纭畾瑕佸嵏杞借搴旂敤鍚�?", "鎻愮ず")
- .then(() => {
- _this.productDetailVisible = false;
-
- app.unloadLoading = true;
- removeApp({ appId: app.id })
- .then((res) => {
- if (res && res.success) {
- app.unloadLoading = false;
- _this.getAllApps();
- window.parent.postMessage({ msg: "AppUpdate" }, "*");
- _this.$notify.success("鍗歌浇搴旂敤鎴愬姛");
- }
- })
- .catch((e) => {
- app.unloadLoading = false;
- });
- })
- .catch((e) => {});
- },
- // toActivatePage(item) {
- // this.checkDetail(item, "inactive");
- // this.actType = this.activeTab;
- // this.actId = item.id;
- // this.actStep = 0;
- // this.activeCode = "";
- // this.activedSdkOrApp = this.newActInfo();
- // },
- // cancelActivate() {
- // this.showInputCode = false;
- // this.activeCode = "";
- // },
- newActInfo() {
- return {
- activateCode: "",
- productName: "",
- setting: "",
- expireTime: "",
- licence: "",
- devIds: "",
- };
- },
- getUnActivedList(v) {
- getUnActivedSdk().then((res) => {
- if (res.code == 200) {
- this.unActivedSDKList = res.data;
- const len = this.unActivedSDKList.length;
- const set = new Set();
- if (len <= 3) {
- this.recomandUpdateList = [...this.unActivedSDKList];
- } else {
- for (let i = 0; i < 3; i++) {
- const pickI = Math.floor(Math.random() * len);
- if (set.has(pickI)) {
- i--;
- continue;
- }
- set.add(pickI);
- this.recomandUpdateList.push(this.unActivedSDKList[pickI]);
- }
- }
- v == 1 ? (this.tempList = res.data) : null;
- }
- });
- },
- getUnActivedAppList() {
- getUnActivedApp().then((res) => {
- if (res.code == 200) {
- this.unActivedAppList = res.data;
- this.pickTab()
- }
- });
- },
- actived(item) {
- let _this = this;
- if (this.activeTab == "sdk") {
- actPageAlg(item.id, "")
- .then((res) => {
- if (res.data.isSuccess) {
- this.productDetailVisible = false;
- _this.activedSdkOrApp = res.data.successMsg;
- this.showActivateSuccess = true;
- _this.actStep++;
- _this.getUnActivedList(1);
- _this.getAllSdk();
- } else {
- _this.$notify.error(res.data.failMsg.failMsg);
- }
- })
- .catch((e) => {
- console.log(e);
- });
- } else if (this.activeTab == "app") {
- //婵�娲诲簲鐢�
- actApp(item.id, "")
- .then((res) => {
- if (res.data.isSuccess) {
- this.productDetailVisible = false;
- _this.activedSdkOrApp = res.data.successMsg;
- this.showActivateSuccess = true;
- _this.actStep++;
- _this.getUnActivedAppList();
- _this.getAllApps();
- } else {
- _this.$notify.error(res.data.failMsg.failMsg);
- }
- })
- .catch((e) => {
- console.log(e);
- });
- }
- },
- // checkMyAlgorith() {
- // this.showActivateSuccess = false;
- // this.activeName = "宸叉縺娲�";
- // },
- onFileUpload(file) {
- this.patchFile = { ...file };
- this.fileAdded = true;
- const h = this.$createElement;
- //涓婁紶瀹屾垚鑾峰彇瀹夎淇℃伅
- let _this = this;
- getInstallInfo(file)
- .then((res) => {
- _this.installFile = file;
- if (res.success) {
- _this.installDialogVisible = true;
- if (res.data.apps.length > 0) {
- _this.installAppPackage = {
- appId: res.data.apps[0].appId,
- version: res.data.apps[0].version,
- productName: res.data.productName,
- installContent: res.data.apps[0].installContent,
- };
- }
- if (res.data.sdks.length > 0) {
- _this.installSdkPackage = {
- appId: res.data.sdks[0].sdkId,
- version: res.data.sdks[0].version,
- productName: res.data.productName,
- installContent: res.data.sdks[0].installContent,
- };
- }
- } else {
- this.$message.error(res.msg);
- }
- })
- .catch((e) => {
- this.$message.error(e.msg);
- });
- },
- // openApp() {
- // window.parent.postMessage(
- // { msg: "toOpenApp?" + this.productDetail.productBaseId },
- // "*"
- // );
- // },
- onFileAdded(f) {
- this.patchUpdateStatus = "";
- },
- async getAllSdk() {
- let installedList = [];
- let unInstalledList = [];
- let hasNewVersionList = [];
- let res = await findAllSdk();
- if (res && res.success) {
- this.sdkUpgreading = false;
-
- res.data.forEach((item) => {
- let obj = Object.assign(
- { unloadLoading: false, upgradeLoading: false },
- item
- );
- if (
- obj.progressMsg !== "" &&
- obj.progressMsg !== "宸插畨瑁�" &&
- obj.progressMsg !== "100%"
- ) {
- obj.upgradeLoading = true;
- this.sdkUpgreading = true;
- }
-
- //绠楁硶杞欢 宸插畨瑁呭叾涓寘鍚緟鍗囩骇 鏈畨瑁�
- item.installed ? installedList.push(obj) : unInstalledList.push(obj);
- item.isUpgrade ? hasNewVersionList.push(obj) : null;
- });
- }
- this.installedList = installedList;
- this.notInstalledList = unInstalledList;
- this.toUpdateArr1 = this.installedList.slice(0, 10);
- this.hasNewVersionSdk = hasNewVersionList;
- this.pickTab()
- },
- // unloadSDKinWin() {
- // let appToUnload;
- // let sdkToUnload;
- // if (this.productDetail.productTypeName == "搴旂敤") {
- // appToUnload = this.installedApps.find((item) => {
- // return item.id == this.productDetail.productBaseId;
- // });
- // this.unloadApp(appToUnload);
- // } else {
- // sdkToUnload = this.installedList.find((item) => {
- // return item.id == this.productDetail.productBaseId;
- // });
- // this.unloadSdk(sdkToUnload);
- // }
- // },
- // unLoadSdkOrApp(item) {
- // this.activeTab == "sdk" ? this.unloadSdk(item) : this.unloadApp(item);
- // },
- 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.success("鍗歌浇瀹屾垚");
- _this.getAllSdk();
- window.parent.postMessage({ msg: "AppUpdate" }, "*");
- }
- })
- .catch((e) => {
- sdk.unloadLoading = false;
- });
- })
- .catch((e) => {});
- },
-
- donwloadSDK(item) {
- let timer = null;
- item.upgradeLoading = true;
- timer = setInterval(() => {
- this.rocketIf = !this.rocketIf;
- }, 350);
- this.downloadItem = item.id;
- downloadSdk({ path: item.id })
- .then((rsp) => {
- clearInterval(timer);
- item.upgradeLoading = false;
- this.downloadItem = "";
-
- window.parent.postMessage({ msg: "AppUpdate" }, "*");
- })
- .catch((err) => {
- this.$notify.warning(err.data);
- item.upgradeLoading = false;
- this.downloadItem = "";
- });
- // 寮�鍚嚜鍔ㄥ埛鏂�
- this.sdkUpgreading = true;
- },
- autoRefreshAppAndSdkState() {
- // 鍏抽棴鍚庨��鍑�
- if (!this.autoRefresh) {
- return;
- }
- if (this.appUpgreading) {
- this.getAllApps();
- }
- if (this.sdkUpgreading) {
- this.getAllSdk();
- }
- let _this = this;
- setTimeout(() => {
- _this.autoRefreshAppAndSdkState();
- }, 500);
- },
- },
-};
-</script>
-<style lang="scss">
-.s-task-manage {
- width: 100% !important;
- height: 100%;
- box-sizing: border-box;
- text-align: left;
- background-color: #fff;
-}
-
-.task-manage {
- height: 100%;
- .installModel {
- width: 100%;
- height: 100%;
- background-color: rgba(0, 0, 0, 0.7);
- position: fixed;
- top: 0;
- left: 0;
- z-index: 100;
- .progress-bar {
- width: 70%;
- height: 17px;
- border-radius: 3pxd;
- background-color: rgb(227, 229, 231);
- position: absolute;
- top: 50%;
- left: 50%;
- background: url("/images/algo/green.gif");
- overflow: hidden;
- transform: translate(-50%, -50%);
- .inner-bar {
- position: absolute;
- top: 0;
- left: 0;
- width: 0;
- height: 100%;
- transition: width 3s;
- background-color: #3d68e1;
- }
- }
- }
-
- .super {
- width: 100%;
- height: 100%;
- // caret-color: rgba(0, 0, 0, 0);
- .title {
- margin-bottom: 10px;
- line-height: 30px;
- font-family: PingFangSC-Medium;
- font-size: 16px;
- color: #222222;
- }
- .left-box {
- height: 100%;
- box-sizing: border-box;
- .nav-box {
- height: 200px;
- display: flex;
- justify-content: space-between;
- padding: 35px 60px;
- position: relative;
- .nav-box-menu {
- width: 200px;
- height: 200px;
- z-index: 99;
- .menu-item {
- font-size: 14px;
- line-height: 50px;
- height: 50px;
- letter-spacing: 0.5px;
- color: #828282;
- padding-left: 20px;
- border-left: 3px solid #f3f6fc;
- cursor: pointer;
- caret-color: transparent;
- sup {
- background-color: #f52323;
- font-size: 12px;
- color: #fff;
- height: 18px;
- line-height: 18px;
- padding: 0 3.5px;
- border-radius: 50%;
- }
- }
- .menu-item:hover {
- font-weight: 600;
- color: #333;
- transition: all 0.15s;
- }
- .menu-item-actiove {
- border-left: 3px solid #23d7ee;
- font-weight: 700;
- font-size: 16px;
- color: #333;
- }
- }
- .nav-box-search {
- z-index: 99;
- position: relative;
- .all-scene {
- position: absolute;
- z-index: 100;
- right: 64px;
-
- top: 10px;
- font-size: 12px;
- }
- .el-input {
- position: relative;
- font-size: 12px;
- border: 2px solid #f2f2f7;
- border-radius: 20px;
- .el-input__inner {
- border: none;
- height: 30px;
- line-height: 30px;
- padding: 0 12px;
- }
- .el-input-group__prepend {
- border-right: 0;
- border: none;
- border-radius: 20px;
- background: #fff;
- padding: 0 0 0 15px;
-
- i {
- font-weight: 600;
- color: #333;
- font-size: 16px;
- }
- }
- .el-input-group--append .el-input__inner,
- .el-input-group__prepend {
- border-top-right-radius: 0;
- border-bottom-right-radius: 0;
- border: none;
- }
- .el-input-group__append {
- border-left: 0;
- border: none;
- border-radius: 20px;
- width: 52px;
- background: linear-gradient(
- 180deg,
- #ecfcfe 0%,
- #ebf4fd 47.92%,
- #f4f4fe 100%
- );
- .el-input--suffix {
- border: none;
- .el-input__icon {
- line-height: 30px;
- }
- .el-input__inner {
- font-size: 12px;
- font-weight: bold;
- letter-spacing: 0.5px;
- padding: 0 0px 0 30px;
- color: #474747;
- }
- .el-input__suffix {
- display: none;
- }
- }
- .el-input__inner::placeholder {
- color: rgb(71, 71, 71);
- }
- .el-select-dropdown {
- min-width: 120px !important;
- left: -26px !important;
- background: rgba(236, 245, 253, 0.6);
- border-radius: 2px;
- border: none;
- .el-select-dropdown__item {
- height: 22px;
- line-height: 22px;
- font-size: 12px;
- letter-spacing: 0.4px;
- color: #333333;
- .icon {
- margin-right: 5px;
- font-size: 15px;
- }
- }
- .el-select-dropdown__item.hover,
- .el-select-dropdown__item:hover {
- background-color: #ebf4fd;
- font-weight: 600;
- }
- }
- }
- .el-input-group__prepend .el-select {
- display: inline-block;
- margin: -10px -20px;
- border: none;
- border-radius: 20px;
- background: linear-gradient(
- 180deg,
- #ecfcfe 0%,
- #ebf4fd 47.92%,
- #f4f4fe 100%
- );
- }
- }
- }
- .bg-img-wrap {
- position: absolute;
- z-index: 1;
- right: 0;
- top: 41px;
- height: 229px;
- img {
- height: 100%;
- }
- }
- }
- .quick-path {
- position: relative;
- height: 200px;
- margin: 0 60px;
- z-index: 99;
- background: linear-gradient(
- 180deg,
- #ecfcfe 0%,
- #ebf4fd 47.92%,
- #f4f4fe 100%
- );
- border-radius: 4px;
- height: 75px;
- display: flex;
- align-items: center;
- .left-items {
- display: flex;
- }
- .quick-item {
- display: flex;
- cursor: pointer;
- padding: 2px 20px;
- height: 52px;
- box-sizing: border-box;
-
- .icon-img {
- width: 48px;
- height: 48px;
- position: relative;
- .icon {
- position: absolute;
- right: -7px;
- top: -7px;
- font-size: 13px;
- }
- img {
- width: 48px;
- height: 48px;
- }
- }
- .desc {
- box-sizing: border-box;
- padding: 0 12px;
- color: #828282;
- width: 140px;
- .desc-1 {
- font-size: 14px;
- font-weight: bold;
- line-height: 26px;
- height: 26px;
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
- }
- .desc-2 {
- font-size: 12px;
- }
- }
- .right-icon {
- padding: 2px 0;
-
- .icon {
- font-size: 21px;
- }
- }
- }
- .quick-item:not(:last-child) {
- border-right: 1px solid #e0e0e0;
- }
- .down-all-btn {
- position: absolute;
- right: 30px;
- .el-button {
- width: 78px;
- font-size: 12px;
- font-weight: 600;
- padding: 3px 10px;
- border: 1px solid #eef0f7;
- }
- }
- }
- .main-content {
- padding: 35px 82px;
- z-index: 99;
- .main-title {
- line-height: 25px;
- font-size: 16px;
- font-weight: 600;
- margin-bottom: 10px;
- }
- .tab-btns {
- display: flex;
- justify-content: space-between;
- .group-left {
- display: flex;
- .tab {
- font-size: 14px;
- margin-right: 25px;
- line-height: 28px;
- cursor: pointer;
- color: #828282;
- }
- .tab-active {
- border-bottom: 2px solid #23d7ee;
- color: #333333;
- font-weight: bold;
- }
- }
-
- .batch-update {
- display: flex;
- align-items: center;
- .el-button {
- padding: 3px 12px;
- background-color: #1dd4ec !important;
- border-color: #1dd4ec !important;
- border-radius: 22px;
- }
- .el-button--primary:hover {
- background: #089fb3 !important;
- border-color: #089fb3 !important;
- }
- }
- }
- .front-page-items {
- padding-top: 25px;
- .front-page-item {
- float: left;
- display: flex;
- margin: 0 5px;
- margin-bottom: 15px;
- box-sizing: border-box;
- width: 274px;
-
- justify-content: center;
- cursor: pointer;
-
- padding: 10px 0;
- height: 76px;
- border-radius: 4px;
-
- .icon-img {
- width: 58px;
- height: 58px;
- position: relative;
- .icon {
- position: absolute;
- right: -9px;
- top: -9px;
- font-size: 16px;
- }
- img {
- width: 58px;
- height: 58px;
- border-radius: 10px;
- }
- }
- .desc {
- box-sizing: border-box;
- padding: 0 12px;
- width: 147px;
-
- .desc-1 {
- font-size: 14px;
- font-weight: bold;
- color: #4f4f4f;
- line-height: 28px;
- height: 28px;
- letter-spacing: 0.1px;
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
- }
- .desc-2 {
- color: #828282;
- font-size: 12px;
- }
- }
- .right-btn {
- padding: 2px 0;
- width: 50px;
- text-align: center;
- position: relative;
- .check-btn {
- background-color:#FFFFFF !important;
- border-color: #BDBDBD !important;
- color: #333333;
- }
- .update-btn {
- border-color: #23d7ee !important;
- background-color: rgba(29, 212, 236, 0.1) !important;
- color: #4f4f4f;
- }
- .other-btn {
- background-color: #1dd4ec !important;
- border-color: #1dd4ec !important;
- color: #ffffff;
- }
- @keyframes spin {
- from {
- transform: rotate(0deg);
- }
- to {
- transform: rotate(360deg);
- }
- }
- .anz-font {
- font-size: 28px;
- color: #333;
- }
-
- .spin-icon {
- animation: spin 0.8s linear infinite;
- }
- .status {
- font-size: 12px;
- color: #828282;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- min-width: 100px;
- text-align: end;
- position: absolute;
- right: 0;
- margin-top: 2px;
- }
- .rocket-icon {
- font-size: 20px;
- }
- .el-button {
- padding: 3px 12px;
- border-radius: 22px;
- font-weight: bold;
- letter-spacing: 0.5px;
- }
- }
- }
- .front-page-item:hover {
- background-color: #f2f2f7;
- }
- .item-dimmed {
- color: gray;
- filter: grayscale(100%);
- }
- }
- .front-page-items:after {
- content: "";
- display: block;
- height: 0;
- clear: both;
- visibility: hidden;
- }
- .upload-pkg {
- .upload-head {
- display: flex;
- justify-content: space-between;
- align-items: center;
- .left {
- display: flex;
- align-items: center;
- .iconfont {
- font-size: 18px;
- margin-right: 6px;
- }
- .txt {
- font-size: 16px;
- }
- }
- .right {
- .icon {
- margin-right: 11px;
- font-size: 17px;
- cursor: pointer;
- }
- }
- }
- }
- .upload-demo {
- margin: 30px 0px;
- .drag-txt {
- width: 340px;
- height: 45px;
- border: 1px dashed #bdbdbd;
- display: flex;
- margin-top: 30px;
- align-items: center;
- justify-content: center;
- color: #828282;
- font-size: 14px;
- }
- .txt-btn {
- width: 78px;
- margin-top: 18px;
- height: 19px;
- background: #23d7ee;
- border-radius: 22px;
- color: #ffffff;
- font-weight: bold;
- font-size: 12px;
- }
- }
- }
- }
- .mask {
- position: absolute;
- width: 100%;
- height: 100%;
- background: rgba(0, 0, 0, 0.65);
- backdrop-filter: blur(1px) brightness(100%);
- text-align: center;
- z-index: 1;
- border-radius: 3px;
- display: none;
- .info-onmask {
- color: #fff;
- }
- .left-top {
- position: absolute;
- left: 5px;
- top: 5px;
- font-size: 12px;
- color: #90d6ff;
- }
- .mask-btn {
- width: 100%;
- display: flex;
- }
- i {
- color: #fff;
- position: relative;
- top: 40%;
- display: contents;
- }
- i:hover {
- color: rgba(255, 255, 255, 0.685);
- }
- }
-
- .el-input {
- position: relative;
- font-size: 14px;
- // display: inline-block;
- // width: 80%;
- }
-
- .el-button--cancle {
- background: #eaeaea;
- border-radius: 2px;
- border-color: #eaeaea;
- font-family: PingFangSC-Medium;
- font-size: 13px;
- color: #222222;
- margin-right: 12px;
- }
- }
-}
-</style>
-
+<template>
+ <div class="s-task-manage">
+ <div style="height: 100%">
+ <div class="flex-box task-manage">
+ <div class="installModel" v-if="isInstall">
+ <div class="progress-bar">
+ <div class="inner-bar"></div>
+ </div>
+ </div>
+ <div class="super">
+ <div class="left-box" v-if="!inDetail">
+ <div class="nav-box">
+ <div class="nav-box-menu">
+ <div
+ v-for="(name, index) in menuArr"
+ :key="index"
+ class="menu-item"
+ :class="activeName == name ? 'menu-item-actiove' : ''"
+ @click="pickMenu(name)"
+ >
+ {{ name }}
+ <sup v-if="index == 3 && updateNum != 0">{{ updateNum }}</sup>
+ </div>
+ </div>
+ <div class="nav-box-search">
+ <span class="icon iconfont all-scene"></span>
+ <el-input
+ placeholder="鎼滅储"
+ v-model="inputText"
+ @change="searchAll"
+ class="input-with-select"
+ >
+ <i class="el-icon-search" slot="prepend"></i>
+ <el-select
+ v-model="select"
+ slot="append"
+ placeholder="閫夋嫨鍦烘櫙"
+ :popper-append-to-body="false"
+ >
+ <el-option label="閾佽矾鍦烘櫙" value="1">
+ <span class="icon iconfont"></span>
+ <span>閾佽矾鍦烘櫙</span>
+ </el-option>
+ <el-option label="瀹夊叏鍦烘櫙" value="2">
+ <span class="icon iconfont"></span>
+ <span>瀹夊叏鍦烘櫙</span>
+ </el-option>
+ <el-option label="閫氱敤鍦烘櫙" value="3">
+ <span class="icon iconfont"></span>
+ <span>閫氱敤鍦烘櫙</span>
+ </el-option>
+ <el-option label="鏍″洯鍥尯" value="4">
+ <span class="icon iconfont"></span>
+ <span>鏍″洯鍥尯</span>
+ </el-option>
+ </el-select>
+ </el-input>
+ </div>
+
+ <div class="bg-img-wrap">
+ <img src="/images/appCenter/Group-112.png" alt="" />
+ </div>
+ </div>
+ <div class="quick-path" v-if="showQuickPath">
+ <div class="left-items">
+ <div
+ class="quick-item"
+ v-for="(item, index) in recomandUpdateList"
+ :key="index"
+ @click="checkDetail(item, 'inactive', item.sdk_name)"
+ >
+ <div class="icon-img">
+ <span class="icon iconfont" v-if="item.isUpgrade"
+ ></span
+ >
+ <img
+ v-if="item.iconBlob"
+ :src="
+ item.iconBlob.indexOf(',') > 0
+ ? item.iconBlob
+ : `data:image/png;base64,${item.iconBlob}`
+ "
+ alt
+ />
+ <img v-else :src="item.icon" alt />
+ </div>
+ <div class="desc">
+ <el-tooltip
+ :content="item.sdk_name || item.name"
+ effect="light"
+ >
+ <div class="desc-1">{{ item.sdk_name || item.name }}</div>
+ </el-tooltip>
+ <div class="desc-2">鐗堟湰 {{ item.version }}</div>
+ </div>
+ <div class="right-icon">
+ <el-tooltip effect="dark" content="涓嬭浇" placement="bottom">
+ <span class="icon iconfont"></span>
+ </el-tooltip>
+ </div>
+ </div>
+ </div>
+
+ <!-- <div class="down-all-btn">
+ <el-button plain size="small" @click="batchUpdate('both')" round
+ >鍏ㄩ儴鏇存柊</el-button
+ >
+ </div> -->
+ </div>
+
+ <div class="main-content">
+ <!-- <div class="main-title">搴旂敤涓績</div> -->
+ <div class="tab-btns" v-if="activeName != '绂荤嚎鍗囩骇/瀹夎'">
+ <div class="group-left">
+ <div
+ class="tab"
+ @click="pickTab('sdk')"
+ :class="activeTab == 'sdk' ? 'tab-active' : ''"
+ >
+ 绠楁硶杞欢
+ </div>
+ <div
+ class="tab"
+ @click="pickTab('app')"
+ :class="activeTab == 'app' ? 'tab-active' : ''"
+ >
+ 搴旂敤杞欢
+ </div>
+ </div>
+
+ <div
+ class="batch-update"
+ v-if="activeName == '鏇存柊' && tempList.length"
+ >
+ <el-button
+ size="small"
+ type="primary"
+ round
+ @click="batchUpdate"
+ >鍏ㄩ儴鏇存柊</el-button
+ >
+ </div>
+ </div>
+ <div
+ class="front-page-items"
+ v-if="activeName != '绂荤嚎鍗囩骇/瀹夎'"
+ >
+ <div
+ class="front-page-item"
+ v-for="(item, index) in tempList"
+ :key="index"
+ @click="checkDetail(item, null, item.sdk_name)"
+ :class="{
+ disabled: activeName == '搴旂敤涓績' && !item.canUpOrIns,
+ }"
+ >
+ <div class="icon-img">
+ <span class="icon iconfont" v-if="item.isUpgrade"
+ ></span
+ >
+ <img
+ v-if="item.iconBlob"
+ :src="
+ item.iconBlob.indexOf(',') > 0
+ ? item.iconBlob
+ : `data:image/png;base64,${item.iconBlob}`
+ "
+ alt
+ />
+ <img v-else :src="item.icon" alt />
+ </div>
+ <div class="desc">
+ <el-tooltip
+ :content="item.sdk_name || item.name"
+ effect="light"
+ >
+ <div class="desc-1">{{ item.sdk_name || item.name }}</div>
+ </el-tooltip>
+ <div class="desc-2">鐗堟湰 {{ item.version }}</div>
+ </div>
+ <div class="right-btn">
+ <el-button
+ size="small"
+ type="primary"
+ class="other-btn"
+ round
+ @click="checkDetail(item, null, item.sdk_name)"
+ v-if="activeName == '搴旂敤涓績' && item.price > 0"
+ >婵�娲�</el-button
+ >
+ <el-button
+ size="small"
+ type="primary"
+ class="update-btn"
+ round
+ @click.stop="actived(item)"
+ v-if="activeName == '搴旂敤涓績' && item.price == 0"
+ >瀹夎</el-button
+ >
+ <el-button
+ size="small"
+ type="primary"
+ class="check-btn"
+ round
+ v-if="
+ activeName == '宸叉縺娲�' &&
+ ((activeTab == 'sdk' && !item.isUpgrade) ||
+ (activeTab == 'app' &&
+ !item.isUpgrade &&
+ !item.isDefault))
+ "
+ >鏌ョ湅</el-button
+ >
+ <el-button
+ size="small"
+ type="primary"
+ class="check-btn"
+ round
+ v-if="
+ activeName == '宸叉縺娲�' &&
+ activeTab == 'app' &&
+ item.isDefault &&
+ !item.isUpgrade
+ "
+ >鏌ョ湅</el-button
+ >
+ <el-button
+ size="small"
+ type="primary"
+ class="other-btn"
+ round
+ v-if="
+ activeName == '宸叉縺娲�' &&
+ activeTab == 'app' &&
+ item.isDefault &&
+ item.isUpgrade
+ "
+ >鍗囩骇</el-button
+ >
+ <el-button
+ size="small"
+ type="primary"
+ class="update-btn"
+ round
+ @click.stop="donwloadSDK(item)"
+ v-if="
+ (activeName == '鏇存柊' || activeName == '宸叉縺娲�') &&
+ activeTab == 'sdk' &&
+ item.isUpgrade &&
+ !item.upgradeLoading
+ "
+ >鏇存柊</el-button
+ >
+ <span
+ class="icon iconfont rocket-icon"
+ v-if="
+ activeName == '鏇存柊' &&
+ item.isUpgrade &&
+ item.upgradeLoading &&
+ rocketIf
+ "
+ ></span
+ >
+ <span
+ class="icon iconfont rocket-icon"
+ v-if="
+ activeName == '鏇存柊' &&
+ item.isUpgrade &&
+ item.upgradeLoading &&
+ !rocketIf
+ "
+ ></span
+ >
+ <el-button
+ size="small"
+ type="primary"
+ class="update-btn"
+ round
+ @click.stop="downloadApp(item, 'upgrade')"
+ v-if="
+ (activeName == '鏇存柊' || activeName == '宸叉縺娲�') &&
+ activeTab == 'app' &&
+ item.isUpgrade &&
+ !item.upgradeLoading
+ "
+ >鏇存柊</el-button
+ >
+
+ <div class="status">
+ {{ item.progressMsg }}
+ </div>
+ </div>
+ </div>
+
+ <div
+ class="front-page-item item-dimmed"
+ v-for="(item, index) in tempDarkList"
+ :key="index"
+ @click="checkDetail(item, 'activeNotInstall', item.sdk_name)"
+ >
+ <div class="icon-img">
+ <img
+ v-if="item.iconBlob"
+ :src="
+ item.iconBlob.indexOf(',') > 0
+ ? item.iconBlob
+ : `data:image/png;base64,${item.iconBlob}`
+ "
+ alt
+ />
+ <img v-else :src="item.icon" alt />
+ </div>
+ <div class="desc">
+ <el-tooltip
+ :content="item.sdk_name || item.name"
+ effect="light"
+ >
+ <div class="desc-1">{{ item.sdk_name || item.name }}</div>
+ </el-tooltip>
+ <div class="desc-2">鐗堟湰 {{ item.version }}</div>
+ </div>
+ <div class="right-btn">
+ <el-button
+ size="small"
+ type="primary"
+ class="other-btn"
+ round
+ v-if="activeTab == 'sdk' && !item.upgradeLoading"
+ @click.stop="donwloadSDK(item)"
+ >瀹夎</el-button
+ >
+ <el-button
+ size="small"
+ type="primary"
+ class="other-btn"
+ round
+ v-if="activeTab == 'app' && !item.upgradeLoading"
+ @click.stop="downloadApp(item)"
+ >瀹夎</el-button
+ >
+ <div class="spin-icon">
+ <span
+ class="icon iconfont anz-font"
+ v-if="item.upgradeLoading"
+ ></span
+ >
+ </div>
+ <div class="status">
+ {{ item.progressMsg }}
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="upload-pkg" v-if="activeName == '绂荤嚎鍗囩骇/瀹夎'">
+ <div class="upload-head">
+ <div class="left">
+ <span class="icon iconfont"></span>
+ <span class="txt">涓婁紶瀹夎杞欢</span>
+ </div>
+ </div>
+
+ <FileUploader
+ class="upload-demo"
+ single
+ tip
+ :sourceType="3"
+ :isDrag="true"
+ :attrs="{ accept: '.zip,.tar,.gz,.tar.gz' }"
+ tipWords="鐐瑰嚮涓婁紶"
+ uploadPlaceholder="绠楁硶杞欢"
+ url="/data/api-v/sdk/upload"
+ @complete="onFileUpload"
+ @file-added="onFileAdded"
+ />
+ </div>
+ </div>
+ </div>
+
+ <detailPage
+ :detailProductID="detailProductID"
+ :detailType="detailType"
+ :detailPrice="detailPrice"
+ :isSdk="isSdk"
+ v-if="inDetail"
+ @flushSdk="getAllSdk"
+ @flushApp="getAllApps"
+ @goback="goback"
+ ></detailPage>
+ </div>
+ </div>
+ </div>
+
+ <el-dialog
+ title="瀹夎鍖呬俊鎭�"
+ :visible.sync="installDialogVisible"
+ width="40%"
+ :close-on-click-modal="false"
+ >
+ <div class="installInfo">
+ <template v-if="installAppPackage != null">
+ <div>
+ <div>
+ <span>瀹夎鍖呭悕绉帮細</span>
+ <span>{{ installAppPackage.productName }}</span>
+ </div>
+ <div>
+ <span>瀹夎鐗堟湰锛�</span>
+ <span>{{ installAppPackage.version }}</span>
+ </div>
+ <div>
+ <span>鏇存柊鍐呭锛�</span>
+ <span>{{ installAppPackage.installContent }}</span>
+ </div>
+ </div>
+ </template>
+ <template v-if="installSdkPackage != null">
+ <div>
+ <div>
+ <span>瀹夎鍖呭悕绉帮細</span>
+ <span>{{ installSdkPackage.productName }}</span>
+ </div>
+ <div>
+ <span>瀹夎鐗堟湰锛�</span>
+ <span>{{ installSdkPackage.version }}</span>
+ </div>
+ <div>
+ <span>鏇存柊鍐呭锛�</span>
+ <span>{{ installSdkPackage.installContent }}</span>
+ </div>
+ </div>
+ </template>
+ <p>纭畾瀹夎锛�</p>
+ </div>
+ <div slot="footer" class="dialog-footer">
+ <el-button @click="installDialogVisible = false">鍙� 娑�</el-button>
+ <el-button type="primary" @click="offlineInstall">瀹� 瑁�</el-button>
+ </div>
+ </el-dialog>
+ </div>
+</template>
+<script>
+import {
+ findAllSdk,
+ downloadSdk,
+ installSdk,
+ getInstallInfo,
+ removeSdk,
+ uploadSDK,
+} from "./api";
+import {
+ getApps,
+ installApp,
+ getAppDetail,
+ removeApp,
+ getUnActivedSdk,
+ actPageAlg,
+ getUnActivedApp,
+ actApp,
+} from "@/api/app";
+import { getUrlKey } from "@/api/utils";
+import FileUploader from "../FileUpload/index";
+import detailPage from "./detail";
+export default {
+ name: "algorithmManage",
+ components: {
+ FileUploader,
+ detailPage,
+ },
+ computed: {
+ updateNum() {
+ return this.hasNewVersionApp.length + this.hasNewVersionSdk.length;
+ },
+ isAdmin() {
+ if (
+ sessionStorage.getItem("userInfo") &&
+ sessionStorage.getItem("userInfo") !== ""
+ ) {
+ let loginName = JSON.parse(sessionStorage.getItem("userInfo")).username;
+ return loginName === "superadmin" || loginName === "basic";
+ }
+ return false;
+ },
+ },
+ data() {
+ return {
+ installedList: [],
+ recomandUpdateList: [],
+ hasNewVersionSdk: [],
+ activeTab: "sdk",
+ hasNewVersionApp: [],
+ tempDarkList: [],
+ notInstalledList: [],
+ showUpload: false,
+ detailType: "",
+ detailProductID: "",
+ detailPrice: "",
+ buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
+ activeName: "搴旂敤涓績",
+ patchUpdateStatus: "",
+ downloadItem: "",
+ downloading: false,
+ actStep: 0,
+ showQuickPath: true,
+ showActivateSuccess: false,
+ activeCode: "",
+ isInstall: false,
+ installDialogVisible: false,
+ installAppPackage: null,
+ installSdkPackage: null,
+ isActive: true,
+ isDefaultApp: false,
+ unActivedSDKList: [],
+ unActivedAppList: [],
+ inDetail: false,
+ isSDKDialog: true,
+ actType: "",
+ actId: "",
+ inputText: "",
+ tempList: [],
+ select: "",
+ activedSdkOrApp: {
+ activateCode: "",
+ productName: "",
+ setting: "",
+ expireTime: "",
+ licence: "",
+ devIds: "",
+ },
+ installedApps: [],
+ storeApps: [],
+ installFile: {},
+ appUpgreading: false,
+ sdkUpgreading: false,
+ autoRefresh: true,
+ productDetailVisible: false,
+ isUpgrading: false,
+ productDetail: {},
+ otherProducts: [],
+ backStack: [],
+ toUpdateArr1: [],
+ forwardStack: [],
+ rocketIf: false,
+ backDisable: true,
+ forwardDisable: true,
+ showInputCode: false,
+ needToUpgradeInWin: false,
+ showInstallNotActive: false,
+ menuArr: ["搴旂敤涓績", "宸叉縺娲�", "绂荤嚎鍗囩骇/瀹夎", "鏇存柊"],
+ };
+ },
+ directives: {
+ focus: {
+ inserted: function (el) {
+ el.querySelector("input").focus();
+ },
+ },
+ },
+ mounted() {
+ var name = getUrlKey("activeName");
+ if (name) {
+ this.pickMenu(name);
+ }
+ this.autoRefreshAppAndSdkState();
+ this.getUnActivedList(1);
+ this.getUnActivedAppList();
+ },
+ beforeDestroy() {
+ this.autoRefresh = false;
+ },
+ methods: {
+ searchAll() {
+ this.getAllApps();
+ this.getAllSdk();
+ this.getUnActivedList(1);
+ this.getUnActivedAppList();
+ },
+ goback() {
+ this.inDetail = false;
+ },
+ batchUpdate(s) {
+ if (s == "both") {
+ this.batchUpdateSDK();
+ this.batchUpdateApp();
+ } else if (this.activeTab == "sdk") {
+ this.batchUpdateSDK();
+ } else {
+ this.batchUpdateApp();
+ }
+ },
+ batchUpdateSDK() {
+ this.hasNewVersionSdk.forEach((sdk) => {
+ this.donwloadSDK(sdk);
+ });
+ },
+ batchUpdateApp() {
+ this.hasNewVersionApp.forEach((app) => {
+ this.downloadApp(app, "upgrade");
+ });
+ },
+ pickMenu(name) {
+ this.activeName = name;
+ this.activeTab = "sdk";
+ this.showQuickPath = true;
+ switch (name) {
+ case "搴旂敤涓績":
+ this.tempList = this.unActivedSDKList;
+ this.tempDarkList = [];
+ break;
+ case "宸叉縺娲�":
+ this.tempList = this.installedList;
+ this.tempDarkList = this.notInstalledList;
+ break;
+ case "鏇存柊":
+ this.showQuickPath = false;
+ this.tempList = this.hasNewVersionSdk;
+ this.tempDarkList = [];
+ break;
+ default:
+ this.tempList = [];
+ this.tempDarkList = [];
+ break;
+ }
+ },
+ pickTab(val) {
+ if (val) {
+ this.activeTab = val;
+ }
+ if (this.activeName == "搴旂敤涓績") {
+ this.tempList =
+ this.activeTab == "sdk"
+ ? this.unActivedSDKList
+ : this.unActivedAppList;
+ this.tempDarkList = [];
+ } else if (this.activeName == "宸叉縺娲�") {
+ this.tempList =
+ this.activeTab == "sdk" ? this.installedList : this.installedApps;
+ this.tempDarkList =
+ this.activeTab == "sdk" ? this.notInstalledList : this.storeApps;
+ } else if (this.activeName == "鏇存柊") {
+ this.tempList =
+ this.activeTab == "sdk"
+ ? this.hasNewVersionSdk
+ : this.hasNewVersionApp;
+
+ this.tempDarkList = [];
+ }
+ },
+ checkDetail(item, typ, sdkName) {
+ /* if (!item.canUpOrIns && typ == "Appcenter") {
+ return false;
+ } */
+ this.isSdk = Boolean(sdkName);
+ this.inDetail = true;
+ this.detailProductID = item.id;
+ this.detailPrice = item.price;
+ if (typ) {
+ this.detailType = typ;
+ } else {
+ this.detailType = this.activeName == "搴旂敤涓績" ? "inactive" : "active";
+ }
+ },
+ checkIsDefOrNot(id) {
+ this.isDefaultApp = id.length <= 10;
+ },
+ forwards() {
+ if (this.forwardStack.length == 0) {
+ this.forwardDisable = true;
+ return;
+ }
+
+ this.backStack.push([this.productDetail, this.otherProducts]);
+ this.backDisable = false;
+ let item = this.forwardStack.pop();
+
+ this.productDetail = item[0];
+ this.otherProducts = item[1];
+ if (this.forwardStack.length == 0) {
+ this.forwardDisable = true;
+ }
+ },
+ offlineInstall() {
+ this.installDialogVisible = false;
+ this.isInstall = true;
+ installSdk(this.installFile)
+ .then((res) => {
+ if (res.success) {
+ this.isInstall = false;
+ this.$message.success('瀹夎鎴愬姛,灏嗚烦杞嚦"宸叉縺娲�"涓煡鐪�');
+ setTimeout(() => {
+ this.getAllSdk();
+ window.parent.postMessage({ msg: "AppUpdate" }, "*");
+ this.activeName = "宸叉縺娲�";
+ }, 3000);
+ }
+ })
+ .catch((e) => {
+ this.isInstall = false;
+ this.$message.error(e.msg);
+ });
+ },
+ downloadApp(app, action) {
+ let timer = null;
+ app.upgradeLoading = true;
+ timer = setInterval(() => {
+ this.rocketIf = !this.rocketIf;
+ }, 350);
+
+ let _this = this;
+ installApp({ path: app.id })
+ .then((res) => {
+ if (res && res.success) {
+ _this.$notify.success("瀹夎搴旂敤鎴愬姛");
+ clearInterval(timer);
+ app.upgradeLoading = false;
+ setTimeout(() => {
+ window.parent.postMessage({ msg: "AppUpdate" }, "*");
+ }, 3000);
+ } else {
+ }
+ })
+ .catch((e) => {
+ _this.$notify.warning(e.msg);
+ clearInterval(timer);
+ app.upgradeLoading = false;
+ });
+ // 寮�鍚嚜鍔ㄥ埛鏂�
+ this.appUpgreading = true;
+ },
+ async getAllApps() {
+ let iArry = [];
+ let sArry = [];
+ let nArry = [];
+ let rsp = await getApps({ appName: this.inputText });
+ if (rsp && rsp.success) {
+ // 閬嶅巻app鐨勮繃绋嬮噸缃�
+ this.appUpgreading = false;
+
+ rsp.data.forEach((item) => {
+ let obj = Object.assign(
+ { unloadLoading: false, upgradeLoading: false },
+ item
+ );
+ if (
+ obj.progressMsg !== "" &&
+ obj.progressMsg !== "宸插畨瑁�" &&
+ obj.progressMsg != "100%"
+ ) {
+ obj.upgradeLoading = true;
+ this.appUpgreading = true;
+ }
+
+ if (obj.upgradeDone) {
+ this.$notify.success(1 ? "绠楁硶瀹夎鎴愬姛" : "绠楁硶鍗囩骇鎴愬姛");
+ }
+
+ item.installed ? iArry.push(obj) : sArry.push(obj);
+ item.isUpgrade && nArry.push(obj);
+ });
+ }
+ this.installedApps = iArry;
+ this.storeApps = sArry;
+ this.hasNewVersionApp = nArry;
+ },
+ unloadApp(app) {
+ let _this = this;
+ this.$confirm("纭畾瑕佸嵏杞借搴旂敤鍚�?", "鎻愮ず")
+ .then(() => {
+ _this.productDetailVisible = false;
+
+ app.unloadLoading = true;
+ removeApp({ appId: app.id })
+ .then((res) => {
+ if (res && res.success) {
+ app.unloadLoading = false;
+ _this.getAllApps();
+ window.parent.postMessage({ msg: "AppUpdate" }, "*");
+ _this.$notify.success("鍗歌浇搴旂敤鎴愬姛");
+ }
+ })
+ .catch((e) => {
+ app.unloadLoading = false;
+ });
+ })
+ .catch((e) => {});
+ },
+ newActInfo() {
+ return {
+ activateCode: "",
+ productName: "",
+ setting: "",
+ expireTime: "",
+ licence: "",
+ devIds: "",
+ };
+ },
+ getUnActivedList(v) {
+ getUnActivedSdk({ sdkName: this.inputText }).then((res) => {
+ if (res.code == 200) {
+ this.unActivedSDKList = res.data;
+ const len = this.unActivedSDKList.length;
+ const set = new Set();
+ if (len <= 3) {
+ this.recomandUpdateList = [...this.unActivedSDKList];
+ } else {
+ for (let i = 0; i < 3; i++) {
+ const pickI = Math.floor(Math.random() * len);
+ if (set.has(pickI)) {
+ i--;
+ continue;
+ }
+ set.add(pickI);
+ this.recomandUpdateList.push(this.unActivedSDKList[pickI]);
+ }
+ }
+ v == 1 ? (this.tempList = res.data) : null;
+ }
+ });
+ },
+ getUnActivedAppList() {
+ getUnActivedApp({ appName: this.inputText }).then((res) => {
+ if (res.code == 200) {
+ this.unActivedAppList = res.data;
+ this.pickTab();
+ }
+ });
+ },
+ actived(item) {
+ if (!item.canUpOrIns) {
+ return false;
+ }
+
+ let _this = this;
+ if (this.activeTab == "sdk") {
+ actPageAlg(item.id, "")
+ .then((res) => {
+ if (res.data.isSuccess) {
+ this.productDetailVisible = false;
+ _this.activedSdkOrApp = res.data.successMsg;
+ this.showActivateSuccess = true;
+ _this.actStep++;
+ _this.getUnActivedList(1);
+ _this.getAllSdk();
+ } else {
+ _this.$notify.error(res.data.failMsg.failMsg);
+ }
+ })
+ .catch((e) => {});
+ } else if (this.activeTab == "app") {
+ //婵�娲诲簲鐢�
+ actApp(item.id, "")
+ .then((res) => {
+ if (res.data.isSuccess) {
+ this.productDetailVisible = false;
+ _this.activedSdkOrApp = res.data.successMsg;
+ this.showActivateSuccess = true;
+ _this.actStep++;
+ _this.getUnActivedAppList();
+ _this.getAllApps();
+ } else {
+ _this.$notify.error(res.data.failMsg.failMsg);
+ }
+ })
+ .catch((e) => {});
+ }
+ },
+ onFileUpload(file) {
+ this.patchFile = { ...file };
+ this.fileAdded = true;
+ const h = this.$createElement;
+ //涓婁紶瀹屾垚鑾峰彇瀹夎淇℃伅
+ let _this = this;
+ getInstallInfo(file)
+ .then((res) => {
+ _this.installFile = file;
+ if (res.success) {
+ _this.installDialogVisible = true;
+ if (res.data.apps.length > 0) {
+ _this.installAppPackage = {
+ appId: res.data.apps[0].appId,
+ version: res.data.apps[0].version,
+ productName: res.data.productName,
+ installContent: res.data.apps[0].installContent,
+ };
+ }
+ if (res.data.sdks.length > 0) {
+ _this.installSdkPackage = {
+ appId: res.data.sdks[0].sdkId,
+ version: res.data.sdks[0].version,
+ productName: res.data.productName,
+ installContent: res.data.sdks[0].installContent,
+ };
+ }
+ } else {
+ this.$message.error(res.msg);
+ }
+ })
+ .catch((e) => {
+ this.$message.error(e.msg);
+ });
+ },
+ onFileAdded(f) {
+ this.patchUpdateStatus = "";
+ },
+ async getAllSdk() {
+ let installedList = [];
+ let unInstalledList = [];
+ let hasNewVersionList = [];
+ let res = await findAllSdk({ sdkName: this.inputText });
+ if (res && res.success) {
+ this.sdkUpgreading = false;
+
+ res.data.forEach((item) => {
+ let obj = Object.assign(
+ { unloadLoading: false, upgradeLoading: false },
+ item
+ );
+ if (
+ obj.progressMsg !== "" &&
+ obj.progressMsg !== "宸插畨瑁�" &&
+ obj.progressMsg !== "100%"
+ ) {
+ obj.upgradeLoading = true;
+ this.sdkUpgreading = true;
+ }
+
+ //绠楁硶杞欢 宸插畨瑁呭叾涓寘鍚緟鍗囩骇 鏈畨瑁�
+ item.installed ? installedList.push(obj) : unInstalledList.push(obj);
+ item.isUpgrade ? hasNewVersionList.push(obj) : null;
+ });
+ }
+ this.installedList = installedList;
+ this.notInstalledList = unInstalledList;
+ this.toUpdateArr1 = this.installedList.slice(0, 10);
+ this.hasNewVersionSdk = hasNewVersionList;
+ this.pickTab();
+ },
+ 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.success("鍗歌浇瀹屾垚");
+ _this.getAllSdk();
+ window.parent.postMessage({ msg: "AppUpdate" }, "*");
+ }
+ })
+ .catch((e) => {
+ sdk.unloadLoading = false;
+ });
+ })
+ .catch((e) => {});
+ },
+ donwloadSDK(item) {
+ let timer = null;
+ item.upgradeLoading = true;
+ timer = setInterval(() => {
+ this.rocketIf = !this.rocketIf;
+ }, 350);
+ this.downloadItem = item.id;
+ downloadSdk({ path: item.id })
+ .then((rsp) => {
+ clearInterval(timer);
+ item.upgradeLoading = false;
+ this.downloadItem = "";
+
+ window.parent.postMessage({ msg: "AppUpdate" }, "*");
+ })
+ .catch((err) => {
+ this.$notify.warning(err.data);
+ item.upgradeLoading = false;
+ this.downloadItem = "";
+ });
+ // 寮�鍚嚜鍔ㄥ埛鏂�
+ this.sdkUpgreading = true;
+ },
+ autoRefreshAppAndSdkState() {
+ this.getAllApps();
+ this.getAllSdk();
+ if (!this.autoRefresh) {
+ return;
+ }
+ setTimeout(() => {
+ if (this.appUpgreading) {
+ this.getAllApps();
+ }
+ if (this.sdkUpgreading) {
+ this.getAllSdk();
+ }
+ }, 1000);
+ },
+ },
+};
+</script>
+<style lang="scss">
+.s-task-manage {
+ width: 100% !important;
+ min-width: 754px !important;
+ height: 100%;
+ box-sizing: border-box;
+ text-align: left;
+ background-color: #fff;
+}
+
+.task-manage {
+ height: 100%;
+ .installModel {
+ width: 100%;
+ height: 100%;
+ background-color: rgba(0, 0, 0, 0.7);
+ position: fixed;
+ top: 0;
+ left: 0;
+ z-index: 100;
+ .progress-bar {
+ width: 70%;
+ height: 17px;
+ border-radius: 3pxd;
+ background-color: rgb(227, 229, 231);
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ background: url("/images/algo/green.gif");
+ overflow: hidden;
+ transform: translate(-50%, -50%);
+ .inner-bar {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 0;
+ height: 100%;
+ transition: width 3s;
+ background-color: #3d68e1;
+ }
+ }
+ }
+
+ .super {
+ width: 100%;
+ height: 100%;
+ // caret-color: rgba(0, 0, 0, 0);
+ .title {
+ margin-bottom: 10px;
+ line-height: 30px;
+ font-family: PingFangSC-Medium;
+ font-size: 16px;
+ color: #222222;
+ }
+ .left-box {
+ height: 100%;
+ box-sizing: border-box;
+ .nav-box {
+ height: 200px;
+ display: flex;
+ justify-content: space-between;
+ padding: 35px 60px;
+ position: relative;
+ .nav-box-menu {
+ width: 200px;
+ height: 200px;
+ z-index: 99;
+ .menu-item {
+ font-size: 14px;
+ line-height: 50px;
+ height: 50px;
+ letter-spacing: 0.5px;
+ color: #828282;
+ padding-left: 20px;
+ border-left: 3px solid #f3f6fc;
+ cursor: pointer;
+ caret-color: transparent;
+ sup {
+ background-color: #f52323;
+ font-size: 12px;
+ color: #fff;
+ height: 18px;
+ line-height: 18px;
+ padding: 0 3.5px;
+ border-radius: 50%;
+ }
+ }
+ .menu-item:hover {
+ font-weight: 600;
+ color: #333;
+ transition: all 0.15s;
+ }
+ .menu-item-actiove {
+ border-left: 3px solid #23d7ee;
+ font-weight: 700;
+ font-size: 16px;
+ color: #333;
+ }
+ }
+ .nav-box-search {
+ z-index: 99;
+ position: relative;
+ .all-scene {
+ position: absolute;
+ z-index: 100;
+ right: 64px;
+
+ top: 10px;
+ font-size: 12px;
+ }
+ .el-input {
+ position: relative;
+ font-size: 12px;
+ border: 2px solid #f2f2f7;
+ border-radius: 20px;
+ .el-input__inner {
+ border: none;
+ height: 30px;
+ line-height: 30px;
+ padding: 0 12px;
+ }
+ .el-input-group__prepend {
+ border-right: 0;
+ border: none;
+ border-radius: 20px;
+ background: #fff;
+ padding: 0 0 0 15px;
+
+ i {
+ font-weight: 600;
+ color: #333;
+ font-size: 16px;
+ }
+ }
+ .el-input-group--append .el-input__inner,
+ .el-input-group__prepend {
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+ border: none;
+ }
+ .el-input-group__append {
+ border-left: 0;
+ border: none;
+ border-radius: 20px;
+ width: 52px;
+ background: linear-gradient(
+ 180deg,
+ #ecfcfe 0%,
+ #ebf4fd 47.92%,
+ #f4f4fe 100%
+ );
+ .el-input--suffix {
+ border: none;
+ .el-input__icon {
+ line-height: 30px;
+ }
+ .el-input__inner {
+ font-size: 12px;
+ font-weight: bold;
+ letter-spacing: 0.5px;
+ padding: 0 0px 0 30px;
+ color: #474747;
+ }
+ .el-input__suffix {
+ display: none;
+ }
+ }
+ .el-input__inner::placeholder {
+ color: rgb(71, 71, 71);
+ }
+ .el-select-dropdown {
+ min-width: 120px !important;
+ left: -26px !important;
+ background: rgba(236, 245, 253, 0.6);
+ border-radius: 2px;
+ border: none;
+ .el-select-dropdown__item {
+ height: 22px;
+ line-height: 22px;
+ font-size: 12px;
+ letter-spacing: 0.4px;
+ color: #333333;
+ .icon {
+ margin-right: 5px;
+ font-size: 15px;
+ }
+ }
+ .el-select-dropdown__item.hover,
+ .el-select-dropdown__item:hover {
+ background-color: #ebf4fd;
+ font-weight: 600;
+ }
+ }
+ }
+ .el-input-group__prepend .el-select {
+ display: inline-block;
+ margin: -10px -20px;
+ border: none;
+ border-radius: 20px;
+ background: linear-gradient(
+ 180deg,
+ #ecfcfe 0%,
+ #ebf4fd 47.92%,
+ #f4f4fe 100%
+ );
+ }
+ }
+ }
+ .bg-img-wrap {
+ position: absolute;
+ z-index: 1;
+ right: 0;
+ top: 41px;
+ height: 229px;
+ img {
+ height: 100%;
+ }
+ }
+ }
+ .quick-path {
+ position: relative;
+ height: 200px;
+ margin: 0 60px;
+ z-index: 99;
+ background: linear-gradient(
+ 180deg,
+ #ecfcfe 0%,
+ #ebf4fd 47.92%,
+ #f4f4fe 100%
+ );
+ border-radius: 4px;
+ height: 75px;
+ display: flex;
+ align-items: center;
+ .left-items {
+ display: flex;
+ }
+ .quick-item {
+ display: flex;
+ cursor: pointer;
+ padding: 2px 20px;
+ height: 52px;
+ box-sizing: border-box;
+
+ .icon-img {
+ width: 48px;
+ height: 48px;
+ position: relative;
+ .icon {
+ position: absolute;
+ right: -7px;
+ top: -7px;
+ font-size: 13px;
+ }
+ img {
+ width: 48px;
+ height: 48px;
+ }
+ }
+ .desc {
+ box-sizing: border-box;
+ padding: 0 12px;
+ color: #828282;
+ width: 140px;
+ .desc-1 {
+ font-size: 14px;
+ font-weight: bold;
+ line-height: 26px;
+ height: 26px;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ }
+ .desc-2 {
+ font-size: 12px;
+ }
+ }
+ .right-icon {
+ padding: 2px 0;
+
+ .icon {
+ font-size: 21px;
+ }
+ }
+ }
+ .quick-item:not(:last-child) {
+ border-right: 1px solid #e0e0e0;
+ }
+ .down-all-btn {
+ position: absolute;
+ right: 30px;
+ .el-button {
+ width: 78px;
+ font-size: 12px;
+ font-weight: 600;
+ padding: 3px 10px;
+ border: 1px solid #eef0f7;
+ }
+ }
+ }
+ .main-content {
+ padding: 35px 82px;
+ z-index: 99;
+ .main-title {
+ line-height: 25px;
+ font-size: 16px;
+ font-weight: 600;
+ margin-bottom: 10px;
+ }
+ .tab-btns {
+ display: flex;
+ justify-content: space-between;
+ .group-left {
+ display: flex;
+ .tab {
+ font-size: 14px;
+ margin-right: 25px;
+ line-height: 28px;
+ cursor: pointer;
+ color: #828282;
+ }
+ .tab-active {
+ border-bottom: 2px solid #23d7ee;
+ color: #333333;
+ font-weight: bold;
+ }
+ }
+
+ .batch-update {
+ display: flex;
+ align-items: center;
+ .el-button {
+ padding: 3px 12px;
+ background-color: #1dd4ec !important;
+ border-color: #1dd4ec !important;
+ border-radius: 22px;
+ }
+ .el-button--primary:hover {
+ background: #089fb3 !important;
+ border-color: #089fb3 !important;
+ }
+ }
+ }
+ .front-page-items {
+ padding-top: 25px;
+ .front-page-item {
+ float: left;
+ display: flex;
+ margin: 0 5px;
+ margin-bottom: 15px;
+ box-sizing: border-box;
+ width: 274px;
+
+ justify-content: center;
+ cursor: pointer;
+
+ padding: 10px 0;
+ height: 76px;
+ border-radius: 4px;
+
+ /* &.disabled {
+ cursor: default;
+ } */
+
+ .icon-img {
+ width: 58px;
+ height: 58px;
+ position: relative;
+ .icon {
+ position: absolute;
+ right: -9px;
+ top: -9px;
+ font-size: 16px;
+ }
+ img {
+ width: 58px;
+ height: 58px;
+ border-radius: 10px;
+ }
+ }
+ .desc {
+ box-sizing: border-box;
+ padding: 0 12px;
+ width: 147px;
+
+ .desc-1 {
+ font-size: 14px;
+ font-weight: bold;
+ color: #4f4f4f;
+ line-height: 28px;
+ height: 28px;
+ letter-spacing: 0.1px;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ }
+ .desc-2 {
+ color: #828282;
+ font-size: 12px;
+ }
+ }
+ .right-btn {
+ padding: 2px 0;
+ width: 50px;
+ text-align: center;
+ position: relative;
+ .check-btn {
+ background-color: #ffffff !important;
+ border-color: #bdbdbd !important;
+ color: #333333;
+ }
+ .update-btn {
+ border-color: #23d7ee !important;
+ background-color: rgba(29, 212, 236, 0.1) !important;
+ color: #4f4f4f;
+ }
+ .other-btn {
+ background-color: #1dd4ec !important;
+ border-color: #1dd4ec !important;
+ color: #ffffff;
+ }
+ @keyframes spin {
+ from {
+ transform: rotate(0deg);
+ }
+ to {
+ transform: rotate(360deg);
+ }
+ }
+ .anz-font {
+ font-size: 28px;
+ color: #333;
+ }
+
+ .spin-icon {
+ animation: spin 0.8s linear infinite;
+ }
+ .status {
+ font-size: 12px;
+ color: #828282;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ min-width: 100px;
+ text-align: end;
+ position: absolute;
+ right: 0;
+ width: 120px;
+ margin-top: 2px;
+ }
+ .rocket-icon {
+ font-size: 20px;
+ }
+ .el-button {
+ padding: 3px 12px;
+ border-radius: 22px;
+ font-weight: bold;
+ letter-spacing: 0.5px;
+ }
+ }
+ }
+ .front-page-item:hover {
+ background-color: #f2f2f7;
+ }
+ .item-dimmed {
+ color: gray;
+ filter: grayscale(100%);
+ }
+ }
+ .front-page-items:after {
+ content: "";
+ display: block;
+ height: 0;
+ clear: both;
+ visibility: hidden;
+ }
+ .upload-pkg {
+ .upload-head {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ .left {
+ display: flex;
+ align-items: center;
+ .iconfont {
+ font-size: 18px;
+ margin-right: 6px;
+ }
+ .txt {
+ font-size: 16px;
+ }
+ }
+ .right {
+ .icon {
+ margin-right: 11px;
+ font-size: 17px;
+ cursor: pointer;
+ }
+ }
+ }
+ }
+ .upload-demo {
+ margin: 30px 0px;
+ .drag-txt {
+ width: 340px;
+ height: 45px;
+ border: 1px dashed #bdbdbd;
+ display: flex;
+ margin-top: 30px;
+ align-items: center;
+ justify-content: center;
+ color: #828282;
+ font-size: 14px;
+ }
+ .txt-btn {
+ width: 78px;
+ margin-top: 18px;
+ height: 19px;
+ background: #23d7ee;
+ border-radius: 22px;
+ color: #ffffff;
+ font-weight: bold;
+ font-size: 12px;
+ }
+ }
+ }
+ }
+ .mask {
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ background: rgba(0, 0, 0, 0.65);
+ backdrop-filter: blur(1px) brightness(100%);
+ text-align: center;
+ z-index: 1;
+ border-radius: 3px;
+ display: none;
+ .info-onmask {
+ color: #fff;
+ }
+ .left-top {
+ position: absolute;
+ left: 5px;
+ top: 5px;
+ font-size: 12px;
+ color: #90d6ff;
+ }
+ .mask-btn {
+ width: 100%;
+ display: flex;
+ }
+ i {
+ color: #fff;
+ position: relative;
+ top: 40%;
+ display: contents;
+ }
+ i:hover {
+ color: rgba(255, 255, 255, 0.685);
+ }
+ }
+
+ .el-input {
+ position: relative;
+ font-size: 14px;
+ // display: inline-block;
+ // width: 80%;
+ }
+
+ .el-button--cancle {
+ background: #eaeaea;
+ border-radius: 2px;
+ border-color: #eaeaea;
+ font-family: PingFangSC-Medium;
+ font-size: 13px;
+ color: #222222;
+ margin-right: 12px;
+ }
+ }
+}
+
+@media screen and (max-width: 800px) {
+ .quick-path .left-items .quick-item:last-child {
+ display: none !important;
+ }
+ .quick-path .left-items .quick-item:nth-child(2) {
+ border: none !important;
+ }
+}
+</style>
+
--
Gitblit v1.8.0