From 4a800a8fc83c6bd1f86a8e847b079a51a7532c09 Mon Sep 17 00:00:00 2001 From: zhangzengfei <zhangzengfei@smartai.com> Date: 星期三, 20 七月 2022 15:05:58 +0800 Subject: [PATCH] 修复国标配置的bug --- src/pages/ai/index/App.vue | 3145 +++++++++++++++++++--------------------------------------- 1 files changed, 1,049 insertions(+), 2,096 deletions(-) diff --git a/src/pages/ai/index/App.vue b/src/pages/ai/index/App.vue index 71546e0..e466408 100644 --- a/src/pages/ai/index/App.vue +++ b/src/pages/ai/index/App.vue @@ -7,585 +7,390 @@ <div class="inner-bar"></div> </div> </div> - <!-- 瓒呯骇绠$悊鍛樺彲瑙� --> <div class="super"> - <div class="left-box"> - <!-- <div class="title"> - <label>绠楁硶搴�</label> - </div>--> - <el-tabs - v-model="activeName" - type="border-card" - @tab-click="handleTabClick" - style="height: calc(100% - 20px)" - > - <el-tab-pane label="宸叉縺娲�" name="myAlgorithm"> - <div class="width-new-line task-list" v-show="activeName === 'myAlgorithm'"> - <p class="src-title">绠楁硶杞欢</p> - <div class="flex-list"> - <div class="wrap-box" v-for="item in installedList" :key="item.id"> - <div class="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> --> - <img class="update-icon" v-if="item.isUpgrade" src="../../../assets/img/鏇存柊鎻愮ず.png" alt=""> - <div class="mask" v-if="!item.isDefault || item.isUpgrade"> - <div class="left-top"> - <div>褰撳墠鐗堟湰:{{ item.version }}</div> - <div v-if="item.remoteVersion">鏈�鏂扮増鏈�:{{ item.remoteVersion }}</div> - </div> - <div class="info-onmask" @click="checkDetail(item, 'active')">鏌ョ湅璇︽儏</div> - <div class="mask-btn"> - <el-button - @click="unLoadSdk(item)" - type="primary" - size="small" - class="bot-btn" - >鍗歌浇</el-button> - <el-button - v-if="item.isUpgrade" - @click="donwload(item, 0)" - type="warning" - size="small" - class="bot-btn" - >鍗囩骇</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 v-if="!item.isEdit"> - {{ - item.sdk_name - }} - </span> - - <el-input - size="small" - v-model="item.sdk_name" - v-if="item.isEdit" - v-focus - :maxlength="15" - @blur="inputBlur(item)" - ></el-input> - </div> - </div> - </div> - </div> - </div> - <div class="wrap-box" v-for="item in notInstalledList" :key="item.id"> - <div - class="list-choose-item-left list-choose-item-left-uninstal" - v-loading="downloading && downloadItem == item.id" - > - <div class="mask"> - <div class="left-top"> - <div v-if="item.installed">褰撳墠鐗堟湰:{{ item.version }}</div> - <div v-if="item.remoteVersion">鏈�鏂扮増鏈�:{{ item.remoteVersion }}</div> - </div> - <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> - </div> - <div class="list-complete-item-handle"> - <div - class="svg-wrap" - v-loading=" - item.installLoading || item.upgradeLoading - " - :element-loading-text="item.progressMsg" - element-loading-background="rgba(0,0,0,.8)" - > - <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 class="list-choose-item-left-uninstal"> - {{ - item.sdk_name - }} - </span> - </div> - </div> - </div> - </div> - </div> - </div> - <p class="src-title">搴旂敤杞欢</p> - <div class="flex-list"> - <div class="wrap-box" v-for="item in installedApps" :key="item.id"> - <div class="list-choose-item-left"> - <div class="list-complete-item-handle"> - <div - class="svg-wrap" - :class="{ willUpGrade: item.isUpgrade }" - v-loading=" - item.unloadLoading || item.upgradeLoading - " - :element-loading-text="item.progressMsg" - element-loading-background="rgba(0,0,0,.8)" - > - <!-- <i class="iconfont iconupdate" v-if="item.isUpgrade"></i> --> - <img class="update-icon" v-if="item.isUpgrade" src="../../../assets/img/鏇存柊鎻愮ず.png" alt=""> - - <div class="mask"> - <div class="left-top"> - <div>褰撳墠鐗堟湰:{{ item.version }}</div> - <div v-if="item.remoteVersion">鏈�鏂扮増鏈�:{{ item.remoteVersion }}</div> - </div> - <!-- v-if="!item.isDefault" --> - <div class="info-onmask" @click="checkDetail(item,'active')">鏌ョ湅璇︽儏</div> - <div class="mask-btn"> - <el-button - v-show="!item.isDefault" - @click="unLoad(item)" - type="primary" - size="small" - class="bot-btn" - >鍗歌浇</el-button> - <el-button - v-if="item.isUpgrade" - @click="downloadApp(item, 'upgrade')" - type="warning" - size="small" - class="bot-btn" - >鍗囩骇</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" style="color:grey;"> - <div style="padding: 0px 10px 0px 10px"> - <span v-if="!item.isEdit">{{ item.name }}</span> - <el-input - size="small" - v-model="item.sdk_name" - v-if="item.isEdit" - v-focus - :maxlength="15" - @blur="inputBlur(item)" - ></el-input> - </div> - </div> - </div> - </div> - </div> - <div class="wrap-box" v-for="item in storeApps" :key="item.id"> - <div class="list-choose-item-left"> - <div class="list-complete-item-handle uninstall"> - <div - class="svg-wrap" - v-loading=" - item.installLoading || item.upgradeLoading - " - :element-loading-text="item.progressMsg" - element-loading-background="rgba(0,0,0,.8)" - > - <div class="mask"> - <div class="left-top"> - <div v-if="item.remoteVersion">鏈�鏂扮増鏈�:{{ item.remoteVersion }}</div> - </div> - <!-- v-if="!item.isDefault" --> - <div class="info-onmask" @click="checkDetail(item,'activeNotInstall')">鏌ョ湅璇︽儏</div> - <div class="mask-btn"> - <el-button - @click="downloadApp(item)" - type="primary" - size="small" - class="bot-btn" - >瀹夎</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 v-if="!item.isEdit">{{ item.name }}</span> - <el-input - size="small" - v-model="item.name" - v-if="item.isEdit" - v-focus - :maxlength="15" - @blur="inputBlur(item)" - ></el-input> - </div> - </div> - </div> - </div> - </div> - </div> + <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> - </el-tab-pane> + </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> - <el-tab-pane - label="绂荤嚎鍗囩骇/瀹夎" - name="upgradeOrInstallation" - v-if="isShow('algorithmManage:insOffLine')" - > - <div class="tab-content"> - <div class="action-bar"> - <file-uploader - single - tip - tipWords="涓婁紶绠楁硶" - uploadPlaceholder="涓婁紶瀹夎杞欢" - url="/data/api-v/sdk/upload" - @complete="onFileUpload" - @file-added="onFileAdded" + <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> - </el-tab-pane> - <el-tab-pane label="搴旂敤涓績" name="algorithmMall" v-if="isShow('algorithmManage:buy')"> - <div class="tab-content"> - <div class="flex-title"> - <p class="src-title">绠楁硶杞欢</p> - </div> - <div class="store-list flex-list"> - <div v-if="!unActivedSDKList.length" class="empty-tip">鏆傛棤鏁版嵁</div> + </div> - <div class="wrap-box" v-for="item in unActivedSDKList" :key="item.id"> - <div class="list-choose-item-left"> - <div class="list-complete-item-handle"> - <div class="alg-icon svg-wrap"> - <!-- <div class="mask" @click="actSdkOrApp(item.id)"> - <span - class="iconfont iconyunxiazai" - style=" - color: #ff6a00; - font-size: 20px; - position: absolute; - top: 45%; - left: 45%; - " - ></span> - </div>--> - <div class="mask" v-if="!item.isDefault || item.isUpgrade"> - <div class="left-top"> - <div>褰撳墠鐗堟湰:{{ item.version }}</div> - <div v-if="item.remoteVersion">鏈�鏂扮増鏈�:{{ item.remoteVersion }}</div> - </div> - <div class="info-onmask" @click="actSdkOrApp(item)">鏌ョ湅璇︽儏</div> - <div class="mask-btn"> - <el-button - @click="actSdkOrApp(item)" - type="primary" - size="small" - class="bot-btn" - >婵�娲�</el-button> - </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 v-if="!item.isEdit"> - {{ - item.sdk_name - }} - </span> - <el-input - size="small" - v-model="item.sdk_name" - v-if="item.isEdit" - v-focus - :maxlength="15" - @blur="inputBlur(item)" - ></el-input> - </div> - </div> - </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> - <p class="src-title">搴旂敤杞欢</p> - <div class="app-list flex-list"> - <div v-if="!unActivedAppList.length" class="empty-tip">鏆傛棤鏁版嵁</div> - <div class="wrap-box" v-for="item in unActivedAppList" :key="item.id"> - <div class="list-choose-item-left"> - <div class="list-complete-item-handle"> - <div class="alg-icon svg-wrap"> - <!-- <div - class="mask" - @click="actSdkOrApp(item, 'app')" - > - <span - class="iconfont iconyunxiazai" - style=" - color: #ff6a00; - font-size: 20px; - position: absolute; - top: 45%; - left: 45%; - " - ></span> - </div>--> - <div class="mask" v-if="!item.isDefault || item.isUpgrade"> - <div class="left-top"> - <div>褰撳墠鐗堟湰:{{ item.version }}</div> - <div v-if="item.remoteVersion">鏈�鏂扮増鏈�:{{ item.remoteVersion }}</div> - </div> - <div class="info-onmask" @click="actSdkOrApp(item,'app')">鏌ョ湅璇︽儏</div> - <div class="mask-btn"> - <el-button - @click="actSdkOrApp(item, 'app')" - type="primary" - size="small" - class="bot-btn" - >婵�娲�</el-button> - </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 v-if="!item.isEdit">{{ item.name }}</span> - <el-input - size="small" - v-model="item.name" - v-if="item.isEdit" - v-focus - :maxlength="15" - @blur="inputBlur(item)" - ></el-input> - </div> - </div> - </div> - </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> - <!-- --> - </el-tab-pane> - <el-tab-pane name="update"> - <span slot="label"> - <el-badge class="update-badge" :value="updateNum" :hidden="updateNum==0">鏇存柊</el-badge> - </span> - <div class="task-list"> - <div class="flex-title"> - <p class="src-title">绠楁硶杞欢</p> - <el-button @click="batchUpdate('sdk')" size="mini" type="primary">鏇存柊鍏ㄩ儴</el-button> - </div> - <div class="flex-list"> - <div - v-if="hasNewVersionSdk.length==0" - class="empty-tip" - >{{errMsg?errMsg:"鏆傛棤鏁版嵁"}}</div> - <div class="wrap-box" v-for="item in hasNewVersionSdk" :key="item.id"> - <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> --> - <img class="update-icon" v-if="item.isUpgrade" src="../../../assets/img/鏇存柊鎻愮ず.png" alt=""> - <div class="mask" v-if="!item.isDefault || item.isUpgrade"> - <div class="left-top"> - <div>褰撳墠鐗堟湰:{{ item.version }}</div> - <div v-if="item.remoteVersion">鏈�鏂扮増鏈�:{{ item.remoteVersion }}</div> - </div> - <div class="info-onmask" @click="checkDetail(item,'active')">鏌ョ湅璇︽儏</div> - <div class="mask-btn"> - <el-button - @click="unLoadSdk(item)" - type="primary" - size="small" - class="bot-btn" - >鍗歌浇</el-button> - <el-button - v-if="item.isUpgrade" - @click="donwload(item, 0)" - type="warning" - size="small" - class="bot-btn" - >鍗囩骇</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 v-if="!item.isEdit"> - {{ - item.sdk_name - }} - </span> - </div> - </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> - <div class="flex-title"> - <p class="src-title">搴旂敤杞欢</p> - <el-button @click="batchUpdate('app')" type="primary" size="mini">鏇存柊鍏ㄩ儴</el-button> - </div> - <div class="flex-list"> - <div v-if="!hasNewVersionApp.length" class="empty-tip">鏆傛棤鏁版嵁</div> - <div class="wrap-box" v-for="item in hasNewVersionApp" :key="item.id"> - <div class="list-choose-item-left"> - <div class="list-complete-item-handle"> - <div - class="svg-wrap" - :class="{ willUpGrade: item.isUpgrade }" - v-loading=" - item.unloadLoading || item.upgradeLoading - " - :element-loading-text="item.progressMsg" - element-loading-background="rgba(0,0,0,.8)" - > - <!-- <i class="iconfont iconupdate" v-if="item.isUpgrade"></i> --> - <img class="update-icon" v-if="item.isUpgrade" src="../../../assets/img/鏇存柊鎻愮ず.png" alt=""> - - <div class="mask"> - <div class="left-top"> - <div>褰撳墠鐗堟湰:{{ item.version }}</div> - <div v-if="item.remoteVersion">鏈�鏂扮増鏈�:{{ item.remoteVersion }}</div> - </div> - <div class="info-onmask" @click="checkDetail(item,'active')">鏌ョ湅璇︽儏</div> - <div class="mask-btn"> - <el-button - v-if="!item.isDefault" - @click="unLoad(item)" - type="primary" - size="small" - class="bot-btn" - >鍗歌浇</el-button> - <el-button - v-if="item.isUpgrade" - @click="downloadApp(item, 'upgrade')" - type="warning" - size="small" - class="bot-btn" - >鍗囩骇</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 v-if="!item.isEdit">{{ item.name }}</span> - <el-input - size="small" - v-model="item.sdk_name" - v-if="item.isEdit" - v-focus - :maxlength="15" - @blur="inputBlur(item)" - ></el-input> - </div> - </div> - </div> - </div> + <div class="status"> + {{ item.progressMsg }} </div> </div> </div> - </el-tab-pane> - </el-tabs> + </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" @@ -632,264 +437,6 @@ <el-button type="primary" @click="offlineInstall">瀹� 瑁�</el-button> </div> </el-dialog> - <!-- <div class="dialog-content" v-if="productDetailVisible" > --> - <el-dialog class="product-detail-dialog" :visible="productDetailVisible" @close="closeDial"> - <!-- <el-button-group> --> - <div class="button-group" v-show="!backDisable||!forwardDisable"> - <el-button size="small" @click="backwards" :disabled="backDisable"> - <span><</span> - </el-button> - <!-- <el-button type="primary" size="small" icon="el-icon-arrow-left"></el-button> --> - <el-button size="small" @click="forwards" :disabled="forwardDisable">></el-button> - <!-- <el-button type="primary" size="small"><i class="el-icon-arrow-right el-icon--right"></i></el-button> --> - </div> - <!-- </el-button-group> --> - <div class="dialog-title" slot="title">{{isSDKDialog?"绠楁硶璇︽儏":"搴旂敤璇︽儏"}}</div> - <div class="dialog-content"> - <div class="box-top"> - <div class="top-left"> - <div class="banner"> - <el-carousel - ref="carousel" - :autoplay="false" - indicator-position="none" - :arrow=" - productDetail.pics !== undefined - ? productDetail.pics.length > 1 - ? 'always' - : 'never' - : 'never' - " - @change="changeHandle" - > - <!-- :arrow="productDetail.pics.length > 1 ? 'always' : 'never'" --> - <el-carousel-item v-for="(item, index) in productDetail.pics" :key="index"> - <div class="imgwrap"> - <img - v-if="item.type != 'video'" - :src="'/httpImage/' + item.url" - class="cursor-pointer" - preview - /> - <video v-if="item.type == 'video'" :src="'/httpImage/' + item.url" controls></video> - </div> - </el-carousel-item> - </el-carousel> - </div> - </div> - <div class="top-right"> - <div class="summary"> - <div class="icon"> - <img - v-if="productDetail.iconBlob" - class="baseImg" - :src=" - productDetail.iconBlob.indexOf(',') > 0 - ? productDetail.iconBlob - : `data:image/png;base64,${productDetail.iconBlob}` - " - alt - /> - </div> - <div class="right-desc"> - <div class="name"> - <el-tooltip - class - effect="dark" - :content="productDetail.productName" - placement="right-start" - > - <span>{{ productDetail.productName }}</span> - </el-tooltip> - </div> - <div class="tags"> - <el-tag type="info" size="small" color="#fff" v-if="!isSDKDialog">搴旂敤</el-tag> - <el-tag type="info" size="small" color="#fff" v-if="isSDKDialog">绠楁硶</el-tag> - </div> - <div class="btns"> - <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&&!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> - </div> - <div class="jihuo-input" v-if="showInputCode"> - <el-input - size="small" - v-model="activeCode" - placeholder="00000-00000-00000-00000-00000" - @blur="getCodeDetail" - ></el-input> - <el-button type="primary" size="small" @click="actived">婵�娲�</el-button> - <el-button type="primary" size="small" @click="cancelActivate">鍙栨秷</el-button> - </div> - <div class="product-intruduction"> - <div class="part-title" v-if="!showInputCode">绠�浠�</div> - <div class="text"> - <div class="single-desc"> - <div>鐗堟湰锛�</div> - <div> - {{ - productDetail.productVersion === "" - ? "鏆傛棤" - : productDetail.productVersion - }} - </div> - </div> - <div class="single-desc"> - <div>姒傝堪锛�</div> - <div> - {{ - productDetail.description === "" - ? "鏆傛棤" - : productDetail.description - }} - </div> - </div> - <div class="single-desc"> - <div>璇﹁堪锛�</div> - <div> - {{ - productDetail.summary === "" - ? "鏆傛棤" - : productDetail.summary - }} - </div> - </div> - </div> - </div> - </div> - </div> - <div class="box-bottom"> - <div class="bot-left"> - <div class="part-title">{{ isSDKDialog ? "搴旂敤鍦烘櫙" : "鍔熻兘鐗圭偣" }}</div> - <div class="list-zone"> - <div class="list-item" v-for="(item, index) in productDetail.funcInfo" :key="index"> - <el-tag - type - size="small" - effect="dark" - >{{ item.title === "" ? "鏆傛棤鏁版嵁" : item.title }}</el-tag> - <div class="desc"> - {{ - item.desc === "" - ? "鏆傛棤鏁版嵁" - : item.desc - }} - </div> - </div> - </div> - </div> - <div class="bot-right"> - <div class="part-title">鎺ㄨ崘绠楁硶</div> - <div class="item-zone"> - <div class="item" v-for="(item, index) in otherProducts" :key="index"> - <el-tag type="info" color="inherit" size="small"> - {{ - item.productTypeName === "" - ? "鏆傛棤鏁版嵁" - : item.productTypeName - }} - </el-tag> - <div class="icon"> - <img - v-if="item.iconBlob" - class="baseImg" - :src=" - item.iconBlob.indexOf(',') > 0 - ? item.iconBlob - : `data:image/png;base64,${item.iconBlob}` - " - alt - /> - - <div class="icon-name"> - <el-tooltip - class - effect="dark" - :content="item.name === '' ? '鏆傛棤鏁版嵁':item.name" - placement="top-start" - > - <span>{{ item.name === "" ? "鏆傛棤鏁版嵁" : item.name }}</span> - </el-tooltip> - </div> - </div> - <div class="look-button"> - <el-button type="primary" size="mini" @click="checkInWindow(item)">鏌ョ湅</el-button> - </div> - </div> - </div> - </div> - </div> - </div> - </el-dialog> - <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> @@ -899,6 +446,7 @@ installSdk, getInstallInfo, removeSdk, + uploadSDK, } from "./api"; import { getApps, @@ -910,13 +458,14 @@ getUnActivedApp, actApp, } from "@/api/app"; - -import bus from "@/plugin/bus"; -import FileUploader from "@/components/subComponents/FileUpload/index"; +import { getUrlKey } from "@/api/utils"; +import FileUploader from "../FileUpload/index"; +import detailPage from "./detail"; export default { name: "algorithmManage", components: { FileUploader, + detailPage, }, computed: { updateNum() { @@ -930,40 +479,46 @@ let loginName = JSON.parse(sessionStorage.getItem("userInfo")).username; return loginName === "superadmin" || loginName === "basic"; } - return false; }, }, data() { return { - sdkList: [], installedList: [], + recomandUpdateList: [], hasNewVersionSdk: [], + activeTab: "sdk", hasNewVersionApp: [], + tempDarkList: [], notInstalledList: [], + showUpload: false, + detailType: "", + detailProductID: "", + detailPrice: "", buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [], - activeName: "myAlgorithm", + activeName: "搴旂敤涓績", patchUpdateStatus: "", downloadItem: "", downloading: false, - direction: "rtl", actStep: 0, + showQuickPath: true, showActivateSuccess: false, activeCode: "", isInstall: false, installDialogVisible: false, - installPackage: {}, installAppPackage: null, installSdkPackage: null, isActive: true, isDefaultApp: false, - installPercentage: 0, unActivedSDKList: [], unActivedAppList: [], + inDetail: false, isSDKDialog: true, - //actSdkId: '', actType: "", actId: "", + inputText: "", + tempList: [], + select: "", activedSdkOrApp: { activateCode: "", productName: "", @@ -975,23 +530,23 @@ installedApps: [], storeApps: [], installFile: {}, - freshTimer: null, - appUpgreading: true, - sdkUpgreading: true, + appUpgreading: false, + sdkUpgreading: false, autoRefresh: true, - curCheckTarget: {}, productDetailVisible: false, isUpgrading: false, productDetail: {}, otherProducts: [], backStack: [], + toUpdateArr1: [], forwardStack: [], + rocketIf: false, backDisable: true, forwardDisable: true, showInputCode: false, needToUpgradeInWin: false, - errMsg: "", - showInstallNotActive: false + showInstallNotActive: false, + menuArr: ["搴旂敤涓績", "宸叉縺娲�", "绂荤嚎鍗囩骇/瀹夎", "鏇存柊"], }; }, directives: { @@ -1001,223 +556,174 @@ }, }, }, - mounted() { - // 鑾峰彇鎵�鏈夊簲鐢� + var name = getUrlKey("activeName"); + if (name) { + this.pickMenu(name); + } this.autoRefreshAppAndSdkState(); - - this.getUnActivedList(); + this.getUnActivedList(1); this.getUnActivedAppList(); }, beforeDestroy() { this.autoRefresh = false; }, methods: { - isShow(authority) { - return ( - this.isAdmin || this.buttonAuthority.indexOf("," + authority + ",") > -1 - ); + searchAll() { + this.getAllApps(); + this.getAllSdk(); + this.getUnActivedList(1); + this.getUnActivedAppList(); }, - batchUpdate(type) { - if (type == "sdk") { - this.hasNewVersionSdk.forEach((sdk) => { - this.donwload(sdk, 0); - }); + goback() { + this.inDetail = false; + }, + batchUpdate(s) { + if (s == "both") { + this.batchUpdateSDK(); + this.batchUpdateApp(); + } else if (this.activeTab == "sdk") { + this.batchUpdateSDK(); } else { - this.hasNewVersionApp.forEach((app) => { - this.downloadApp(app, "upgrade"); - }); + this.batchUpdateApp(); } }, - closeDial() { - this.productDetailVisible = false - this.productDetail = {} - this.otherProducts = [] - }, - checkDetail(item, type) { - if (type == 'inactive') { - this.isActive = false - this.showInstallNotActive = false - this.showInputCode = false - } 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() - if (item.sdk_type === undefined) { - this.isSDKDialog = false - } else { - this.isSDKDialog = true - } - 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; + batchUpdateSDK() { + this.hasNewVersionSdk.forEach((sdk) => { + this.donwloadSDK(sdk); }); }, - resetStack() { - this.forwardStack = [] - this.backStack = [] - this.backDisable = true - this.forwardDisable = true - - }, - 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; + 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) { - 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 - - } + this.isDefaultApp = id.length <= 10; }, forwards() { if (this.forwardStack.length == 0) { - this.forwardDisable = true - return + this.forwardDisable = true; + return; } - this.backStack.push([this.productDetail, this.otherProducts]) - this.backDisable = false - let item = this.forwardStack.pop() + this.backStack.push([this.productDetail, this.otherProducts]); + this.backDisable = false; + let item = this.forwardStack.pop(); - this.productDetail = item[0] - this.otherProducts = item[1] + this.productDetail = item[0]; + this.otherProducts = item[1]; if (this.forwardStack.length == 0) { - this.forwardDisable = true + this.forwardDisable = true; } - }, - //绂荤嚎瀹夎 offlineInstall() { this.installDialogVisible = false; this.isInstall = true; - //瀹夎 installSdk(this.installFile) .then((res) => { if (res.success) { this.isInstall = false; - this.$message({ - type: "success", - message: '瀹夎鎴愬姛,灏嗚烦杞嚦"宸叉縺娲�"涓煡鐪�', - }); + this.$message.success('瀹夎鎴愬姛,灏嗚烦杞嚦"宸叉縺娲�"涓煡鐪�'); setTimeout(() => { this.getAllSdk(); - window.parent.postMessage( - { - msg: "AppUpdate", - }, - "*" - ); - this.activeName = "myAlgorithm"; + window.parent.postMessage({ msg: "AppUpdate" }, "*"); + this.activeName = "宸叉縺娲�"; }, 3000); } }) .catch((e) => { this.isInstall = false; - this.$message({ - type: "error", - message: e.data, - }); + this.$message.error(e.msg); }); }, - downloadApp(app, action) { - if (action == "upgrade") { - app.upgradeLoading = true; - } else { - app.installLoading = true; - } - let _this = this; + 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({ - title: "鎴愬姛", - message: "瀹夎搴旂敤鎴愬姛", - type: "success", - }); + _this.$notify.success("瀹夎搴旂敤鎴愬姛"); + clearInterval(timer); + app.upgradeLoading = false; setTimeout(() => { - if (action == "upgrade") { - app.upgradeLoading = false; - } else { - app.installLoading = false; - } - // _this.getAllApps(); - window.parent.postMessage( - { - msg: "AppUpdate", - }, - "*" - ); + window.parent.postMessage({ msg: "AppUpdate" }, "*"); }, 3000); } else { } }) .catch((e) => { - _this.$notify({ - title: "瀹夎澶辫触", - message: e.data, - type: "warning", - }); - if (action == "upgrade") { - app.upgradeLoading = false; - } else { - app.installLoading = false; - } + _this.$notify.warning(e.msg); + clearInterval(timer); + app.upgradeLoading = false; }); - // 寮�鍚嚜鍔ㄥ埛鏂� this.appUpgreading = true; }, @@ -1225,7 +731,7 @@ let iArry = []; let sArry = []; let nArry = []; - let rsp = await getApps(); + let rsp = await getApps({ appName: this.inputText }); if (rsp && rsp.success) { // 閬嶅巻app鐨勮繃绋嬮噸缃� this.appUpgreading = false; @@ -1235,11 +741,19 @@ { unloadLoading: false, upgradeLoading: false }, item ); - if (obj.progressMsg !== "" && obj.progressMsg !== "宸插畨瑁�") { + 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); }); @@ -1248,12 +762,11 @@ this.storeApps = sArry; this.hasNewVersionApp = nArry; }, - - unLoad(app) { + unloadApp(app) { let _this = this; this.$confirm("纭畾瑕佸嵏杞借搴旂敤鍚�?", "鎻愮ず") .then(() => { - _this.productDetailVisible = false + _this.productDetailVisible = false; app.unloadLoading = true; removeApp({ appId: app.id }) @@ -1261,39 +774,15 @@ if (res && res.success) { app.unloadLoading = false; _this.getAllApps(); - window.parent.postMessage( - { - msg: "AppUpdate", - }, - "*" - ); - _this.$notify({ - title: "鎴愬姛", - message: "鍗歌浇搴旂敤鎴愬姛", - type: "success", - }); + window.parent.postMessage({ msg: "AppUpdate" }, "*"); + _this.$notify.success("鍗歌浇搴旂敤鎴愬姛"); } }) .catch((e) => { app.unloadLoading = false; }); }) - .catch((e) => { - }); - }, - - actSdkOrApp(item, type = "sdk") { - this.checkDetail(item, "inactive"); - this.actType = type; - this.actId = item.id; - this.actStep = 0; - this.activeCode = ""; - this.activedSdkOrApp = this.newActInfo(); - }, - - cancelActivate() { - this.showInputCode = false - this.activeCode = "" + .catch((e) => {}); }, newActInfo() { return { @@ -1305,80 +794,77 @@ devIds: "", }; }, - getUnActivedList() { - getUnActivedSdk().then((res) => { + 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().then((res) => { + getUnActivedApp({ appName: this.inputText }).then((res) => { if (res.code == 200) { this.unActivedAppList = res.data; + this.pickTab(); } }); }, - actived() { - let _this = this; - if (this.activeCode.trim() == "") { - this.$notify({ - type: "error", - message: "婵�娲荤爜涓嶈兘涓虹┖", - }); - return; + actived(item) { + if (!item.canUpOrIns) { + return false; } - if (this.actType == "sdk") { - //婵�娲荤畻娉� - actPageAlg(this.actId, this.activeCode) + + 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.showActivateSuccess = true; _this.actStep++; - _this.getUnActivedList(); + _this.getUnActivedList(1); _this.getAllSdk(); } else { - _this.$notify({ - type: "error", - message: res.data.failMsg.failMsg, - }); + _this.$notify.error(res.data.failMsg.failMsg); } }) - .catch((e) => { - console.log(e); - }); - } else if (this.actType == "app") { + .catch((e) => {}); + } else if (this.activeTab == "app") { //婵�娲诲簲鐢� - actApp(this.actId, this.activeCode) + actApp(item.id, "") .then((res) => { if (res.data.isSuccess) { this.productDetailVisible = false; _this.activedSdkOrApp = res.data.successMsg; - this.showActivateSuccess = true + this.showActivateSuccess = true; _this.actStep++; _this.getUnActivedAppList(); _this.getAllApps(); } else { - _this.$notify({ - type: "error", - message: res.data.failMsg.failMsg, - }); + _this.$notify.error(res.data.failMsg.failMsg); } }) - .catch((e) => { - console.log(e); - }); + .catch((e) => {}); } }, - getCodeDetail() { }, - checkMyAlgorith() { - this.showActivateSuccess = false; - this.activeName = "myAlgorithm"; - }, onFileUpload(file) { - //this.patchUpdateStatus = `<span style="color:green">涓婁紶鎴愬姛, 鐐瑰嚮鍗囩骇鎸夐挳寮�濮嬪畨瑁�</span>`; this.patchFile = { ...file }; this.fileAdded = true; const h = this.$createElement; @@ -1405,31 +891,22 @@ installContent: res.data.sdks[0].installContent, }; } + } else { + this.$message.error(res.msg); } }) .catch((e) => { - this.$message({ - type: "error", - message: e.data, - }); + this.$message.error(e.msg); }); }, - openApp() { - let message = 'toOpenApp?' + this.productDetail.productBaseId; - window.parent.postMessage({ - msg: message - }, "*") - }, - onFileAdded(f) { this.patchUpdateStatus = ""; }, - async getAllSdk() { let installedList = []; let unInstalledList = []; let hasNewVersionList = []; - let res = await findAllSdk(); + let res = await findAllSdk({ sdkName: this.inputText }); if (res && res.success) { this.sdkUpgreading = false; @@ -1438,195 +915,84 @@ { unloadLoading: false, upgradeLoading: false }, item ); - if (obj.progressMsg !== "" && obj.progressMsg !== "宸插畨瑁�") { + 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 + 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.unLoad(appToUnload) - } else { - sdkToUnload = this.installedList.find((item) => { - return item.id == this.productDetail.productBaseId - }) - this.unLoadSdk(sdkToUnload) - } - }, - //鍗歌浇绠楁硶 - unLoadSdk(sdk) { + unloadSdk(sdk) { let _this = this; this.$confirm("纭畾瑕佸嵏杞借绠楁硶鍚�?", "鎻愮ず") .then(() => { - _this.productDetailVisible = false + _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.$notify.success("鍗歌浇瀹屾垚"); _this.getAllSdk(); - window.parent.postMessage( - { - msg: "AppUpdate", - }, - "*" - ); + window.parent.postMessage({ msg: "AppUpdate" }, "*"); } }) .catch((e) => { sdk.unloadLoading = false; }); }) - .catch((e) => { - }); + .catch((e) => {}); }, - upgradeSDKinWin() { - this.isUpgrading = !this.isUpgrading; - - 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", - }); - }).catch((err) => { - this.$notify({ - title: "鍗囩骇澶辫触", - message: err.data, - type: "warning", - }); - this.isUpgrading = !this.isUpgrading; - }) - this.sdkUpgreading = true; - } - - - - }, - 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) { + 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.downloading = false; this.downloadItem = ""; - this.$notify({ - type: "success", - message: typ == 1 ? "绠楁硶瀹夎鎴愬姛" : "绠楁硶鍗囩骇鎴愬姛" - }); + + window.parent.postMessage({ msg: "AppUpdate" }, "*"); }) .catch((err) => { - this.$notify({ - type: "warning", - message: err.data, - }); + this.$notify.warning(err.data); item.upgradeLoading = false; - //this.downloading = false; this.downloadItem = ""; }); // 寮�鍚嚜鍔ㄥ埛鏂� this.sdkUpgreading = true; }, - inputBlur(item) { - this.$set(item, "isEdit", false); - }, - handleTabClick() { }, autoRefreshAppAndSdkState() { - // 鍏抽棴鍚庨��鍑� + this.getAllApps(); + this.getAllSdk(); if (!this.autoRefresh) { return; } - - if (this.appUpgreading) { - this.getAllApps(); - } - - if (this.sdkUpgreading) { - this.getAllSdk(); - } - - let _this = this; setTimeout(() => { - _this.autoRefreshAppAndSdkState(); - }, 500); + if (this.appUpgreading) { + this.getAllApps(); + } + if (this.sdkUpgreading) { + this.getAllSdk(); + } + }, 1000); }, }, }; @@ -1634,348 +1000,13 @@ <style lang="scss"> .s-task-manage { width: 100% !important; + min-width: 754px !important; height: 100%; box-sizing: border-box; text-align: left; - min-width: 1106px; - - .el-tabs { - height: calc(100% - 50px); - // margin-top: 5px !important; - } - .el-tabs--border-card > .el-tabs__header { - border: none; - } - .el-tabs__item.is-top { - height: 50px; - padding: 5px 50px !important; - font-size: 15px; - border: none !important; - } - .el-tabs__item.is-top.is-active { - font-weight: bold; - } - .el-tabs__content { - width: 100%; - height: calc(100% - 34px); - box-sizing: border-box; - } - .el-tab-pane { - width: 100%; - height: 100%; - } - .product-detail-dialog { - .dialog-title { - font-size: 13px; - } - .el-dialog { - width: 50%; - min-width: 920px; - position: relative; - } - .el-dialog__header { - text-align: center; - padding: 6px; - - .el-dialog__headerbtn { - position: absolute; - top: 5px; - - right: 20px; - padding: 0; - background: transparent; - outline: none; - cursor: pointer; - font-size: 20px; - } - } - .el-dialog__body { - background-color: rgba(222, 225, 230, 1); - padding: 8px 3px; - .button-group { - position: absolute; - top: 3px; - - left: 6px; - left: 10px; - .el-button--small { - padding: 5px 12px; - } - button { - font-size: 18px; - line-height: 12px; - } - } - } - - .dialog-content { - .box-top { - height: 330px; - .top-left { - float: left; - width: 55%; - background-color: rgba(253, 253, 253, 1); - margin: 0 0.5%; - height: 330px; - border-radius: 2px; - .banner { - text-align: center; - margin-top: 3px; - video { - margin: 0px auto; - margin-top: 23px; - - width: 443px; - height: 277px; - } - img { - max-width: 90%; - margin-top: 28px; - } - } - } - .top-right { - float: left; - width: 43%; - margin: 0 0.5%; - height: 330px; - background-color: rgba(253, 253, 253, 1); - position: relative; - border-radius: 2px; - overflow: hidden; - .summary { - height: 120px; - margin: 5px 5px 0 5px; - .icon { - margin: 0 10px; - margin-top: 8px; - float: left; - .baseImg { - max-width: 106px; - max-height: 106px; - } - } - - .right-desc { - float: left; - position: absolute; - left: 140px; - .name { - font-size: 28px; - - margin-bottom: 5px; - text-overflow: ellipsis; - white-space: nowrap; - overflow: hidden; - width: 250px; - } - .tags { - margin-bottom: 10px; - .el-tag { - margin-right: 10px; - } - } - } - } - .jihuo-input { - margin-left: 10px; - margin-bottom: 10px; - .el-input { - float: left; - width: 63%; - margin-bottom: 8px; - margin-right: 10px; - } - el-button { - float: left; - } - } - .product-intruduction { - height: 200px; - margin-top: 3px; - - .part-title { - display: block; - line-height: 20px; - - font-size: 16px; - margin-left: 24px; - border-bottom: 3px solid #3d68e1; - width: fit-content; - height: 26px; - margin-bottom: 8px; - } - .text { - height: 156px; - overflow: auto; - padding: 0 15px 0px 15px; - - .single-desc { - margin-bottom: 10px; - font-size: 13px; - } - } - } - } - } - .box-bottom { - margin-top: 8px; - - height: 240px; - .bot-left { - width: 49%; - height: 240px; - background-color: rgba(253, 253, 253, 1); - margin: 0 0.5%; - border-radius: 2px; - float: left; - .part-title { - display: block; - line-height: 35px; - font-size: 16px; - margin-left: 24px; - border-bottom: 3px solid #3d68e1; - width: fit-content; - margin-bottom: 10px; - - height: 33px; - } - .list-zone { - overflow: auto; - height: 190px; - padding: 0 20px; - .list-item { - .desc { - background-color: rgba(242, 242, 242, 1.3); - margin: 5px 12px 0 12px; - font-size: 12px; - line-height: 18px; - } - margin-bottom: 12px; - } - } - } - .bot-right { - height: 240px; - float: left; - background-color: rgba(253, 253, 253, 1); - width: 49%; - margin: 0 0.5%; - border-radius: 2px; - - .part-title { - display: block; - line-height: 35px; - font-size: 16px; - margin-left: 24px; - border-bottom: 3px solid #3d68e1; - width: fit-content; - margin-bottom: 5px; - height: 33px; - } - .item-zone { - overflow: auto; - height: 225px; - padding: 0px 12px; - - .item { - height: 165px; - width: 130px; - float: left; - border-radius: 10px; - box-shadow: 0px 5px 14px rgba(0, 0, 0, 0.0666666666666667); - position: relative; - - .el-tag { - float: right; - margin: 8px; - } - .icon { - margin: 0 auto; - img { - max-width: 60px; - max-height: 60px; - position: absolute; - 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; - } - } - .look-button { - position: absolute; - left: 30%; - - top: 76%; - } - } - } - } - } - } - } -} -.flex-title { - display: flex; - justify-content: space-between; - align-items: center; + background-color: #fff; } -.el-loading-mask .el-loading-spinner { - top: 40px !important; -} -.el-loading-mask .el-loading-spinner svg { - transform: none !important; - top: 20px !important; - left: 40% !important; -} -.el-loading-mask .el-loading-spinner p.el-loading-text { - display: block !important; - text-align: center !important; - bottom: 10px !important; - top: 80px !important; - right: 0 !important; - color: #78adf7; -} -.el-loading-mask .el-loading-spinner .path { - stroke: #78adf7; -} -.installInfo { - text-indent: 2em; - font-size: 14px; - line-height: 26px; - p { - text-align: center; - } -} -.src-title { - //color: #bfbfbf; - color: #bbcee8; - font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC"; - font-weight: 650; - font-style: normal; - height: 36px; - font-size: 15px; - padding-left: 25px; -} -.update-badge .el-badge__content.is-fixed { - top: 10px; - right: 4px; -} -.empty-tip { - padding-left: 25px; - color: #ccc; margin-bottom: 18%; - -} .task-manage { height: 100%; .installModel { @@ -1989,7 +1020,7 @@ .progress-bar { width: 70%; height: 17px; - border-radius: 3px; + border-radius: 3pxd; background-color: rgb(227, 229, 231); position: absolute; top: 50%; @@ -2008,22 +1039,11 @@ } } } - .el-tab-pane { - height: auto !important; - } - .el-tabs--border-card > .el-tabs__content { - padding: 0 !important; - overflow: auto !important; - background-color: #fff; - } - .el-tabs__content { - padding: 0 !important; - overflow: auto !important; - } .super { width: 100%; height: 100%; + // caret-color: rgba(0, 0, 0, 0); .title { margin-bottom: 10px; line-height: 30px; @@ -2034,177 +1054,474 @@ .left-box { height: 100%; box-sizing: border-box; - .el-drawer__header { - border-bottom: 2px solid #eee; - padding-bottom: 10px; - font-size: 16px; - margin-bottom: 0px; - span { - outline: none !important; - } - } - .action-bar { - margin-bottom: 30px; - .el-input { - width: 100%; - } - } - .task-list { - background: #fff; - padding: 20px; - box-sizing: border-box; - - .flex-list { - display: flex; - flex-direction: row; - flex-wrap: wrap; - min-height: 200px; - .wrap-box { - width: 11%; - } - .list-choose-item-left { - width: 80%; - height: auto; - margin: auto; - margin-bottom: 30px; - max-width: 150px; - .mask { - width: 100%; - - .el-button + .el-button { - margin-left: 0 !important; - } - } - } - } - } - .store-list, - .app-list { + .nav-box { + height: 200px; display: flex; - flex-wrap: wrap; - .wrap-box { - width: 11%; - margin-bottom: 30px; - .list-choose-item-left { - width: 80%; - height: auto; - margin: auto; - margin-bottom: 30px; - max-width: 150px; - } - .inner { - width: 80%; - box-sizing: border-box; - position: relative; + justify-content: space-between; + padding: 35px 60px; + position: relative; + .nav-box-menu { + width: 200px; + height: 200px; + z-index: 99; + .menu-item { font-size: 14px; - padding-bottom: 10px; - transition: all 1s; - background: #ffffff; - border: 1px solid #e2e2e2; - box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.07); - border-radius: 4px; - margin: auto; - .alg-icon { - position: relative; - width: 80%; - margin: auto; - padding-top: 80%; - svg { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); + 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; } } - .alg-name { - height: 20px; - text-align: center; - line-height: 20px; + .el-input-group--append .el-input__inner, + .el-input-group__prepend { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + border: none; } - .mask { - position: absolute; - top: 0; - left: 0; - 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; - svg { - position: absolute; - top: 49%; - left: 50%; - transform: translate(-50%, -50%); - z-index: 33; + .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; + } } } - &:hover { - .mask { - display: block; - } + .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%; } } } - .drawer-content { - font-family: "PingFangSC-Regular"; - .el-step__title.is-process { - border-color: #3d68e1 !important; - color: #3d68e1 !important; - font-family: Tahoma, Helvetica, Arial, "\5B8B\4F53", sans-serif; + .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; } - .el-step__head.is-process { - border-color: #3d68e1 !important; - color: #3d68e1 !important; - font-family: Tahoma, Helvetica, Arial, "\5B8B\4F53", sans-serif; - } - .el-input { - width: 100%; - margin-bottom: 30px; - } - .current-step { - margin: 40px 30px 30px; - } - .act-code { - padding: 0 30px; - p { - font-size: 15px; - margin-bottom: 16px; + .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; + } } } - .desc { - padding: 0 30px; - margin-bottom: 30px; - li { - border-bottom: 1px solid #eee; - height: 45px; - line-height: 45px; - font-size: 14px; - &:last-child { - border-bottom: none; + .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; } - label { - display: inline-block; - width: 90px; - padding-left: 14px; + .tab-active { + border-bottom: 2px solid #23d7ee; + color: #333333; font-weight: bold; } } - } - .text-right { - padding-right: 30px; - text-align: right; - .tip { - color: #999; - line-height: 38px; + + .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; + } } } - } - .tab-content { - padding: 20px 20px; + .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 { @@ -2242,307 +1559,13 @@ } } - .text-css { - width: 100%; - overflow: hidden; - text-overflow: ellipsis; - } - .move-hear { - margin: 10px 0 0 0; - font-size: 5rem; - } - .list-choose-item { - cursor: pointer; - position: relative; - font-size: 14px; - display: inline-block; - @media screen and(min-width: 1640px) { - margin: 30px 20px 20px 20px; - } - @media screen and(min-width: 1460px) and(max-width: 1640px) { - margin: 30px 20px 20px 10px; - } - @media screen and(max-width: 1460px) { - margin: 30px 10px 20px 10px; - } - min-width: 126px; - height: 120px; - transition: all 1s; - background: #fff; - border: 1px solid #e2e2e2; - box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.07); - border-radius: 4px; - } - .list-choose-item:hover { - .mask { - display: block; - } - } - - .alg-shadow { - -webkit-box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.3); - -moz-box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.3); - box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.3); - } - .select-color { - margin-top: 16px; - text-align: center; - line-height: 28px; - } - .list-choose-item-left { - cursor: pointer; - position: relative; - font-size: 14px; - - transition: all 1s; - border-radius: 4px; - p { - display: none; - text-align: right; - width: 100%; - position: absolute; - right: 10px; - top: 5px; - } - .click-download { - position: absolute; - left: 80%; - top: 5%; - } - } - .list-choose-item-left:hover { - .mask { - display: flex; - align-items: flex-end; - flex-wrap: wrap; - justify-content: center; - top: 0; - - .bot-btn { - flex: 1; - } - &.flex-center { - align-items: center; - justify-content: center; - } - } - } - .list-choose-item-left-uninstal { - color: gray; - filter: grayscale(100%); - } - .list-complete-item.sortable-chosen { - background: #4ab7bd; - } - .list-choose-item.sortable-ghost { - background: #30b08f; - } - .width-new-line { - word-wrap: break-word; - word-break: break-all; - } - .dndList-list { - max-width: 40%; - } - .dic-border { - width: 98%; - min-height: 170px; - background: #fff; - padding: 10px 10px 10px 20px; - } - .min-h { - min-height: 130px; - } - .parent-div { - border-right: 1px solid rgba(24, 28, 33, 0.5); - max-width: 140px; - position: relative; - } - .list-choose-header { - position: relative; - width: 74px; - height: 74px; - background-image: linear-gradient(-137deg, #7076f2 0%, #3d63e1 100%); - box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.07); - border-radius: 37px; - margin: 10px 25px; - } - - .task-name-div { - font-family: PingFangSC-Medium; - font-size: 15px; - color: #4b68e6; - text-align: center; - margin-top: 6px; - max-width: 120px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - .border-dash { - height: 30px; - width: 96%; - margin-bottom: 10px; - border: 1px dashed rgba(24, 28, 33, 0.5); - } - .i-setting { - position: absolute; - font-size: 28px; - margin-top: -25px; - margin-left: -30px; - } - .i-delete { - position: absolute; - font-size: 28px; - margin-top: -25px; - margin-left: -8px; - color: red; - } - .i-bell { - float: left; - position: relative; - left: 10px; - top: 10px; - font-size: 24px; - color: red; - } - .task-msg { - padding-left: 10px; - } - .b-top { - width: 100%; - padding-top: 10px; - } - .b-bottom { - width: 100%; - border-bottom: 1px solid rgba(24, 28, 33, 0.5); - } - .i-set-right { - position: absolute; - left: 80px; - top: -11px; - font-size: 24px; - } - .i-remove-right { - position: absolute; - right: -1px; - top: -11px; - font-size: 24px; - color: red; - } - .alg-t { - line-height: 31px; - font-family: PingFangSC-Medium; - font-size: 14px; - color: #222222; - } - .alg-name { - //margin-top: 12px; - line-height: 20px; - font-family: PingFangSC-Regular; - font-size: 14px; - letter-spacing: 0.05em; - color: #333; - .el-input { - position: relative; - font-size: 14px; - display: inline-block; - width: 100%; - } - } - .unit-class { - margin-left: 10px; - text-align: center; - line-height: 38px; - } .el-input { position: relative; font-size: 14px; - display: inline-block; - width: 80%; + // display: inline-block; + // width: 80%; } - .list-complete-item-handle { - height: 100%; - //padding-bottom: 10px; - text-align: center; - .svg-wrap { - //width: 80%; - width: 100%; - margin: auto; - padding-top: 80%; - padding-top: 100%; - position: relative; - box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.07); - border-radius: 25px; - svg { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - } - .baseImg { - width: 100%; - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - max-height: 150px; - } - } - .willUpGrade { - .update-icon { - position: absolute; - top: -8px; - right: -8px; - z-index: 999; - } - .iconupdate { - color: #01e667; - position: absolute; - top: 5px; - right: 5px; - font-weight: 550; - font-size: 26px; - z-index: 999; - } - } - &.uninstall { - .svg-wrap { - filter: grayscale(100%); - } - .alg-name { - color: grey; - } - } - } - .dragAreaR { - height: 100%; - } - .drag-info { - min-width: 126px; - height: 120px; - border: 1px dashed #3d68e1; - box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.07); - // box-shadow: 0px 0px 10px 3px rgba(0,0,0,0.3); - border-radius: 4px; - margin: 30px 10px 20px 10px; - } - .drag-info-text { - letter-spacing: 3px; - line-height: 20px; - width: 80px; - height: 42px; - font-family: PingFangSC-Regular; - font-size: 13px; - color: #3d68e1; - text-align: center; - } - .task-edit { - font-size: 26px; - position: relative; - bottom: -6px; - } .el-button--cancle { background: #eaeaea; border-radius: 2px; @@ -2552,85 +1575,15 @@ color: #222222; margin-right: 12px; } - .click-changeImg { - cursor: pointer; - display: none; - background: rgba(0, 0, 0, 0.35); - width: 74px; - line-height: 20px; - color: rgb(255, 255, 255); - font-size: 14px; - opacity: 1; - border-radius: 6px; - } - - .task-name-google { - position: relative; - top: 30px; - width: 126px; - height: 120px; - border: 1px solid #fff; - background: #fff; - border-radius: 4px; - cursor: pointer; - .set-task { - display: none; - cursor: pointer; - } - - .el-switch__core { - width: 27px !important; - height: 14px; - } - .el-switch__core:after { - width: 10px; - height: 10px; - } - .el-switch.is-checked .el-switch__core::after { - left: 100%; - margin-left: -11px; - } - } - .task-name-google:hover { - .mask { - display: block; - } - } } } -.active-Dial { - .el-dialog { - min-width: 400px; - } - .dialog-active { - .desc { - padding: 0 30px; - margin-bottom: 30px; - li { - border-bottom: 1px solid #eee; - height: 45px; - line-height: 45px; - font-size: 14px; - &:last-child { - border-bottom: none; - } - label { - display: inline-block; - width: 90px; - padding-left: 14px; - font-weight: bold; - } - } - } - .text-right { - padding-right: 30px; - text-align: right; - .tip { - color: #999; - line-height: 38px; - } - } +@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