Authored by wangtao

fix: 端口侦测v2

<div>
<el-dialog v-model="dialogVisible" title="新增" width="50%" :before-close="beforeClose">
<div>
<div style="margin-right:6px;">
<!--<cm-res-type-tree-input @callback="getResType" clearable collapseTags multiple/>-->
</div>
<div class="flex-div-start" style="float: left;">
<el-button :size="$global.elementConfig.size.button" @click="onBtnSearch()" style="margin-left: 6px" type="primary">搜索</el-button>
</div>
</div>
<template #footer>
<span class="dialog-footer">
<el-button @click="beforeClose">取消</el-button>
<el-button type="primary" @click="submit">确定</el-button>
</span>
</template>
</el-dialog>
</div>
\ No newline at end of file
export default {
name: 'portSenseAdd',
template: '',
components: {
},
props:{
dialogVisible:{
type:Boolean,
}
},
setup(props, {attrs, slots, emit}){
const {proxy} = Vue.getCurrentInstance();
let types = Vue.ref([]);
//获取资源类型
let getResType = (arr) => {
types.value = arr.map(function (v) {
return v.id;
});
}
const onBtnSearch = ()=>{
}
const submit = ()=>{
if (types.value.length === 0) {
proxy.$global.layer.msg('请选择一项', {icon: 7, timeout: 3000});
return false;
}
beforeClose();
}
const beforeClose = () => {
emit('beforeClose')
}
return {
getResType,
onBtnSearch,
submit,
beforeClose
}
}
}
\ No newline at end of file
... ... @@ -185,7 +185,8 @@ export default {
proxy.$http.post("/api-web/bResourceExtendParam/conserve", portSenseConfigData.value, function (res) {
if (res && res.success) {
proxy.$global.showMsg("保存成功!");
loadTableDataList({page: 1, limit: pageSize.value});
// loadTableDataList({page: 1, limit: pageSize.value});
emit('saveSuccess')
}
})
}
... ...
... ... @@ -80,19 +80,26 @@
<cm-dialog :showDialogVisible="showPortSense" :showFooter="false" :showOkBtn="false" :title="title"
@hidedialog="showPortSenseDialog" cancelText="关闭" width="80%">
<template v-slot>
{{portSenseConfigData}}
<el-steps :active="stepActive" align-center finish-status="success">
<el-step title="选择资源" description="可以多选" />
<el-step title="配置端口" description="" />
</el-steps>
<div>
<el-button style="margin-top: 12px" @click="next">Next step</el-button>
<div v-if="stepActive == 1" style="display: flex;justify-content: space-around;padding: 0px 25%;">
<el-tree-select
v-model="portSenseConfigData"
:data="resTreeArr"
filterable
multiple
collapse-tags
:render-after-expand="false"
:size="$global.elementConfig.size.input"
show-checkbox
:props="typeProps"/>
<el-button style="margin-top: 12px" @click="next">下一步</el-button>
</div>
<port-sense-config v-if="stepActive == 1" :parameter="portSenseConfigData"></port-sense-config>
<port-sense-config v-if="stepActive == 2" :parameter="portSenseConfigData" @saveSuccess="closeDialog"></port-sense-config>
</template>
</cm-dialog>
<port-sense-add :dialogVisible="dialogVisible" @beforeClose="beforeClose"></port-sense-add>
</div>
... ...
... ... @@ -100,12 +100,7 @@ export default {
}
})
}
// 挂载完
Vue.onMounted(() => {
init();
getListData({page: 1, limit: pageSize.value});
onReset();//清空搜索条件(资源id)
})
//获取列表数据
const getListData = ({page, limit}) => {
//定义列表参数
... ... @@ -193,37 +188,10 @@ export default {
}
//添加
let save = () => {
//获取所有的端口侦测信息
let dataList = [];
let getParams = {
keyWords: '',
resTypes: '',
resIds: '',
busIds: '',
page: '',
limit: ''
};
proxy.$http.get("/api-web/bResourceExtendParam/page", getParams, function (res) {
if (res && res.success) {
dataList = res.data;
}
})
dataList = dataList.map(item => item.resId);
proxy.$global.openWin("template/res/reslist", "选择资源", {oldData: dataList}, ["选择"], function (index) {
//获取选中数据
let data = proxy.$global.layui.table.checkStatus('reslist_resListTable').data;
if (data.length === 0) {
//vue层级关系
// proxy.$global.showMsg("请至少选择一条数据!", "warning");
proxy.$global.layer.msg('请选择一项', {icon: 7, timeout: 3000});
return false;
}
//打开端口侦测配置页面
portSenseConfigData.value = data.map(item => item.resId);
stepActive.value = 1;
showPortSense.value = true;
proxy.$global.layer.close(index);
}, null, ['80%', '83%']);
portSenseConfigData.value = [];
loadResTree();
}
//删除
let deleteOther = () => {
... ... @@ -247,8 +215,57 @@ export default {
//打开端口侦测配置页面
portSenseConfigData.value = [row.resId];
showPortSense.value = true;
stepActive.value = 2;
}
let stepActive = Vue.ref(0);
let resIds = Vue.ref([]);
let resTreeArr = Vue.ref([]);
const typeProps = Vue.reactive({
children: 'children',
label: 'label',
value: 'value'
})
const next = () => {
if( portSenseConfigData.value.length == 0){
proxy.$global.showMsg("请至少选择一个资源!");
return;
}
if (stepActive.value++ > 2) stepActive.value = 1
}
const closeDialog = () => {
showPortSense.value = false;
getListData({page: 1, limit: pageSize.value});
}
const loadResTree = () => {
proxy.$http.get('/mj/user/selectResTreeAndSelectRes', {userId: proxy.$global.common.getUserId()}, function (res) {
if (res && res.success && res.data) {
resTreeArr.value = res.data.options;
}
})
}
// 挂载完
Vue.onMounted(() => {
init();
getListData({page: 1, limit: pageSize.value});
onReset();//清空搜索条件(资源id)
})
return {
stepActive,
resIds,
resTreeArr,
typeProps,
next,
closeDialog,
count,
portSenseData,
columns,
... ...