From fbf765d5c363f4ccec60fe9d73875099ffe544ff Mon Sep 17 00:00:00 2001
From: hanbaoshan <hanbaoshan@aiotlink.com>
Date: 星期六, 17 十月 2020 10:26:56 +0800
Subject: [PATCH] 应用中心应用添加升级交互
---
src/pages/searchForCluster/index/mixins.ts | 28 +
src/pages/ai/index/App.vue | 283 +++++++----
src/pages/searchForCluster/index/App.vue | 142 +++++
src/pages/searchForCluster/index/Searching.vue | 954 ++++++++++++++++++++++++++++++++++++++
public/images/settings/cloud.png | 0
src/pages/desktop/index/components/ToolsEntry.vue | 1
src/pages/searchForCluster/index/main.ts | 33 +
src/pages/settings/components/CloudNode.vue | 6
src/pages/desktop/index/App.vue | 38 +
9 files changed, 1,376 insertions(+), 109 deletions(-)
diff --git a/public/images/settings/cloud.png b/public/images/settings/cloud.png
index 2679558..25f48c8 100644
--- a/public/images/settings/cloud.png
+++ b/public/images/settings/cloud.png
Binary files differ
diff --git a/src/pages/ai/index/App.vue b/src/pages/ai/index/App.vue
index 653f3cc..aa0dbb2 100644
--- a/src/pages/ai/index/App.vue
+++ b/src/pages/ai/index/App.vue
@@ -23,25 +23,35 @@
<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 ungradeList" :key="item.id">
+ <div class="wrap-box" v-for="item in ungradeList" :key="'upgrade'+item.id">
<div class="list-choose-item-left">
- <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">
+ <div class="svg-wrap" :class="{willUpGrade:item.isUpgrade}">
+ <i class="iconfont iconupdate" v-if="item.isUpgrade"></i>
+ <div class="mask">
+ <div class="info-onmask">
+ <div>褰撳墠鐗堟湰:{{item.version}}</div>
+ <div>鏈�鏂扮増鏈�:{{item.remoteVersion}}</div>
+ </div>
+ <div class="mask-btn">
+ <el-button
+ type="warning"
+ class="bot-btn"
+ size="small"
+ @click="donwload(item)"
+ >鍗囩骇</el-button>
+ </div>
+ </div>
+
+ <!-- <div class="list-complete-item-handle"> -->
+ <!-- <div class="svg-wrap" :class="{willUpGrade:item.isUpgrade}"> -->
<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="">
+ <img v-else class="baseImg" :src="item.icon" alt />
</div>
<div class="alg-name">
<div style="padding:0px 10px 0px 10px;">
@@ -66,7 +76,7 @@
:src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"
alt
/>
- <img v-else class="baseImg" :src="item.icon" alt="">
+ <img v-else class="baseImg" :src="item.icon" alt />
</div>
<div class="alg-name">
<div style="padding:0px 10px 0px 10px;">
@@ -105,7 +115,7 @@
:src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"
alt
/>
- <img v-else class="baseImg" :src="item.icon" alt="">
+ <img v-else class="baseImg" :src="item.icon" alt />
</div>
<div class="alg-name">
<div style="padding:0px 10px 0px 10px;">
@@ -123,17 +133,33 @@
<div class="list-complete-item-handle">
<div
class="svg-wrap"
- v-loading="item.unloadLoading"
- element-loading-text="鍗歌浇涓�"
+ :class="{willUpGrade:item.isUpgrade}"
+ v-loading="item.unloadLoading||item.upgradeLoading"
+ :element-loading-text="item.unloadLoading?'鍗歌浇涓�':'鍗囩骇涓�'"
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>
+ <i class="iconfont iconupdate" v-if="item.isUpgrade"></i>
+ <div class="mask" v-if="!item.isDefault || item.isUpgrade">
+ <div class="info-onmask">
+ <div>褰撳墠鐗堟湰:{{item.version}}</div>
+ <div v-if="item.remoteVersion">鏈�鏂扮増鏈�:{{item.remoteVersion}}</div>
+ </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"
@@ -141,7 +167,7 @@
:src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"
alt
/>
- <img v-else class="baseImg" :src="item.icon" alt="">
+ <img v-else class="baseImg" :src="item.icon" alt />
</div>
<div class="alg-name">
<div style="padding:0px 10px 0px 10px;">
@@ -164,8 +190,8 @@
<div class="list-complete-item-handle uninstall">
<div
class="svg-wrap"
- v-loading="item.installLoading"
- element-loading-text="瀹夎涓�"
+ v-loading="item.installLoading||item.upgradeLoading"
+ :element-loading-text="item.installLoading?'瀹夎涓�':'鍗囩骇涓�'"
element-loading-background="rgba(0,0,0,.8)"
>
<div class="mask">
@@ -181,7 +207,7 @@
:src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"
alt
/>
- <img v-else class="baseImg" :src="item.icon" alt="">
+ <img v-else class="baseImg" :src="item.icon" alt />
</div>
<div class="alg-name">
<div style="padding:0px 10px 0px 10px;">
@@ -242,7 +268,7 @@
:src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"
alt
/>
- <img v-else class="baseImg" :src="item.icon" alt="">
+ <img v-else class="baseImg" :src="item.icon" alt />
</div>
<div class="alg-name">
<div style="padding:0px 10px 0px 10px;">
@@ -279,7 +305,7 @@
:src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"
alt
/>
- <img v-else class="baseImg" :src="item.icon" alt="">
+ <img v-else class="baseImg" :src="item.icon" alt />
</div>
<div class="alg-name">
<div style="padding:0px 10px 0px 10px;">
@@ -442,24 +468,24 @@
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 [];
return this.TaskMange.list1.filter(sdk => {
return sdk.isUpgrade === true;
});
},
- isAdmin() {
+ isAdmin () {
if (
sessionStorage.getItem("userInfo") &&
sessionStorage.getItem("userInfo") !== ""
@@ -471,7 +497,7 @@
return false;
},
},
- data() {
+ data () {
return {
TaskMange: new TaskManage,
VideoManageData: new VideoManageData,
@@ -565,7 +591,7 @@
},
watch: {
list2: {
- handler(newVal, oldVal) {
+ handler (newVal, oldVal) {
// window.console.log(newVal, oldVal, '鐩戝惉list2')
if (newVal !== oldVal) {
// window.console.log(newVal, '鐩戝惉list2')
@@ -586,7 +612,7 @@
}
}
},
- mounted() {
+ mounted () {
this.getAllApps();
this.findAllSdk();
this.findByType();
@@ -599,10 +625,11 @@
this.VideoManageData.init();
},
methods: {
- isShow(authority) {
+ isShow (authority) {
return this.isAdmin || this.buttonAuthority.indexOf("," + authority + ",") > -1
},
- offlineInstall() {
+ //绂荤嚎瀹夎
+ offlineInstall () {
this.installDialogVisible = false;
this.isInstall = true;
//瀹夎
@@ -617,8 +644,11 @@
setTimeout(() => {
this.findAllSdk();
this.getAllApps();
+ window.parent.postMessage({
+ msg: "AppUpdate"
+ }, '*')
this.activeName = 'myAlgorithm';
- }, 3000)
+ }, 3000);
}
}).catch(e => {
@@ -630,22 +660,46 @@
});
})
},
- downloadApp(app) {
- app.installLoading = true;
+ downloadApp (app, action) {
+ if (action == 'upgrade') {
+ app.upgradeLoading = true;
+ } else {
+ app.installLoading = true;
+ }
let _this = this;
+
installApp({ path: app.id }).then(res => {
if (res && res.success) {
setTimeout(() => {
- app.installLoading = false;
+ if (action == 'upgrade') {
+ app.upgradeLoading = false;
+ _this.notify({
+ type:'success',
+ message:'鍗囩骇鎴愬姛'
+ });
+ } else {
+ app.installLoading = false;
+ _this.notify({
+ type:'success',
+ message:'瀹夎鎴愬姛'
+ });
+ }
_this.getAllApps();
window.parent.postMessage({
msg: "AppUpdate"
}, '*')
}, 3000);
}
+ }).catch(e => {
+ console.log(e);
+ if (action == 'upgrade') {
+ app.upgradeLoading = false;
+ } else {
+ app.installLoading = false;
+ }
})
},
- getAllApps() {
+ getAllApps () {
let _this = this;
_this.installedApps = [];
_this.storeApps = [];
@@ -654,10 +708,10 @@
//_this.storeApps = res.data;
res.data.forEach(item => {
if (item.installed) {
- let obj = Object.assign({ unloadLoading: false }, item)
+ let obj = Object.assign({ unloadLoading: false, upgradeLoading: false }, item)
_this.installedApps.push(obj)
} else {
- let obj = Object.assign({ installLoading: false }, item)
+ let obj = Object.assign({ installLoading: false, upgradeLoading: false }, item)
_this.storeApps.push(obj)
}
});
@@ -667,7 +721,7 @@
})
},
//鍗歌浇搴旂敤
- unLoad(app) {
+ unLoad (app) {
app.unloadLoading = true;
let _this = this;
removeApp({ appId: app.id }).then(res => {
@@ -681,6 +735,9 @@
}, '*')
}, 3000);
}
+ }).catch(e => {
+ console.log(e);
+ app.unloadLoading = false;
})
},
@@ -691,7 +748,7 @@
// this.activeCode = '';
// this.activedSdkOrApp = this.newActInfo()
// },
- actSdkOrApp(id, type = 'sdk') {
+ actSdkOrApp (id, type = 'sdk') {
this.actType = type;
this.actId = id;
this.actDrawerShow = true;
@@ -699,7 +756,7 @@
this.activeCode = '';
this.activedSdkOrApp = this.newActInfo()
},
- newActInfo() {
+ newActInfo () {
return {
activateCode: '',
productName: '',
@@ -709,7 +766,7 @@
devIds: ''
}
},
- getUnActivedList() {
+ getUnActivedList () {
getUnActivedSdk().then(res => {
if (res.code == 200) {
this.unActivedSDKList = res.data;
@@ -717,7 +774,7 @@
})
},
- getUnActivedAppList() {
+ getUnActivedAppList () {
getUnActivedApp().then(res => {
if (res.code == 200) {
this.unActivedAppList = res.data;
@@ -725,10 +782,10 @@
});
},
- installFormat(percentage) {
+ installFormat (percentage) {
return percentage === 100 ? '瀹夎鎴愬姛' : `${percentage}%`;
},
- actived() {
+ actived () {
let _this = this;
if (this.actType == 'sdk') {
//婵�娲荤畻娉�
@@ -766,12 +823,12 @@
});
}
},
- 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;
@@ -883,12 +940,12 @@
},
- onFileAdded(f) {
+ onFileAdded (f) {
;
this.patchUpdateStatus = "";
},
// 鏍¢獙杈撳叆鐨勬槸鍚︽槸鏁板瓧
- valiNum(value) {
+ valiNum (value) {
if (value) {
let re = /[^\-?\d.]*$/;
if (!re.test(value)) {
@@ -905,7 +962,7 @@
}
},
// 宸﹁竟鎷栧姩妯″潡寰楁嫋鍔ㄧ粨鏉熷悗鐨勮Е鍙戝嚱鏁�
- endLeft(env) {
+ endLeft (env) {
this.dragging = false;
let taskId = env.to.id;
let sdkId = this.TaskMange.list1[env.oldIndex].id;
@@ -946,24 +1003,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,
@@ -976,7 +1033,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;
@@ -1042,7 +1099,7 @@
// });
}
},
- async getRulesByTaskSdk(taskId, sdkId) {
+ async getRulesByTaskSdk (taskId, sdkId) {
let res = await getRulesByTaskSdk({
taskId: taskId,
sdkId: sdkId
@@ -1078,7 +1135,7 @@
this.argsList = JSON.parse(JSON.stringify(this.TaskMange.argsList));
}
},
- async findAllSdk() {
+ async findAllSdk () {
let res = await findAllSdk();
if (res && res.success) {
this.TaskMange.list1 = res.data.map((i, index) => {
@@ -1095,7 +1152,7 @@
});
}
},
- addTask() {
+ addTask () {
let obj = {
id: "",
name: "浠诲姟" + this.TaskMange.list2.length,
@@ -1111,7 +1168,7 @@
taskArea.scrollTop = taskArea.scrollHeight;
});
},
- async findAll() {
+ async findAll () {
let res = await findAll();
if (res && res.success) {
if (res.data && res.data.length !== 0) {
@@ -1148,7 +1205,7 @@
}
}
},
- clickDelSdk(task, sdk) {
+ clickDelSdk (task, sdk) {
this.$confirm(
"鎻愮ず锛氬垹闄ゅ悗锛屾绠楁硶鍦ㄦ湰浠诲姟涓Щ闄わ紝鍚屾椂鍦ㄦ憚鍍忔満涓殑搴旂敤澶辨晥锛屾槸鍚﹀垹闄わ紵",
{
@@ -1164,7 +1221,7 @@
})
.catch(err => { });
},
- selectChange(event, type, data) {
+ selectChange (event, type, data) {
if (type === "options1") {
// window.window.console.log(type, data, "閫夋嫨涓嬫媺妗�");
data.options1.map(i => {
@@ -1175,7 +1232,7 @@
}
},
// 鍒犻櫎浠诲姟绠楁硶
- async delTaskSdk(task, sdk) {
+ async delTaskSdk (task, sdk) {
let json = {
taskId: task.id,
sdkId: sdk.id
@@ -1195,7 +1252,7 @@
}
},
// 鍒犻櫎浠诲姟
- async deleteTask(data, index) {
+ async deleteTask (data, index) {
// window.console.log(data, "deleteTask");
let res = await deleteTask({ taskId: data.id });
// this.$toast({
@@ -1212,7 +1269,7 @@
}
},
// 鏇存柊浠诲姟鐘舵��
- async updateTaskStatus(data) {
+ async updateTaskStatus (data) {
// window.console.log(data, '鏇存柊浠诲姟鐘舵��')
let json = {
taskId: data.id,
@@ -1230,7 +1287,7 @@
});
},
// 鏇存柊浠诲姟鍚嶇О
- async updateTaskName(data) {
+ async updateTaskName (data) {
let json = {
taskId: data.id,
taskName: data.name
@@ -1250,7 +1307,7 @@
}
},
// 鑾峰彇搴曞簱鏁版嵁
- async getBaseList() {
+ async getBaseList () {
// let res = await getTagList();
// if (res && res.success) {
// let filter = res.data.filter(i => {
@@ -1279,7 +1336,7 @@
];
},
// 鑾峰彇绠楁硶鍙傛暟
- async getSdkArgs(data) {
+ async getSdkArgs (data) {
let res = await getSdkArgs({
sdkId: data.id,
scope: "TASKRULE"
@@ -1301,7 +1358,7 @@
}
},
// 鏌ヨ瀛楀吀
- async findByType() {
+ async findByType () {
let res = await findByType();
if (res && res.success) {
let list = res.data.RULECOMPUTEBETWEEN.map(i => {
@@ -1314,17 +1371,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;
@@ -1357,7 +1414,7 @@
}
}
},
- getDefault() {
+ getDefault () {
this.deleteTaskSdkRule(
this.TaskMange.currentTaskId,
this.TaskMange.currentAlgoId
@@ -1368,7 +1425,7 @@
);
});
},
- async deleteTaskSdkRule(taskId, sdkId) {
+ async deleteTaskSdkRule (taskId, sdkId) {
let json = {
taskId: taskId,
sdkId: sdkId
@@ -1388,7 +1445,7 @@
}
},
// 缁欎换鍔℃坊鍔犵畻娉�
- async addTaskSdk(data) {
+ async addTaskSdk (data) {
let res = await addTaskSdk(data);
if (res && res.success) {
// window.console.log(res, 'res')
@@ -1396,7 +1453,7 @@
}
},
// 鏂版坊鍔犱换鍔�
- async addTaskAsync(name) {
+ async addTaskAsync (name) {
let res = await addTask({ taskname: name });
// this.$toast({
// type: res.success ? "success" : "error",
@@ -1412,7 +1469,7 @@
this.findAll();
}
},
- cancle(row) {
+ cancle (row) {
if (row.isShowSetAlgo) {
row.isShowSetAlgo = false;
}
@@ -1422,12 +1479,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);
@@ -1437,13 +1494,13 @@
this.clickDelSdk(row, item);
}
},
- commandTask(command, row) {
+ commandTask (command, row) {
if (command === 1) {
//缂栬緫浠诲姟
this.clickSet(row);
}
},
- donwload(item) {
+ donwload (item) {
this.downloading = true;
this.downloadItem = item.id;
@@ -1467,15 +1524,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 = "";
@@ -1483,10 +1540,10 @@
this.$refs.ruleEditor.cleanRule();
},
- handleTabClick() {
+ handleTabClick () {
},
- handleCreateScene() {
+ handleCreateScene () {
this.sceneDialogVisible = true;
this.dialogTitle = '鍒涘缓鍦烘櫙妯℃澘';
@@ -1499,10 +1556,10 @@
this.cleanTemplateForm();
});
},
- handleDialogClose() {
+ handleDialogClose () {
this.sceneDialogVisible = false;
},
- handleEditScene(item) {
+ handleEditScene (item) {
this.appSceneForm.name = item.name;
this.appSceneForm.desc = item.desc;
@@ -1594,7 +1651,7 @@
.src-title {
//color: #bfbfbf;
color: #bbcee8;
- font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC";
+ font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC';
font-weight: 650;
font-style: normal;
height: 36px;
@@ -1619,7 +1676,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 {
@@ -1707,6 +1764,13 @@
margin: auto;
margin-bottom: 30px;
max-width: 200px;
+ .mask {
+ width: 100%;
+
+ .el-button + .el-button {
+ margin-left: 0 !important;
+ }
+ }
}
}
}
@@ -1746,6 +1810,9 @@
z-index: 1;
border-radius: 3px;
display: none;
+ .el-button + .el-button {
+ margin-left: 0 !important;
+ }
.tool {
position: absolute;
top: 49%;
@@ -1941,16 +2008,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%;
@@ -2026,6 +2093,10 @@
display: none;
.info-onmask {
color: #8ecaff;
+ }
+ .mask-btn {
+ width: 100%;
+ display: flex;
}
i {
color: #fff;
@@ -2112,6 +2183,8 @@
.mask {
display: flex;
align-items: flex-end;
+ flex-wrap: wrap;
+ justify-content: center;
top: 0;
.bot-btn {
flex: 1;
@@ -2295,6 +2368,16 @@
max-height: 106px;
}
}
+ .willUpGrade {
+ .iconupdate {
+ color: #01e667;
+ position: absolute;
+ top: 5px;
+ right: 5px;
+ font-weight: 550;
+ font-size: 26px;
+ }
+ }
&.uninstall {
.svg-wrap {
background-color: #ddd;
diff --git a/src/pages/desktop/index/App.vue b/src/pages/desktop/index/App.vue
index 6b1a851..9b48ad9 100644
--- a/src/pages/desktop/index/App.vue
+++ b/src/pages/desktop/index/App.vue
@@ -27,13 +27,13 @@
components: {
Desktop, NotificationCenter, NoticeTip, Tools, ToolsEntry
},
- data() {
+ data () {
return {
buttonAuthority: sessionStorage.getItem('buttonAuthoritys') || []
}
},
computed: {
- isAdmin() {
+ isAdmin () {
if (
sessionStorage.getItem('userInfo') &&
sessionStorage.getItem('userInfo') !== ''
@@ -46,7 +46,7 @@
return false
}
},
- mounted() {
+ mounted () {
document.getElementById('app').style.backgroundImage = process.env.VUE_APP_MAIN_URL;
this.showApps();
@@ -79,13 +79,37 @@
});
},
methods: {
- showApps() {
+ showApps () {
let _that = this;
getApps().then(rsp => {
if (rsp && rsp.success) {
_that.$store.state.desktop.docks = [];
let installedApps = [];
+ let testObj = {
+ id: 'tjcxjq',
+ create_by: 'test',
+ create_time: '',
+ height: 675,
+ icon: '../../images/app-mid/search.png',
+ installed: true,
+ isDelete: 0,
+ isUpgrade: false,
+ title: '缁熻鏌ヨ(闆嗙兢)',
+ name: '缁熻鏌ヨ(闆嗙兢)',
+ remoteVersion: '',
+ type: '2',
+ update_by: '',
+ update_time: '',
+ url: "/view/searchForCluster/",
+ version: '1.0.0',
+ width: 1344,
+ isDefault: false
+ };
+
+ console.log(rsp.data);
+ rsp.data.push(testObj);
+
rsp.data.forEach(function (item) {
if (item.installed) {
let temp = {
@@ -133,7 +157,7 @@
addWeather: function (weather) {
this.$store.commit('desktop/addWeather', weather);
},
- screenShot(dock) {
+ screenShot (dock) {
//鎵惧埌褰撳墠鐨刬frame
let curIframe = Array.from(document.querySelectorAll('iframe')).find(iframe => iframe.src.indexOf(dock.url) >= 0);
//淇濆瓨褰撳墠搴旂敤蹇収
@@ -179,12 +203,12 @@
width: 100%;
height: 100%;
background-size: 100% 100%;
- background-image: url("/images/desktop/background.png");
+ background-image: url('/images/desktop/background.png');
background-attachment: fixed;
}
.clearFix:after {
- content: "";
+ content: '';
display: block;
height: 0;
clear: both;
diff --git a/src/pages/desktop/index/components/ToolsEntry.vue b/src/pages/desktop/index/components/ToolsEntry.vue
index 8ffbfc7..c622e64 100644
--- a/src/pages/desktop/index/components/ToolsEntry.vue
+++ b/src/pages/desktop/index/components/ToolsEntry.vue
@@ -61,6 +61,7 @@
},
methods: {
dockClick(dock) {
+ debugger
if (dock.type === '1') {
window.open(dock.url);
} else if (dock.type === '2' && !dock.isOpen) {
diff --git a/src/pages/searchForCluster/index/App.vue b/src/pages/searchForCluster/index/App.vue
new file mode 100644
index 0000000..44cca51
--- /dev/null
+++ b/src/pages/searchForCluster/index/App.vue
@@ -0,0 +1,142 @@
+<template>
+ <div class="column">
+ <div class="column-left">
+ <div class="resize-bar"></div>
+ <div class="resize-line"></div>
+ <div class="resize-save">
+ <left-nav :appName="'Search'" :height="screenHeight - 40"></left-nav>
+ </div>
+ </div>
+ <div class="column-right">
+ <right-side />
+ </div>
+ <card-window></card-window>
+ </div>
+</template>
+
+<script>
+import LeftNav from "@/components/LeftNav";
+// import CameraVideo from "./components/Video.vue";
+import RightSide from "./Searching"
+import CardWindow from "@/components/cardWindow";
+
+export default {
+ name: "SearchPage",
+ components: {
+ LeftNav,
+ RightSide,
+ CardWindow
+ },
+ data() {
+ return {
+ screenHeight: 0,
+ }
+ },
+ created() {
+ // this.parseUrl();
+
+ },
+ mounted() {
+ this.screenHeight = document.documentElement.clientHeight - 20;
+ window.onresize = () => {
+ return (() => {
+ this.screenHeight = document.documentElement.clientHeight - 20;
+ })();
+ };
+
+ },
+ methods: {
+ parseUrl() {
+
+ }
+ }
+};
+</script>
+
+<style lang="scss" >
+.left-tree-box .el-tabs--border-card .el-tabs__header{
+ display: block!important;
+ margin-bottom: 10px;
+}
+.column {
+ overflow: hidden;
+ min-width: 1399px;
+ height: 100%;
+}
+.column-left {
+ background-color: #fff;
+ position: relative;
+ float: left;
+ height: 100vh;
+}
+.column-right {
+ height: 100vh;
+ background-color: #eee;
+ box-sizing: border-box;
+ overflow: hidden;
+}
+.heigher-index {
+ position: absolute;
+ top: 0;
+ z-index: 10;
+ width: 100%;
+ height: 100%;
+}
+.resize-save {
+ position: absolute;
+ top: 0;
+ right: 5px;
+ bottom: 0;
+ left: 0;
+ padding: 16px;
+ padding-top: 8px;
+ overflow-x: hidden;
+}
+.resize-bar {
+ width: 310px;
+ height: inherit;
+ resize: horizontal;
+ cursor: ew-resize;
+ opacity: 0;
+ overflow: scroll;
+ max-width: 500px; //璁惧畾鏈�澶ф媺浼搁暱搴�
+ min-width: 33px; //璁惧畾鏈�灏忓搴�
+}
+/* 鎷栨嫿绾� */
+.resize-line {
+ position: absolute;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ border-right: 2px solid #efefef;
+ border-left: 1px solid #e0e0e0;
+ pointer-events: none;
+}
+.resize-bar:hover ~ .resize-line,
+.resize-bar:active ~ .resize-line {
+ border-left: 1px dashed skyblue;
+}
+.resize-bar::-webkit-scrollbar {
+ width: 200px;
+ height: inherit;
+}
+
+/* Firefox鍙湁涓嬮潰涓�灏忓潡鍖哄煙鍙互鎷変几 */
+@supports (-moz-user-select: none) {
+ .resize-bar:hover ~ .resize-line,
+ .resize-bar:active ~ .resize-line {
+ border-left: 1px solid #bbb;
+ }
+ .resize-bar:hover ~ .resize-line::after,
+ .resize-bar:active ~ .resize-line::after {
+ content: "";
+ position: absolute;
+ width: 16px;
+ height: 16px;
+ bottom: 0;
+ right: -8px;
+ // background: url(./resize.svg);
+ background-size: 100% 100%;
+ }
+}
+</style>
diff --git a/src/pages/searchForCluster/index/Searching.vue b/src/pages/searchForCluster/index/Searching.vue
new file mode 100644
index 0000000..7cd82d6
--- /dev/null
+++ b/src/pages/searchForCluster/index/Searching.vue
@@ -0,0 +1,954 @@
+<template>
+ <div class="searching-box">
+ <div class="searching-right">
+ <div class="searching-right-nav">
+ <el-breadcrumb separator-class="el-icon-arrow-right" style="display: inline-block;">
+ <el-breadcrumb-item>
+ <span @click="uploadChange()">妫�绱�</span>
+ </el-breadcrumb-item>
+ <el-breadcrumb-item v-if="!VideoPhotoData.uploadType">鍏ㄩ儴</el-breadcrumb-item>
+ <el-breadcrumb-item v-if="VideoPhotoData.uploadType">浠ュ浘鎼滃浘</el-breadcrumb-item>
+ </el-breadcrumb>
+ </div>
+ <div class="searching-right-content">
+ <div class="top">
+ <el-tooltip content="浠ュ浘鎼滃浘" placement="bottom" popper-class="atooltip">
+ <el-button
+ @click="showUpload"
+ type="primary"
+ icon="el-icon-camera-solid"
+ size="mini"
+ circle
+ :style="VideoPhotoData.uploadDiaplay ? 'margin-right: 20px;' : 'margin-right: 20px;background-color:#cccccc;border-color:#cccccc'"
+ ></el-button>
+ </el-tooltip>
+ <p class="p-label" style="width:16%">
+ <b>鏍囩锛�</b>
+ <el-select
+ v-model="tagValues"
+ multiple
+ :disabled="isDisabled"
+ collapse-tags
+ size="mini"
+ style="width:calc(100% - 40px);min-width: 120px;"
+ placeholder="璇烽�夋嫨"
+ @change="tagChange"
+ >
+ <el-option
+ v-for="item in VideoPhotoData.tabs"
+ style="font-size:12px"
+ :key="item.key"
+ :label="item.title"
+ :value="item.value"
+ :title="item.title"
+ ></el-option>
+ </el-select>
+ </p>
+ <p class="p-task" style="width:16%">
+ <b>鍦烘櫙锛�</b>
+ <el-select
+ v-model="taskValues"
+ multiple
+ @change="searchingBtn"
+ :disabled="typeDisable"
+ collapse-tags
+ size="mini"
+ style="width:calc(100% - 40px);min-width: 120px;"
+ placeholder="璇烽�夋嫨"
+ >
+ <!-- <el-option
+ v-for="item in VideoPhotoData.tasks"
+ style="font-size:12px"
+ :key="item.taskid+'x'"
+ :label="item.del_flag && item.taskname !=='浜鸿劯娴嬫俯'? item.taskname+'锛堝凡鍒犻櫎锛�' : item.taskname"
+ :value="item.taskid"
+ :title="item.del_flag && item.taskname !=='浜鸿劯娴嬫俯'? item.taskname+'锛堝凡鍒犻櫎锛�' : item.taskname"
+ ></el-option>-->
+ <el-option
+ v-for="item in VideoPhotoData.tasks"
+ style="font-size:12px"
+ :key="item.id+'x'"
+ :value="item.id"
+ :label="item.isDelete ? item.name+'锛堝凡鍒犻櫎锛�' : item.name"
+ :title="item.isDelete ? item.name+'锛堝凡鍒犻櫎锛�' : item.name"
+ ></el-option>
+ </el-select>
+ </p>
+ <p class="p-level" style="width:18%">
+ <b>浜嬩欢绛夌骇锛�</b>
+ <el-select
+ v-model="alarmValues"
+ multiple
+ @change="searchingBtn"
+ :disabled="isDisabled"
+ collapse-tags
+ size="mini"
+ style="width:calc(100% - 64px);min-width: 120px;"
+ placeholder="璇烽�夋嫨"
+ >
+ <el-option
+ v-for="item in VideoPhotoData.dictionary.ALARMLEVEL"
+ :key="item.id"
+ :label="item.name"
+ :value="item.value"
+ ></el-option>
+ </el-select>
+ </p>
+ <p class="p-date" style="width:19%;vertical-align: top;">
+ <el-date-picker
+ size="mini"
+ v-model="searchTime"
+ @change="searchingBtn"
+ type="datetimerange"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ :default-time="['00:00:00','23:59:59']"
+ style="width:99%;min-width:200px"
+ ></el-date-picker>
+ </p>
+ <p class="p-input" style="width:19%">
+ <el-input
+ placeholder="璇疯緭鍏ュ唴瀹�"
+ prefix-icon="el-icon-search"
+ style="width: calc(100% - 75px);min-width:100px;margin-left:10px;margin-right: 10px;"
+ v-model="VideoPhotoData.inputValue"
+ size="mini"
+ ></el-input>
+ <el-button type="primary" size="mini" @click="searchingBtn">鎼滅储</el-button>
+ </p>
+ <p class="p-clear">
+ <b class="clear-searching" @click="clearSearch">閲嶇疆</b>
+ </p>
+ </div>
+ <div ref="mid" style="height:calc(100% - 50px);">
+ <div class="left-selection" v-if="VideoPhotoData.uploadDiaplay">
+ <upload-img ref="uploadImg" @labelDisabled="disabled"></upload-img>
+ </div>
+ <div
+ id="searchMid"
+ class="mid"
+ :style="{width: VideoPhotoData.uploadDiaplay ? 'calc(100% - 315px)' : '100%'}"
+ >
+ <div class="right-section" ref="scrollContain">
+ <Card
+ v-for="(item, index) in VideoPhotoData.cards"
+ :class="item.activeObject.id === VideoPhotoData.activeCard ? 'my-active-card' : ''"
+ :key="index + 'u'"
+ :outHeight="'162px'"
+ :outWidth="VideoPhotoData.uploadDiaplay?searchImgCardWidth:cardWidth"
+ :data="item"
+ :showType="showType"
+ @detailsClick="getDetails($event, index)"
+ @addToBase="toAdd"
+ ></Card>
+ <div class="foot">
+ <el-pagination
+ :current-page="VideoPhotoData.page"
+ @current-change="changePages"
+ @size-change="sizeChange"
+ :page-sizes="VideoPhotoData.pageSizeOption"
+ :page-size="VideoPhotoData.size"
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="VideoPhotoData.total"
+ ></el-pagination>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!-- <div class="foot">
+ <el-pagination
+ :current-page="VideoPhotoData.page"
+ @current-change="changePages"
+ @size-change="sizeChange"
+ :page-sizes="VideoPhotoData.pageSizeOption"
+ :page-size="VideoPhotoData.size"
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="VideoPhotoData.total"
+ ></el-pagination>
+ </div>-->
+ </div>
+ </div>
+ <hsc-window-style-metal class="windown-model">
+ <hsc-window
+ v-for="(item, index) in CardList.addBaseList"
+ :closeButton="true"
+ @closebuttonclick="closeWindow(index)"
+ :key="index"
+ @update:height="resizeHeight"
+ @update:width="resizeWidth"
+ style="background:white; height:475px"
+ :left="center.x + index * 10"
+ :top="center.y + index * 10"
+ :resizable="true"
+ positionHint="center"
+ :isScrollable="true"
+ :minWidth="662"
+ :minHeight="479"
+ :maxWidth="10000"
+ :maxHeight="7000"
+ :height="defaultHeight"
+ :width="defaultWidth"
+ >
+ <div class="addToBase">
+ <div class="topLabel">鍔犲叆搴曞簱</div>
+ <div class="items">
+ <div class="lable">
+ <p>榛戝悕鍗� ></p>
+ </div>
+ <div class="baseList">
+ <el-checkbox-group v-model="VideoPhotoData.selectBlacks" @change="blackAngWhite">
+ <div class="base" v-for="(item, index) in VideoPhotoData.blackList" :key="index">
+ <el-checkbox
+ :label="item.value"
+ :title="item.title"
+ :disabled="item.disabled"
+ >{{item.title}}</el-checkbox>
+ </div>
+ </el-checkbox-group>
+ </div>
+ </div>
+ <div class="items">
+ <div class="lable">
+ <p>鐧藉悕鍗� ></p>
+ </div>
+ <div class="baseList">
+ <el-checkbox-group v-model="VideoPhotoData.selectWhites" @change="blackAngWhite">
+ <div class="base" v-for="(item, index) in VideoPhotoData.whiteList" :key="index">
+ <el-checkbox
+ :label="item.value"
+ :title="item.title"
+ :disabled="item.disabled"
+ >{{item.title}}</el-checkbox>
+ </div>
+ </el-checkbox-group>
+ </div>
+ </div>
+ <div class="buttons">
+ <el-button type="primary" @click="saveAddBase(item, index)">淇濆瓨</el-button>
+ <el-button type="default" @click="closeWindow(index)">鍙栨秷</el-button>
+ </div>
+ </div>
+ </hsc-window>
+ </hsc-window-style-metal>
+ </div>
+</template>
+
+<script>
+import Card from "@/components/subComponents/Card";
+import UploadImg from "@/components/searching/UploadImg";
+//import CardWindow from "../components/cardWindow";
+import bus from "./main";
+export default {
+ components: {
+ Card,
+ UploadImg
+ },
+ data() {
+ return {
+ cardWidth: "",
+ center: "",
+ defaultHeight: 432,
+ defaultWidth: 600,
+ isDisabled: false,
+ typeDisable: false,
+ showType: "search",
+ searchImgCardWidth: "",
+ tagValues: [],
+ alarmValues: [],
+ dialogVisible: false,
+ taskValues: [],
+ searchTime: [
+ this.$moment().format("YYYY-MM-DD 00:00:00"),
+ this.$moment().format("YYYY-MM-DD HH:mm:ss")
+ ],
+ searchText: "",
+ currentPage: 1,
+
+ };
+ },
+
+ created() {
+ this.TreeDataPool.readonly = true;
+ this.TreeDataPool.gbReadonly = true;
+ this.TreeDataPool.multiple = true;
+ this.TreeDataPool.clean();
+ this.TreeDataPool.fetchTreeData();
+ },
+ mounted() {
+ this.$nextTick(() => {
+ let scrollContain = this.$refs.scrollContain
+ this.VideoPhotoData.scrollContainDom = scrollContain
+ let list = this.TreeDataPool.localVedioList.filter(i => {
+ return i.progress == 100
+ })
+ this.TreeDataPool.localVedioList = list
+ })
+ window.addEventListener("resize", this.getHeight);
+ this.getCenter();
+ this.getHeight();
+ this.blackAngWhite();
+ // 瑙嗛鐩戞帶浠诲姟璺宠浆 灞忚斀 20200730
+ // if (this.$route.query.from === "video") {
+ // this.VideoPhotoData.queryTasks = this.taskValues = [
+ // this.VideoTaskData.tasks[this.VideoTaskData.activeIndex].taskId
+ // ];
+ // }
+
+ this.searchTime = this.getDateInit();
+ this.VideoPhotoData.searchTime = this.getDateInit();
+
+ // 鏆傛椂鍏抽棴璺宠浆 20200730
+ // if (this.$route.query.showType === "findByPic") {
+ if (this.getUrlKey("showType")) {
+ this.VideoPhotoData.uploadDiaplay = true;
+ // console.log("鍒璺宠繃鏉ョ殑浠ュ浘鎼滃浘");
+ this.VideoPhotoData.picUrl = this.getUrlKey("picSmUrl");
+ this.VideoPhotoData.uploadImg = this.getUrlKey("picSmUrl");
+ this.VideoPhotoData.uploadType = true
+ this.VideoPhotoData.compTargetId = this.getUrlKey("targetId")
+ this.VideoPhotoData.compTargetType = this.getUrlKey("compType")
+ this.VideoPhotoData.size = 30
+ this.VideoPhotoData.compareTabs = ["esData"];
+ this.VideoPhotoData.findPerson2(); // 鏌ユ壘姝や汉
+ } else {
+ this.searchTime = this.getDateInit();
+ this.VideoPhotoData.searchTime = this.getDateInit();
+ // this.VideoPhotoData.querySearchList();
+ this.setLoadSearch(this.VideoPhotoData.querySearchList());
+ }
+
+ this.VideoPhotoData.queryTagList();
+ this.VideoPhotoData.queryTaskList();
+ this.VideoPhotoData.queryDictionary();
+ this.$nextTick(() => {
+ bus.$on("changePage", page => {
+ this.currentPage = page;
+ this.VideoPhotoData.page = page;
+ });
+ });
+ },
+ destroyed() {
+ window.removeEventListener("resize", this.getHeight);
+ this.CardList.details = [];
+ // this.TreeDataPool.treeActiveName = "camera";
+ this.VideoPhotoData.queryAlarmlevel = [];
+ this.VideoPhotoData.inputValue = "";
+ this.VideoPhotoData.queryTabs = [];
+ this.VideoPhotoData.queryTasks = [];
+ this.VideoPhotoData.treeNodes = [];
+
+ this.CardList.addBaseList = [];
+ this.VideoPhotoData.selectBlacks = [];
+ this.VideoPhotoData.selectWhites = [];
+ },
+ watch: {
+ "TreeDataPool.showTreeBox"(value) {
+ this.getHeight();
+ if (this.VideoPhotoData.realSmallPath.length > 0) {
+ this.VideoPhotoData.findPersonByPage();
+ } else {
+ // this.VideoPhotoData.querySearchList();
+ this.setLoadSearch(this.VideoPhotoData.querySearchList());
+ }
+ },
+ // "TreeDataPool.selectedNodes": function(newValue,oldValue) {
+ // if (newValue !== oldValue) {
+ // this.VideoPhotoData.treeNodes = newValue;
+ // console.log("鐩戝惉鏍戣妭鐐逛腑鐨勫埛鏂版柟娉�", newValue,oldValue);
+ // this.VideoPhotoData.querySearchList();
+ // }
+ // },
+ "TreeDataPool.selectedNodes": {
+ handler: function (newVal, oldVal) {
+ if (newVal !== oldVal) {
+ this.VideoPhotoData.treeNodes = newVal;
+ if (this.VideoPhotoData.uploadType) {
+ this.VideoPhotoData.findPersonByPage()
+ } else {
+ // this.VideoPhotoData.querySearchList();
+ this.setLoadSearch(this.VideoPhotoData.querySearchList());
+ }
+ }
+ },
+ deep: true //娣卞害鐩戝惉
+ },
+ "DataStackPool.selectedDir": {
+ handler(nodes, oldNodes) {
+ if (nodes !== oldNodes) {
+ // this.VideoPhotoData.treeNodes = nodes.map(i=>{return i.id});
+ this.VideoPhotoData.treeNodes = [nodes.id];
+ if (this.VideoPhotoData.uploadType) {
+ this.VideoPhotoData.findPersonByPage()
+ } else {
+ // this.VideoPhotoData.querySearchList();
+ this.setLoadSearch(this.VideoPhotoData.querySearchList());
+ }
+ }
+ },
+ deep: true
+ },
+ "VideoPhotoData.activeCard": function (value) {
+ let card = this.$refs.scrollContain.getElementsByClassName("my-active-card");
+
+ if (card.length > 0) {
+ let cardHeight = card[0].clientHeight;
+ let cardTop = card[0].offsetTop;
+ let scrollTop = this.$refs.scrollContain.scrollTop;
+ let divHeight = this.$refs.scrollContain.clientHeight;
+ if (
+ cardTop - cardHeight - scrollTop > divHeight ||
+ cardTop - cardHeight - scrollTop < 0
+ )
+ this.$refs.scrollContain.scrollTo(0, cardTop - cardHeight);
+ }
+ },
+ "VideoPhotoData.uploadType": function (value) {
+ console.log("椤甸潰妯″紡锛�", value)
+ if (value) {
+ this.typeDisable = true;
+ this.disabled = true;
+ } else {
+ this.typeDisable = false;
+ this.VideoPhotoData.querySearchList();
+ }
+ },
+ "VideoPhotoData.selectBlacks": function (value) {
+ this.blackAngWhite()
+ },
+ "VideoPhotoData.selectWhites": function (value) {
+ this.blackAngWhite()
+ },
+ "VideoPhotoData.uploadDiaplay": function (value) {
+ this.getHeight();
+ console.log("upload鐨勫�兼槸锛�", value)
+ if (value) {
+ if (!this.VideoPhotoData.uploadType) {
+ console.log("uploadDisplay涓殑鍒锋柊");
+ let scrollContain = this.$refs.scrollContain
+ this.VideoPhotoData.scrollContainDom = scrollContain
+ this.VideoPhotoData.showType = "search";
+ // this.VideoPhotoData.querySearchList();
+ //this.setLoadSearch(this.VideoPhotoData.querySearchList());
+ this.isDisabled = false;
+ } else {
+ //this.VideoPhotoData.scrollContainDom = '';
+ this.VideoPhotoData.showType = "findByPic";
+ }
+ } else {
+ this.VideoPhotoData.uploadType = false;
+ this.VideoPhotoData.showType = "search";
+ }
+ }
+ },
+ methods: {
+ isShowUpload() {
+ console.log('isShowUpload', this.VideoPhotoData.uploadDiaplay)
+ this.getHeight();
+ console.log("upload鐨勫�兼槸锛�", this.VideoPhotoData.uploadDiaplay)
+ if (this.VideoPhotoData.uploadDiaplay) {
+ if (!this.VideoPhotoData.uploadType) {
+ console.log("uploadDisplay涓殑鍒锋柊");
+ let scrollContain = this.$refs.scrollContain
+ this.VideoPhotoData.scrollContainDom = scrollContain
+ this.VideoPhotoData.showType = "search";
+ // this.VideoPhotoData.querySearchList();
+ //this.setLoadSearch(this.VideoPhotoData.querySearchList());
+ this.isDisabled = false;
+ } else {
+ //this.VideoPhotoData.scrollContainDom = '';
+ this.VideoPhotoData.showType = "findByPic";
+ }
+ } else {
+ this.VideoPhotoData.uploadType = false;
+ this.VideoPhotoData.showType = "search";
+ }
+ },
+ resizeWidth(w) {
+ this.defaultWidth = w;
+ },
+ resizeHeight(h) {
+ this.defaultHeight = h;
+ },
+ getHeight() {
+ let w = this.$refs.mid.offsetWidth;
+ let integer = parseInt(w / 330);
+ let integerSearchImg = parseInt((w - 300) / 325);
+
+ // 鍙栨秷size淇敼
+ // console.log(integer, integerSearchImg)
+ // this.handleSizeChange(integer, integerSearchImg);
+
+ this.cardWidth = `calc(${100 / integer}% - 20px)`;
+ this.searchImgCardWidth = `calc(${100 / integerSearchImg}% - 20px)`;
+ },
+ uploadChange() {
+ this.VideoPhotoData.uploadDiaplay = false;
+ },
+ blackAngWhite() {
+ if (this.VideoPhotoData.selectBlacks.length > 0) {
+ for (let i = 0; i < this.VideoPhotoData.whiteList.length; i++) {
+ //this.VideoPhotoData.whiteList[i].disabled = true
+ this.$set(this.VideoPhotoData.whiteList[i], 'disabled', true)
+ }
+ }
+ if (this.VideoPhotoData.selectBlacks.length == 0) {
+ for (let i = 0; i < this.VideoPhotoData.whiteList.length; i++) {
+ //this.VideoPhotoData.whiteList[i].disabled = false
+ this.$set(this.VideoPhotoData.whiteList[i], 'disabled', false)
+ }
+ }
+ if (this.VideoPhotoData.selectWhites.length > 0) {
+ for (let i = 0; i < this.VideoPhotoData.blackList.length; i++) {
+ // this.VideoPhotoData.blackList[i].disabled = true
+ this.$set(this.VideoPhotoData.blackList[i], 'disabled', true)
+ }
+ }
+ if (this.VideoPhotoData.selectWhites.length == 0) {
+ for (let i = 0; i < this.VideoPhotoData.blackList.length; i++) {
+ //this.VideoPhotoData.blackList[i].disabled = false
+ this.$set(this.VideoPhotoData.blackList[i], 'disabled', false)
+ }
+ }
+ },
+ saveAddBase(item, index) {
+ if (this.VideoPhotoData.selectBlacks.length === 0 && this.VideoPhotoData.selectWhites.length === 0) {
+ this.$notify({
+ title: "娉ㄦ剰",
+ message: "璇烽�夋嫨瑕佹坊鍔犵殑搴曞簱",
+ type: "warning"
+ })
+ return
+ }
+ let res = this.VideoPhotoData.addBase(item)
+ res.then(data => {
+ console.log("then", data)
+ if (data.success) {
+ this.$notify({
+ title: "鎴愬姛",
+ message: data.data,
+ type: "success"
+ })
+ } else {
+ this.$notify({
+ title: "澶辫触",
+ message: data.data,
+ type: "error"
+ })
+ }
+ this.CardList.addBaseList.splice(index, 1);
+ this.VideoPhotoData.selectBlacks = []
+ this.VideoPhotoData.selectWhites = []
+ })
+ },
+ getDetails(ev, index) {
+ //let obj = this.CardList.datalist[index];
+ this.CardList.datalist = this.VideoPhotoData.cards;
+ let obj = this.CardList.datalist[index];
+ this.CardList.details = Array.from(
+ new Set([...this.CardList.details, ...[obj]])
+ );
+ // this.CardList.details.push(obj);
+ this.VideoPhotoData.activeCard = obj.activeObject.id;
+ },
+ toAdd(item) {
+ this.CardList.addBaseList.push(item)
+ },
+ handleClose(done) {
+ this.$confirm('纭鍏抽棴锛�')
+ .then(_ => {
+ done();
+ })
+ .catch(_ => { });
+ },
+ showUpload() {
+ this.VideoPhotoData.uploadDiaplay = !this.VideoPhotoData.uploadDiaplay;
+ //鍒濆鍖栨暟鎹�
+ this.VideoPhotoData.clearStatus();
+ this.CardList.details = [];
+ // if (this.VideoPhotoData.uploadDiaplay) {
+
+ // }
+ //this.VideoPhotoData.uploadImg = require("C:/Users/mdesign/Desktop/cvasdv.jpg");
+ },
+ getDateInit() {
+ // 瑕佹眰 榛樿涓�涓湀
+ const end = new Date();
+ const start = new Date();
+ const nowDate = new Date();
+ nowDate.setHours(0);
+ nowDate.setMinutes(0);
+ nowDate.setSeconds(0);
+ nowDate.setMilliseconds(0);
+ start.setTime(nowDate.getTime() - 3600 * 1000 * 24 * 30);
+ end.setTime(nowDate.getTime() + 3600 * 1000 * 24 - 1);
+ return [
+ this.$moment(start).format("YYYY-MM-DD HH:mm:ss"),
+ this.$moment(end).format("YYYY-MM-DD HH:mm:ss")
+ ];
+ },
+ format(array) {
+ return [
+ this.$moment(array[0]).format("YYYY-MM-DD HH:mm:ss"),
+ this.$moment(array[1]).format("YYYY-MM-DD HH:mm:ss")
+ ];
+ },
+ searchingBtn() {
+ // let obj = document.getElementById('searchMid');
+ // console.log(obj,'target',document)
+ // let load = this.$loading({
+ // target:obj,
+ // })
+ // load.close();
+ // console.log(load,'loading')
+ // this.AuthData.loading = true
+ this.VideoPhotoData.page = 1;
+ this.VideoPhotoData.queryTabs = this.tagValues;
+ //澶勭悊鎼滅储绫诲瀷
+ var tempArr = this.taskValues.map(task => task.split(','));
+ var tasks = [];
+ tempArr.forEach(arr => {
+ tasks = tasks.concat(arr)
+ });
+ this.VideoPhotoData.queryTasks = tasks;
+
+ this.VideoPhotoData.queryAlarmlevel = this.stringToNum();
+ this.VideoPhotoData.searchTime = this.format(this.searchTime);
+ //this.VideoPhotoData.inputValue = this.searchText;
+ this.VideoPhotoData.showType = this.showType;
+ if (!this.VideoPhotoData.uploadType) {
+ console.log("鏌ヨ鏂规硶");
+ this.VideoPhotoData.uploadDiaplay = false;
+ //this.VideoPhotoData.page = this.currentPage;
+ // this.VideoPhotoData.querySearchList();
+ this.setLoadSearch(this.VideoPhotoData.querySearchList());
+ } else {
+ console.log("浠ュ浘鎼滃浘");
+ //this.VideoPhotoData.page = this.currentPage;
+ // this.VideoPhotoData.findPersonByPage();
+ this.setLoadSearch(this.VideoPhotoData.findPersonByPage());
+ }
+ },
+ stringToNum() {
+ var arr = [];
+ this.alarmValues.forEach(element => {
+ if (element == "-1") {
+ arr.push(-1);
+ }
+ if (element == "1") {
+ arr.push(1);
+ }
+ if (element == "2") {
+ arr.push(2);
+ }
+ if (element == "3") {
+ arr.push(3);
+ }
+ if (element == "4") {
+ arr.push(4);
+ }
+ if (element == "5") {
+ arr.push(5);
+ }
+ });
+ // console.log("杈撳嚭鐨勬暟缁勶細", arr);
+ return arr;
+ },
+ changePages(page) {
+ this.VideoPhotoData.page = page;
+ if (!this.VideoPhotoData.uploadType) {
+ console.log("鍒嗛〉鏀瑰彉锛�")
+ this.VideoPhotoData.uploadDiaplay = false;
+ // this.VideoPhotoData.querySearchList();
+ this.setLoadSearch(this.VideoPhotoData.querySearchList());
+ } else {
+ // this.VideoPhotoData.findPersonByPage();
+ this.setLoadSearch(this.VideoPhotoData.findPersonByPage());
+ }
+ },
+ closeWindow(index) {
+ this.CardList.addBaseList.splice(index, 1);
+ },
+ handleSizeChange(integer, integerSearchImg) {
+ if (this.VideoPhotoData.uploadDiaplay) {
+ this.VideoPhotoData.size = integerSearchImg * 10;
+ //this.VideoPhotoData.findPersonByPage();
+ } else {
+ this.VideoPhotoData.size = integer * 10;
+ //this.VideoPhotoData.querySearchList();
+ }
+ },
+ sizeChange(size) {
+ if (this.VideoPhotoData.uploadType) {
+ this.VideoPhotoData.size = size;
+ this.VideoPhotoData.findPersonByPage();
+ } else {
+ this.VideoPhotoData.uploadDiaplay = false;
+ this.VideoPhotoData.size = size;
+ // this.VideoPhotoData.querySearchList();
+ this.setLoadSearch(this.VideoPhotoData.querySearchList());
+ }
+ },
+ clearSearch() {
+ this.tagValues = []
+ this.taskValues = []
+ this.alarmValues = []
+ this.VideoPhotoData.queryTabs = [];
+ this.VideoPhotoData.queryTasks = [];
+ this.VideoPhotoData.queryAlarmlevel = [];
+ this.VideoPhotoData.searchTime = this.getDateInit();
+ this.VideoPhotoData.inputValue = "";
+ this.searchTime = this.getDateInit();
+ if (!this.VideoPhotoData.uploadType) {
+ // this.VideoPhotoData.querySearchList();
+ this.setLoadSearch(this.VideoPhotoData.querySearchList());
+ } else {
+ // this.VideoPhotoData.findPersonByPage();
+ this.setLoadSearch(this.VideoPhotoData.findPersonByPage());
+ }
+ },
+ disabled(data) {
+ this.isDisabled = data;
+ },
+ getCenter() {
+ this.center = {
+ x: document.documentElement.clientWidth / 2 - 250,
+ y: document.documentElement.clientHeight / 2 - 200
+ };
+ },
+ setLoadSearch(fn) {
+ this.AuthData.setLoading("searchMid", this);
+ fn.then(_ => {
+ this.AuthData.closeLoad();
+ })
+ },
+ getUrlKey(name) {
+ return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null
+ },
+ tagChange(obj) {
+ console.log(obj)
+ if (obj.length > 0) {
+ this.showType = "compare";
+ } else {
+ this.showType = "search";
+ }
+
+ this.VideoPhotoData.queryTabs = obj;
+
+ this.setLoadSearch(this.VideoPhotoData.querySearchList());
+ }
+ }
+};
+</script>
+
+<style lang="scss">
+.searching-box {
+ width: 100%;
+ height: 100% !important;
+ float: left;
+ //position: relative;
+ .searching-right {
+ width: 100%;
+ background-color: #e9ebf2;
+ height: 100%;
+ padding: 0px 20px;
+ box-sizing: border-box;
+
+ //涓存椂
+ .el-carousel__item.is-active {
+ z-index: 0 !important;
+ }
+ //涓存椂
+
+ .searching-right-nav {
+ height: 50px;
+ width: 100%;
+ line-height: 58px;
+ text-align: left;
+ font-size: 14px !important;
+ box-sizing: border-box;
+ color: rgba(0, 0, 0, 0.78) !important;
+ }
+ .searching-right-content {
+ height: calc(100% - 80px);
+ width: 100%;
+ box-sizing: border-box;
+ .top {
+ background-image: linear-gradient(-180deg, #ffffff 13%, #e9ebf2 100%);
+ height: 76px;
+ width: 100%;
+ padding: 5px 22px;
+ box-sizing: border-box;
+ text-align: left;
+ // line-height: 55px;
+ white-space: nowrap;
+ overflow-x: auto;
+ overflow-y: hidden;
+ .p-label,
+ .p-task,
+ .p-level,
+ .p-date,
+ .p-input,
+ .p-clear {
+ display: inline-block;
+ padding-right: 10px;
+ box-sizing: border-box;
+ margin-top: 20px;
+ b:hover {
+ color: #2249b4;
+ }
+ }
+ .clear-searching {
+ cursor: pointer;
+ text-decoration: underline;
+ width: 40px;
+ font-size: 13px;
+ color: #3d68e1;
+ }
+ }
+ .mid {
+ //width: 100%;
+ //height: 100%;
+ padding: 5px;
+ overflow: auto;
+ position: relative;
+ .my-card {
+ float: left;
+ margin: 0px 14px 10px 0px;
+ cursor: pointer;
+ }
+ }
+ .foot {
+ overflow: hidden;
+ width: 100%;
+ height: 80px;
+ //line-height: 80px;
+ padding-top: 20px;
+ padding-right: 24px;
+ box-sizing: border-box;
+ text-align: right;
+ }
+ }
+ }
+ .el-select__tags {
+ max-width: 250px !important;
+ }
+}
+.el-select-dropdown {
+ width: 200px !important;
+}
+.el-tag {
+ max-width: 85% !important;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+}
+.titlebar {
+ height: 10px !important;
+ background: #fff !important;
+ .button {
+ position: absolute;
+ font-size: 25px !important;
+ right: 10px;
+ top: 10px;
+ z-index: 3;
+ }
+}
+.addToBase {
+ width: 98%;
+ height: 430px;
+ position: relative;
+ .topLabel {
+ margin-top: 20px;
+ height: 40px;
+ border-bottom: 1px solid #eee;
+ font-family: PingFangSC-Medium;
+ font-size: 20px;
+ font-weight: 600;
+ line-height: 1rem;
+ color: #222222;
+ text-align: left;
+ margin-left: 15px;
+ }
+ .items {
+ width: 100%;
+ height: auto;
+ max-height: 35%;
+ overflow-y: auto;
+ margin: 20px 0px;
+ .lable {
+ width: 15%;
+ margin-top: 10px;
+ float: left;
+ //font-family: PingFangSC-Medium;
+ font-size: 14px;
+ font-weight: 600;
+ }
+ .baseList {
+ width: 85%;
+ height: 100%;
+ float: left;
+
+ // display: flex;
+ // justify-content: flex-start;
+ .base {
+ //flex-wrap: wrap;
+ width: calc(33% - 10px);
+ padding: 0px 5px;
+ line-height: 30px;
+ float: left;
+ text-align: left;
+ font-size: 12px !important;
+ .el-checkbox {
+ width: 100%;
+ display: block;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ .el-checkbox__label {
+ display: inline !important;
+ }
+ }
+ }
+ }
+ }
+ .buttons {
+ position: absolute;
+ right: 0px;
+ bottom: 15px;
+ }
+}
+.search {
+ background-color: #eee;
+}
+</style>
+<style lang="scss" scoped>
+.left-selection {
+ width: 300px;
+ height: 100%;
+ float: left;
+ margin-right: 15px;
+}
+#searchMid {
+ height: 100%;
+ box-sizing: border-box;
+ .el-loading-mask {
+ .el-loading-spinner {
+ width: 100%;
+ height: 100%;
+ .el-loading-spinner-search {
+ background: url("/images/search/searchLoading.gif") no-repeat;
+ }
+ }
+ }
+
+ .right-section {
+ //width: calc(100% - 315px);
+ height: 100%;
+ padding-bottom: 20px;
+ box-sizing: border-box;
+ //float: left;
+ overflow: auto;
+ position: relative;
+ }
+}
+</style>
diff --git a/src/pages/searchForCluster/index/main.ts b/src/pages/searchForCluster/index/main.ts
new file mode 100644
index 0000000..da0d750
--- /dev/null
+++ b/src/pages/searchForCluster/index/main.ts
@@ -0,0 +1,33 @@
+import Vue from 'vue';
+import App from './App.vue';
+
+import ElementUI from 'element-ui';
+import 'element-ui/lib/theme-chalk/index.css';
+import "@/assets/css/element-variables.scss";
+
+import preview from 'vue-photo-preview'
+import moment from "moment";
+import * as VueWindow from "@hscmap/vue-window";
+import Mixin from "./mixins";
+
+import 'vue-photo-preview/dist/skin.css'
+
+Vue.prototype.$moment = moment;
+
+Vue.mixin(Mixin);
+
+Vue.use(ElementUI)
+
+Vue.use(preview)
+
+Vue.use(VueWindow);
+
+Vue.filter('moment', function (value, formatString) {
+ formatString = formatString || 'YYYY-MM-DD HH:mm:ss';
+ return moment(value).format(formatString);
+});
+
+export default Vue.prototype.bus = new Vue({
+ el: '#app',
+ render: h => h(App)
+})
diff --git a/src/pages/searchForCluster/index/mixins.ts b/src/pages/searchForCluster/index/mixins.ts
new file mode 100644
index 0000000..163c814
--- /dev/null
+++ b/src/pages/searchForCluster/index/mixins.ts
@@ -0,0 +1,28 @@
+import VideoPhotoData from "@/Pool/VideoPhotoData";
+import VideoTaskData from "@/Pool/VideoTaskData";
+import TreeDataPool from "@/Pool/TreeData";
+import CardList from "@/Pool/CardList";
+import DataStackPool from "@/Pool/dataStack"
+import AuthData from '@/Pool/AuthData';
+
+/* eslint-disable */
+const onlyVideoPhotoData = new VideoPhotoData
+const onlyVideoTaskData = new VideoTaskData
+const onlyTreeDataPool = new TreeDataPool
+const onlyDataStack = new DataStackPool
+const onlyCardList = new CardList
+const onlyAuthData = new AuthData
+
+const mixin = {
+ data() {
+ return {
+ TreeDataPool: onlyTreeDataPool,
+ VideoPhotoData: onlyVideoPhotoData,
+ CardList: onlyCardList,
+ DataStackPool: onlyDataStack,
+ VideoTaskData: onlyVideoTaskData,
+ AuthData: onlyAuthData,
+ };
+ },
+};
+export default mixin;
\ No newline at end of file
diff --git a/src/pages/settings/components/CloudNode.vue b/src/pages/settings/components/CloudNode.vue
index c285ab4..64a3082 100644
--- a/src/pages/settings/components/CloudNode.vue
+++ b/src/pages/settings/components/CloudNode.vue
@@ -135,6 +135,7 @@
}
},
mounted () {
+ console.log(this.nodes)
//this.getInsideNodes();
},
methods: {
@@ -196,8 +197,8 @@
// return temp;
// },
outsideNodes () {
- //return this.nodes.filter(item=>item.hardwareType=='03');
- return this.mockData.filter(item => item.hardwareType == '03');
+ return this.mockData.filter(item=>item.hardwareType=='03');
+ //return this.nodes.filter(item => item.hardwareType == '03');
}
}
}
@@ -230,6 +231,7 @@
.outer {
width: 40%;
position: relative;
+ text-align: left;
.node {
position: absolute;
}
--
Gitblit v1.8.0