Authored by 王涛

资产视图

<div>
<span class="el-dropdown-link" @click="showMachineRoomDialog(true)" >
{{textString}}
</span>
<cm-dialog title="收藏" width="500px" :showDialogVisible="dialogFlg" @hidedialog="showMachineRoomDialog">
<template v-slot>
<GetMachineRoom v-if="commandNameData" :commandNameData="commandNameData"></GetMachineRoom>
</template>
</cm-dialog>
</div>
... ...
export default {
name: 'machineRoomComponents',
template: '',
components: {
'GetMachineRoom': Vue.defineAsyncComponent(
() => myImport('views/commonComponents/getMachineRoom/index')
),
},
props: {
// 资源名称
textString: {
type: String,
default: 0
},
resId: {
type: String,
default: ''
},
resTypeId: {
type: String,
default: ''
},
resType: {
type: String,
default: ''
},
optionData: {
type: Array,
default: []
}
},
data() {
return {}
},
setup(props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
let dialogFlg = Vue.ref(false);
let commandNameData = Vue.ref([
{
name: '萧山IDC二号机房',
htmlName: 'xiaoshansecond',//html页面的名称
val: 'one'
},
{
name: '萧山IDC三号机房',
htmlName: 'xiaoshanthird',
val: 'two'
},
{
name: '萧山IDC七号机房',
htmlName: 'xiaoshanseven',
val: 'three'
}
]);
let showMachineRoomDialog = (flg) => {
dialogFlg.value = flg;
debugger
console.log(props.optionData);
}
return {
dialogFlg,
commandNameData,
showMachineRoomDialog,
}
}
}
... ...
<div>
<span class="el-dropdown-link" @click="showMachineRoomDialog(true)" >
{{textString}}
</span>
<cm-dialog title="收藏" width="500px" :showDialogVisible="dialogFlg" @hidedialog="showMachineRoomDialog">
<template v-slot>
<GetMachineRoom v-if="commandNameData" :commandNameData="commandNameData"></GetMachineRoom>
</template>
</cm-dialog>
</div>
... ...
export default {
name: 'machineRoomDetailComponents',
template: '',
components: {
'GetMachineRoom': Vue.defineAsyncComponent(
() => myImport('views/commonComponents/getMachineRoom/index')
),
},
props: {
// 资源名称
textString: {
type: String,
default: 0
},
resId: {
type: String,
default: ''
},
resTypeId: {
type: String,
default: ''
},
resType: {
type: String,
default: ''
},
optionData: {
type: Array,
default: []
}
},
data() {
return {}
},
setup(props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
let dialogFlg = Vue.ref(false);
let commandNameData = Vue.ref([
{
name: '萧山IDC二号机房',
htmlName: 'xiaoshansecond',//html页面的名称
val: 'one'
},
{
name: '萧山IDC三号机房',
htmlName: 'xiaoshanthird',
val: 'two'
},
{
name: '萧山IDC七号机房',
htmlName: 'xiaoshanseven',
val: 'three'
}
]);
let showMachineRoomDialog = (flg) => {
dialogFlg.value = flg;
}
return {
dialogFlg,
commandNameData,
showMachineRoomDialog,
}
}
}
... ...
... ... @@ -23,6 +23,10 @@ export default {
type: String,
default: 0
},
optionData: {
type: Array,
default: []
}
},
data() {
return {
... ...
... ... @@ -33,6 +33,10 @@ export default {
type: String,
default: ''
},
optionData: {
type: Array,
default: []
}
},
data() {
... ... @@ -110,25 +114,14 @@ export default {
return;
}
// 查询topoId
// proxy.$http.get(`/api-web/mxgraph/generateByResId`, {resId: props.resId}, function (res) {
// if (res && res.success) {
// let topoId = res.str;
// proxy.$global.openGraphEditor(topoId)
// } else {
// proxy.$global.showMsg('生成资源拓扑失败!', "error");
// }
// });
proxy.$global.viewResTopo(props.resId)
}
let openDetail = () => {
debugger
if (props.resId == '') {
proxy.$global.showMsg("资源编号不存在,请确认!","warning")
return;
}
proxy.$global.openDetail(props.resId,props.resType,props.title);
}
... ...
... ... @@ -18,6 +18,10 @@ export default {
type: String,
default: ''
},
optionData: {
type: Array,
default: []
}
},
data() {
... ...
... ... @@ -77,6 +77,8 @@
<el-option label="资源名称" :value="'resNameComponents'"></el-option>
<el-option label="状态组件" :value="'statusComponents'"></el-option>
<el-option label="使用率组件" :value="'rateComponents'"></el-option>
<el-option label="机房组件" :value="'machineRoomComponents'"></el-option>
<el-option label="机柜组件" :value="'machineRoomDetailComponents'"></el-option>
</el-select>
</div>
... ...
... ... @@ -203,6 +203,12 @@ export default {
'statusComponents': Vue.defineAsyncComponent(
() => myImport('components/page/res/statusComponents/index')
),
'machineRoomComponents': Vue.defineAsyncComponent(
() => myImport('components/page/res/machineRoomComponents/index')
),
'machineRoomDetailComponents': Vue.defineAsyncComponent(
() => myImport('components/page/res/machineRoomDetailComponents/index')
),
},
data() {
return {
... ...
... ... @@ -35,7 +35,8 @@
<component v-if="row[prop] && row[prop].props && row[prop].props.colComponents != null && row[prop].props.colComponents != ''" v-bind:is="row[prop].props.colComponents"
:resId="row.resId"
:resTypeId="currentNode.id"
:textString="row[prop] == undefined ? '' : row[prop].value"></component>
:textString="row[prop] == undefined ? '' : row[prop].value"
:optionData="row"></component>
<el-link v-else :underline="false" @click="item.click(scope.row)">{{row[prop] == undefined ? '' : row[prop].value }}</el-link>
</template>
</cm-table-page>
... ...