From ba2dff93d5a73e0824d1da91ea01571e60e2ff2a Mon Sep 17 00:00:00 2001 From: hanbaoshan <hanbaoshan@aiotlink.com> Date: 星期四, 24 九月 2020 10:59:00 +0800 Subject: [PATCH] 桌面应用名称颜色恢复 --- src/pages/ai/index/App.vue | 555 +++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 379 insertions(+), 176 deletions(-) diff --git a/src/pages/ai/index/App.vue b/src/pages/ai/index/App.vue index b4293e5..83b1d58 100644 --- a/src/pages/ai/index/App.vue +++ b/src/pages/ai/index/App.vue @@ -21,28 +21,25 @@ > <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"> - <!-- <draggable - :list="installedList" - :group="{ name: 'article', pull: 'clone', put: false }" - :sort="false" - @start="startRight" - @end="endLeft" - style="display:inline" - >--> - <div class="wrap-box" v-for="item in ungradeList" :key="item.id"> <div class="list-choose-item-left"> - <div class="mask"> + <div class="mask flex-center"> + <div class="info-onmask"> + <div>褰撳墠鐗堟湰:{{item.version}}</div> + <div>鏈�鏂扮増鏈�:{{item.remoteVersion}}</div> + </div> <el-button type="primary" class="bot-btn" @click="donwload(item)">鍗囩骇</el-button> </div> <div class="list-complete-item-handle"> <div class="svg-wrap"> - <!-- <svg class="icon" aria-hidden="true" style="font-size:7rem;"> - <use :xlink:href="`#${item.icon}`" /> - </svg> --> - <img class="baseImg" :src="`data:image/png;base64,${item.iconBlob}`" alt=""> + <img + class="baseImg" + :src="`data:image/png;base64,${item.iconBlob}`" + alt + /> </div> <div class="alg-name"> <div style="padding:0px 10px 0px 10px;"> @@ -54,19 +51,13 @@ </div> <div class="wrap-box" v-for="(item) in installedList" :key="item.id"> <div class="list-choose-item-left"> - <div class="mask" v-if="!item.isEdit"> - <el-button - @click="commandAlgLib(item)" - type="primary" - class="bot-btn" - >缂栬緫鍚嶇О</el-button> - </div> - <div class="list-complete-item-handle"> - <!-- <span :class="`iconfont ${item.icon}`" style="font-size:3rem;"></span> --> + <div class="list-complete-item-handle"> <div class="svg-wrap"> - <!-- <svg class="icon" aria-hidden="true" style="font-size:7rem;"> - <use :xlink:href="`#${item.icon}`" /> - </svg>--> + <div class="mask flex-center" v-if="!item.isEdit"> + <div class="info-onmask"> + <div>褰撳墠鐗堟湰:{{item.version}}</div> + </div> + </div> <img class="baseImg" :src="`data:image/png;base64,${item.iconBlob}`" @@ -103,12 +94,12 @@ <span class="iconfont iconxiazai1"></span> </div> <div class="list-complete-item-handle"> - <!-- <span :class="`iconfont ${item.icon}`" style="font-size:3rem;"></span> --> <div class="svg-wrap"> - <!-- <svg class="icon" aria-hidden="true" style="font-size:7rem;"> - <use :xlink:href="`#${item.icon}`" /> - </svg> --> - <img class="baseImg" :src="`data:image/png;base64,${item.iconBlob}`" alt=""> + <img + class="baseImg" + :src="`data:image/png;base64,${item.iconBlob}`" + alt + /> </div> <div class="alg-name"> <div style="padding:0px 10px 0px 10px;"> @@ -119,7 +110,39 @@ </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" v-loading="item.unloadLoading" element-loading-text="鍗歌浇涓�" element-loading-background="rgba(0,0,0,.8)"> + <div class="mask" v-if="!item.isDefault"> + <el-button + v-if="!item.isDefault" + @click="unLoad(item)" + type="primary" + class="bot-btn" + >鍗歌浇</el-button> + </div> + <img class="baseImg" :src="`${item.iconBlob?'data:image/png;base64,'+item.iconBlob: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> + </div> </div> </el-tab-pane> @@ -134,7 +157,7 @@ single tip tipWords="涓婁紶绠楁硶" - uploadPlaceholder="绂荤嚎瀹夎绠楁硶" + uploadPlaceholder="涓婁紶瀹夎杞欢" url="/data/api-v/sdk/upload" @complete="onFileUpload" @file-added="onFileAdded" @@ -144,26 +167,74 @@ </el-tab-pane> <el-tab-pane label="搴旂敤涓績" name="algorithmMall" v-show="activeName==='algorithmMall'"> <div class="tab-content"> - <p>绠楁硶杞欢</p> - <div class="store-list"> - <div class="wrap-box"> - <div class="inner"> - <div class="mask" @click="actDrawerShow=true"> - <svg class="icon" aria-hidden="true" style="font-size:2rem;"> - <use xlink:href="#iconyunxiazai" /> - </svg> + <p class="src-title">绠楁硶杞欢</p> + <div class="store-list flex-list"> + <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="actSdk(item.id)"> + <span + class="iconfont iconyunxiazai" + style="color:#ff6a00;font-size:20px;position:absolute;top:45%;left:45%" + ></span> + </div> + <img + class="baseImg" + :src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`" + 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 class="alg-icon"> - <svg class="icon" aria-hidden="true" style="font-size:7rem;"> - <use xlink:href="#iconrenyuanyidong" /> - </svg> - </div> - <div class="alg-name">name</div> </div> </div> </div> - <p>搴旂敤杞欢</p> - <div class="app-list"></div> + <p class="src-title">搴旂敤杞欢</p> + <div class="app-list flex-list"> + <div class="wrap-box" v-for="item in storeApps" :key="item.id"> + <div class="list-choose-item-left"> + <div class="list-complete-item-handle"> + <div class="svg-wrap" v-loading="item.installLoading" element-loading-text="瀹夎涓�" element-loading-background="rgba(0,0,0,.8)"> + <div class="mask"> + <el-button type="primary" class="bot-btn" @click="downloadApp(item)">瀹夎</el-button> + </div> + <img + class="baseImg" + :src="item.iconBlob? 'data:image/png;base64,'+item.iconBlob: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> <el-drawer title="涓嬭浇" :visible.sync="actDrawerShow" :direction="direction"> <div class="drawer-content"> @@ -191,28 +262,28 @@ <ul class="desc"> <li> <label>婵�娲荤爜:</label> - <span>YUAAA-AAAEU-QJQE3-ZRRXD-K9MWR</span> + <span>{{activedSdk.activateCode}}</span> </li> <li> <label>浜у搧鍚嶇О:</label> - <span>浜哄憳璺熻釜SDK</span> + <span>{{activedSdk.productName}}</span> </li> <li> <label>閰嶇疆璇︽儏:</label> - <span>鏃�</span> + <span>{{activedSdk.setting}}</span> </li> <li> <label>鏈嶅姟鍒版湡鏃�:</label> - <span>2021-03-04</span> + <span>{{activedSdk.expireTime}}</span> </li> <li> <label>璁稿彲璇�:</label> - <span>鏈澶�</span> + <span>{{activedSdk.licence}}</span> </li> - <li> + <!-- <li> <label>璁惧ID:</label> <span>3342-235f-ret55-fdsg</span> - </li> + </li>--> </ul> <div class="text-right"> <el-button type="primary" @click="checkMyAlgorith">纭畾</el-button> @@ -249,6 +320,8 @@ downloadSdk, installSdk } from "./api"; +import { getApps,installApp,removeApp } from "@/api/app"; +import { getUnActivedSdk, actPageAlg } from "@/api/app"; import FileUploader from "@/components/subComponents/FileUpload/index"; import TaskManage from "@/Pool/TaskMange"; import VideoManageData from "@/Pool/VideoManageData"; @@ -259,25 +332,26 @@ FileUploader }, computed: { - notInstalledList() { + notInstalledList () { return this.TaskMange.list1.filter(sdk => { return sdk.installed === false; }); }, - installedList() { + installedList () { return this.TaskMange.list1.filter(sdk => { return sdk.installed === true; }); }, - ungradeList() { + ungradeList () { // 鍗囩骇澶勭悊浼氬鑷撮噸澶嶇殑key,闇�瑕佷慨鏀� return []; return this.TaskMange.list1.filter(sdk => { return sdk.isUpgrade === true; }); - } + }, + }, - data() { + data () { return { TaskMange: new TaskManage, VideoManageData: new VideoManageData, @@ -343,12 +417,26 @@ sceneSdks: [], sceneRuleList: "", isInstall: false, - installPercentage: 0 + installPercentage: 0, + unActivedSDKList: [], + actSdkId: '', + activedSdk: { + activateCode: '', + productName: '', + setting: '', + expireTime: '', + licence: '', + devIds: '' + }, + // unloadLoading: false, + // installLoading: false, + installedApps:[], + storeApps:[] } }, watch: { list2: { - handler(newVal, oldVal) { + handler (newVal, oldVal) { // window.console.log(newVal, oldVal, '鐩戝惉list2') if (newVal !== oldVal) { // window.console.log(newVal, '鐩戝惉list2') @@ -369,30 +457,125 @@ } } }, - mounted() { + mounted () { + this.getAllApps(); this.findAllSdk(); this.findByType(); this.getBaseList(); this.findAll(); this.getUser(); + this.getUnActivedList(); // this.TaskMange.findAllSdk(); // this.TaskMange.findByType(); this.VideoManageData.init(); }, methods: { - installFormat(percentage) { + downloadApp(app){ + app.installLoading = true; + let _this = this; + installApp(app).then(res=>{ + if(res && res.success){ + setTimeout(()=>{ + app.installLoading = false; + _this.getAllApps(); + window.parent.postMessage({ + msg: "AppUpdate" + }, '*') + },3000); + } + }) + }, + getAllApps(){ + let _this = this; + _this.installedApps = []; + _this.storeApps = []; + getApps().then(res=>{ + if(res && res.success){ + //_this.storeApps = res.data; + res.data.forEach(item=>{ + if(item.installed){ + let obj = Object.assign({unloadLoading:false},item) + _this.installedApps.push(obj) + }else{ + let obj = Object.assign({installLoading:false},item) + _this.storeApps.push(obj) + } + }); + console.log('_this.installedApps',_this.installedApps); + console.log('_this.storeApps',_this.storeApps); + } + }) + }, + //鍗歌浇搴旂敤 + unLoad(app){ + app.unloadLoading = true; + let _this = this; + removeApp({appId:app.id}).then(res=>{ + + if(res && res.success){ + setTimeout(()=>{ + app.unloadLoading = false; + _this.getAllApps(); + window.parent.postMessage({ + msg: "AppUpdate" + }, '*') + },3000); + } + }) + + }, + actSdk (id) { + this.actSdkId = id; + this.actDrawerShow = true; + this.actStep = 0; + this.activeCode = ''; + this.activedSdk = this.newActInfo() + }, + newActInfo(){ + return { + activateCode: '', + productName: '', + setting: '', + expireTime: '', + licence: '', + devIds: '' + } + }, + getUnActivedList () { + getUnActivedSdk().then(res => { + if (res.code == 200) { + this.unActivedSDKList = res.data; + } + }) + + }, + installFormat (percentage) { return percentage === 100 ? '瀹夎鎴愬姛' : `${percentage}%`; }, - actived() { - //this.activeCode - this.actStep++ + actived () { + let _this = this; + actPageAlg(this.actSdkId, this.activeCode).then(res => { + if (res.data.isSuccess) { + _this.activedSdk = res.data.successMsg; + _this.actStep++; + _this.getUnActivedList(); + _this.findAllSdk(); + }else{ + _this.$notify({ + type:'error', + message:res.data.failMsg.failMsg + }); + } + }).catch(e => { + console.log(e) + }) }, - getCodeDetail() { }, - checkMyAlgorith() { + getCodeDetail () { }, + checkMyAlgorith () { this.actDrawerShow = false; this.activeName = "myAlgorithm"; }, - onFileUpload(file) { + onFileUpload (file) { //this.patchUpdateStatus = `<span style="color:green">涓婁紶鎴愬姛, 鐐瑰嚮鍗囩骇鎸夐挳寮�濮嬪畨瑁�</span>`; this.patchFile = { ...file }; this.fileAdded = true; @@ -443,7 +626,7 @@ //瀹夎 installSdk(file).then(res => { if (res.success) { - debugger + this.isInstall = false; //this.$refs['progressBar'].style.width = 100% //this.installPercentage = 100% @@ -463,12 +646,12 @@ }, - onFileAdded(f) { - debugger; + onFileAdded (f) { + ; this.patchUpdateStatus = ""; }, // 鏍¢獙杈撳叆鐨勬槸鍚︽槸鏁板瓧 - valiNum(value) { + valiNum (value) { if (value) { let re = /[^\-?\d.]*$/; if (!re.test(value)) { @@ -485,7 +668,7 @@ } }, // 宸﹁竟鎷栧姩妯″潡寰楁嫋鍔ㄧ粨鏉熷悗鐨勮Е鍙戝嚱鏁� - endLeft(env) { + endLeft (env) { this.dragging = false; let taskId = env.to.id; let sdkId = this.TaskMange.list1[env.oldIndex].id; @@ -526,24 +709,24 @@ this.addTaskSdk(json); }, // 鍙宠竟鎷栧姩妯″潡寮�濮嬫嫋鍔ㄨЕ鍙戝嚱鏁� - startRight(env) { + startRight (env) { this.$nextTick(() => { this.dragging = true; }); // window.window.console.log(env, "right start"); }, // 鍙宠竟鎷栧姩妯″潡鎷栧姩缁撴潫瑙﹀彂鍑芥暟 - endRight(env) { + endRight (env) { // window.window.console.log(env, "right end"); }, - clickSet(data) { + clickSet (data) { if (data.isSetting) { data.isSetting = false; } else { data.isSetting = true; } }, - clickDel(data, Index) { + clickDel (data, Index) { this.$confirm("鎻愮ず锛氬垹闄ゅ悗锛屾浠诲姟鍦ㄦ憚鍍忔満涓殑搴旂敤澶辨晥锛屾槸鍚﹀垹闄わ紵", { center: true, showConfirmButton: true, @@ -556,7 +739,7 @@ }) .catch(err => { }); }, - clickSetAlgo(row, data) { + clickSetAlgo (row, data) { // window.console.log(row, data, "缂栬緫浠诲姟涓煇涓�涓畻娉�"); if (row.isShowSetAlgo && data.id === this.TaskMange.currentAlgoId) { row.isShowSetAlgo = false; @@ -622,7 +805,7 @@ // }); } }, - async getRulesByTaskSdk(taskId, sdkId) { + async getRulesByTaskSdk (taskId, sdkId) { let res = await getRulesByTaskSdk({ taskId: taskId, sdkId: sdkId @@ -658,10 +841,9 @@ this.argsList = JSON.parse(JSON.stringify(this.TaskMange.argsList)); } }, - async findAllSdk() { + async findAllSdk () { let res = await findAllSdk(); if (res && res.success) { - // debugger this.TaskMange.list1 = res.data.map((i, index) => { this.$set(i, "isEdit", false); //mock 鏈畨瑁�/寰呭崌绾� @@ -676,7 +858,7 @@ }); } }, - addTask() { + addTask () { let obj = { id: "", name: "浠诲姟" + this.TaskMange.list2.length, @@ -692,7 +874,7 @@ taskArea.scrollTop = taskArea.scrollHeight; }); }, - async findAll() { + async findAll () { let res = await findAll(); if (res && res.success) { if (res.data && res.data.length !== 0) { @@ -729,7 +911,7 @@ } } }, - clickDelSdk(task, sdk) { + clickDelSdk (task, sdk) { this.$confirm( "鎻愮ず锛氬垹闄ゅ悗锛屾绠楁硶鍦ㄦ湰浠诲姟涓Щ闄わ紝鍚屾椂鍦ㄦ憚鍍忔満涓殑搴旂敤澶辨晥锛屾槸鍚﹀垹闄わ紵", { @@ -745,7 +927,7 @@ }) .catch(err => { }); }, - selectChange(event, type, data) { + selectChange (event, type, data) { if (type === "options1") { // window.window.console.log(type, data, "閫夋嫨涓嬫媺妗�"); data.options1.map(i => { @@ -756,7 +938,7 @@ } }, // 鍒犻櫎浠诲姟绠楁硶 - async delTaskSdk(task, sdk) { + async delTaskSdk (task, sdk) { let json = { taskId: task.id, sdkId: sdk.id @@ -776,7 +958,7 @@ } }, // 鍒犻櫎浠诲姟 - async deleteTask(data, index) { + async deleteTask (data, index) { // window.console.log(data, "deleteTask"); let res = await deleteTask({ taskId: data.id }); // this.$toast({ @@ -793,7 +975,7 @@ } }, // 鏇存柊浠诲姟鐘舵�� - async updateTaskStatus(data) { + async updateTaskStatus (data) { // window.console.log(data, '鏇存柊浠诲姟鐘舵��') let json = { taskId: data.id, @@ -811,7 +993,7 @@ }); }, // 鏇存柊浠诲姟鍚嶇О - async updateTaskName(data) { + async updateTaskName (data) { let json = { taskId: data.id, taskName: data.name @@ -831,7 +1013,7 @@ } }, // 鑾峰彇搴曞簱鏁版嵁 - async getBaseList() { + async getBaseList () { // let res = await getTagList(); // if (res && res.success) { // let filter = res.data.filter(i => { @@ -860,7 +1042,7 @@ ]; }, // 鑾峰彇绠楁硶鍙傛暟 - async getSdkArgs(data) { + async getSdkArgs (data) { let res = await getSdkArgs({ sdkId: data.id, scope: "TASKRULE" @@ -882,7 +1064,7 @@ } }, // 鏌ヨ瀛楀吀 - async findByType() { + async findByType () { let res = await findByType(); if (res && res.success) { let list = res.data.RULECOMPUTEBETWEEN.map(i => { @@ -895,17 +1077,17 @@ } }, // 绠楁硶閰嶇疆锛屾柊寤� - add() { + add () { this.TaskMange.argsList.push( JSON.parse(JSON.stringify(this.TaskMange.baseObject)) ); }, // 绠楁硶閰嶇疆 鍒犻櫎 - delRule(index) { + delRule (index) { this.TaskMange.argsList.splice(index, 1); }, // 绠楁硶鍙傛暟淇濆瓨 - async save() { + async save () { let list = this.TaskMange.argsList.map(i => { let obj = {}; obj.id = i.id; @@ -938,7 +1120,7 @@ } } }, - getDefault() { + getDefault () { this.deleteTaskSdkRule( this.TaskMange.currentTaskId, this.TaskMange.currentAlgoId @@ -949,7 +1131,7 @@ ); }); }, - async deleteTaskSdkRule(taskId, sdkId) { + async deleteTaskSdkRule (taskId, sdkId) { let json = { taskId: taskId, sdkId: sdkId @@ -969,7 +1151,7 @@ } }, // 缁欎换鍔℃坊鍔犵畻娉� - async addTaskSdk(data) { + async addTaskSdk (data) { let res = await addTaskSdk(data); if (res && res.success) { // window.console.log(res, 'res') @@ -977,7 +1159,7 @@ } }, // 鏂版坊鍔犱换鍔� - async addTaskAsync(name) { + async addTaskAsync (name) { let res = await addTask({ taskname: name }); // this.$toast({ // type: res.success ? "success" : "error", @@ -993,7 +1175,7 @@ this.findAll(); } }, - cancle(row) { + cancle (row) { if (row.isShowSetAlgo) { row.isShowSetAlgo = false; } @@ -1003,12 +1185,12 @@ this.$set(i, "isSelect", false); }); }, - cancleTask(row) { + cancleTask (row) { if (row.isSetting) { row.isSetting = false; } }, - commandAlgo(command, row, item) { + commandAlgo (command, row, item) { if (command === 1) { // console.log('璁剧疆绠楁硶') this.clickSetAlgo(row, item); @@ -1018,13 +1200,13 @@ this.clickDelSdk(row, item); } }, - commandTask(command, row) { + commandTask (command, row) { if (command === 1) { //缂栬緫浠诲姟 this.clickSet(row); } }, - getUser() { + getUser () { // console.log("鐧诲綍鐢ㄦ埛",JSON.parse(sessionStorage.getItem("userInfo")).username) if ( sessionStorage.getItem("userInfo") && @@ -1037,7 +1219,7 @@ this.isSuperUser = false; } }, - donwload(item) { + donwload (item) { this.downloading = true; this.downloadItem = item.id; @@ -1061,15 +1243,15 @@ this.downloadItem = ""; }); }, - commandAlgLib(item) { + commandAlgLib (item) { this.$set(item, "isEdit", true); }, - inputBlur(item) { + inputBlur (item) { // console.log(item, '淇敼鍚嶇О') this.$set(item, "isEdit", false); }, - - cleanTemplateForm() { + + cleanTemplateForm () { this.appSceneForm.name = ""; this.appSceneForm.desc = ""; this.appSceneForm.rules = ""; @@ -1077,10 +1259,10 @@ this.$refs.ruleEditor.cleanRule(); }, - handleTabClick() { - + handleTabClick () { + }, - handleCreateScene() { + handleCreateScene () { this.sceneDialogVisible = true; this.dialogTitle = '鍒涘缓鍦烘櫙妯℃澘'; @@ -1093,10 +1275,10 @@ this.cleanTemplateForm(); }); }, - handleDialogClose() { + handleDialogClose () { this.sceneDialogVisible = false; }, - handleEditScene(item) { + handleEditScene (item) { this.appSceneForm.name = item.name; this.appSceneForm.desc = item.desc; @@ -1105,8 +1287,8 @@ this.sceneDialogVisible = true; this.dialogTitle = '缂栬緫鍦烘櫙妯℃澘'; }, - - + + } }; </script> @@ -1116,6 +1298,7 @@ height: 100%; box-sizing: border-box; text-align: left; + min-width: 1106px; // background-color: #f2f6fc; .s-video-manage-breadcrumb { height: 5%; @@ -1157,7 +1340,25 @@ color: #606266; cursor: pointer; } - +.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; @@ -1166,6 +1367,16 @@ text-align: center; color: #666; } +} +.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; } .task-manage { height: 100%; @@ -1185,7 +1396,7 @@ position: absolute; top: 50%; left: 50%; - background: url("/images/algo/green.gif"); + background: url('/images/algo/green.gif'); overflow: hidden; transform: translate(-50%, -50%); .inner-bar { @@ -1240,7 +1451,15 @@ height: 100%; box-sizing: border-box; // float: left; - + .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 { @@ -1248,43 +1467,23 @@ } } .task-list { - background: #fff; - padding: 30px 20px 20px; + background: #fdfdfd; + padding: 20px; box-sizing: border-box; + .flex-list { display: flex; flex-direction: row; flex-wrap: wrap; - // justify-content: space-around; - // align-content: space-around; - // &:after { - // content: ""; - // flex: auto; - // } .wrap-box { width: 16.66%; } .list-choose-item-left { - // width: 220px; - // height: 214px; width: 80%; height: auto; margin: auto; margin-bottom: 30px; - // @media screen and(min-width: 1895px) { - // //margin: 20px 25px 20px 20px; - // width: 230px; - // height: 224px; - // } - // @media screen and(min-width: 1695px) and(max-width:1895px ) { - // margin: 20px 10px 20px 15px; - // } - // @media screen and(min-width: 1460px) and(max-width: 1695px) { - // margin: 20px 25px 20px 20px; - // } - // @media screen and(max-width: 1460px) { - // margin: 20px 15px 20px 10px; - // } + max-width: 200px; } } } @@ -1447,12 +1646,19 @@ } } } - .store-list { + .store-list,.app-list { display: flex; flex-wrap: wrap; .wrap-box { width: 16.6%; margin-bottom: 30px; + .list-choose-item-left { + width: 80%; + height: auto; + margin: auto; + margin-bottom: 30px; + max-width: 200px; + } .inner { width: 80%; box-sizing: border-box; @@ -1511,16 +1717,16 @@ } } .drawer-content { - font-family: "PingFangSC-Regular"; + font-family: 'PingFangSC-Regular'; .el-step__title.is-process { border-color: #3d68e1 !important; color: #3d68e1 !important; - font-family: Tahoma, Helvetica, Arial, "\5B8B\4F53", sans-serif; + font-family: Tahoma, Helvetica, Arial, '\5B8B\4F53', sans-serif; } .el-step__head.is-process { border-color: #3d68e1 !important; color: #3d68e1 !important; - font-family: Tahoma, Helvetica, Arial, "\5B8B\4F53", sans-serif; + font-family: Tahoma, Helvetica, Arial, '\5B8B\4F53', sans-serif; } .el-input { width: 100%; @@ -1557,6 +1763,7 @@ } .text-right { padding-right: 30px; + text-align: right; .tip { color: #999; line-height: 38px; @@ -1593,7 +1800,9 @@ z-index: 1; border-radius: 3px; display: none; - + .info-onmask{ + color: #8ecaff; + } i { color: #fff; position: relative; @@ -1657,28 +1866,9 @@ cursor: pointer; position: relative; font-size: 14px; - // display: inline-block; - // @media screen and(min-width: 1895px) { - // //margin: 20px 25px 20px 20px; - // margin: 20px 30px 20px 20px; - // } - // @media screen and(min-width: 1695px) and(max-width:1895px ) { - // margin: 20px 10px 20px 15px; - // } - // @media screen and(min-width: 1460px) and(max-width: 1695px) { - // margin: 20px 25px 20px 20px; - // } - // @media screen and(max-width: 1460px) { - // margin: 20px 15px 20px 10px; - // } - // width: 126px; - // height: 120px; - // width: 220px; - // height: 214px; + transition: all 1s; background: #ffffff; - border: 1px solid #e2e2e2; - box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.07); border-radius: 4px; p { display: none; @@ -1698,10 +1888,16 @@ .mask { display: flex; align-items: flex-end; + top: 0; .bot-btn { flex: 1; } + &.flex-center{ + align-items: center; + justify-content: center; + } } + } .list-choose-item-left-uninstal { color: darkgray; @@ -1813,11 +2009,12 @@ color: #222222; } .alg-name { - margin-top: 12px; + //margin-top: 12px; line-height: 36px; font-family: PingFangSC-Regular; - font-size: 15px; - color: #222222; + font-size: 14px; + letter-spacing: 0.05em; + color: #3e4664; // background-color: #ecf5ff; .el-input { position: relative; @@ -1849,13 +2046,16 @@ } .list-complete-item-handle { height: 100%; - padding-bottom: 10px; + //padding-bottom: 10px; text-align: center; .svg-wrap { - width: 80%; + //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); svg { position: absolute; top: 50%; @@ -1863,10 +2063,13 @@ transform: translate(-50%, -50%); } .baseImg { + width: 56%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); + max-width: 106px; + max-height: 106px; } } } -- Gitblit v1.8.0