联调服务器管理详情PPPoE功能 、优化图形监控加载缓慢问题 、交换机管理修改光模块图表参数
This commit is contained in:
@@ -36,7 +36,7 @@
|
||||
import * as XLSX from 'xlsx';
|
||||
import Form from '@/components/form/index.vue';
|
||||
import TableList from '@/components/table/index.vue';
|
||||
import {networkList} from '@/api/disRevenue/resource';
|
||||
import {networkList, addPoeConfigMain} from '@/api/disRevenue/resource';
|
||||
export default {
|
||||
name: "PPPoEConfig",
|
||||
components: {Form, TableList},
|
||||
@@ -50,10 +50,17 @@
|
||||
watch: {
|
||||
modelVal: {
|
||||
handler(val, oldVal) {
|
||||
console.log(val,oldVal)
|
||||
if (val && val.length > 0) {
|
||||
this.ruleForm = val[0];
|
||||
this.roleList = val[0].subList;
|
||||
val[0].pppoeEnabled = val[0] && (val[0].pppoeEnabled || val[0].pppoeEnabled === 0) ? val[0].pppoeEnabled.toString() : val[0].pppoeEnabled;
|
||||
let newModel = JSON.parse(JSON.stringify(val));
|
||||
this.ruleForm = newModel[0];
|
||||
newModel[0].subList.map((item,index) => {
|
||||
item['targetIndexNum'] = index + 1;
|
||||
if (index !== 0) {
|
||||
item['showNum'] = '1';
|
||||
}
|
||||
});
|
||||
this.roleList = newModel[0].subList;
|
||||
this.poeInterfaceList();
|
||||
}
|
||||
},
|
||||
@@ -78,6 +85,7 @@
|
||||
]
|
||||
}
|
||||
},
|
||||
ipList: [],
|
||||
}
|
||||
},
|
||||
created() {
|
||||
@@ -93,52 +101,94 @@
|
||||
clientId: {label: 'clientId', hidden: true},
|
||||
pppoeEnabled: {label: '启用PPPoE', span: readonly ? 12 : 24, type: 'radio', options: this.dict.type.pppoe_enabled, required: true},
|
||||
pppoeConfigMode: {label: 'PPPoE配置方式', span: readonly ? 10 : 24, type: 'select', options: this.dict.type.pppoe_config_mode, warningTitle: '使用multi_wan_conntrack.sh', required: true},
|
||||
pppoeInterface: {label: 'PPPoE网卡', span: readonly ? 12 : 24, type: 'select', options: [], required: true},
|
||||
pppoeInterface: {label: 'PPPoE网卡', span: readonly ? 12 : 24, type: 'select', options: this.ipList || [], required: true},
|
||||
subList: {label: 'PPPoE配置规则', span: 24, slotName: 'tempPoeConfigRules'},
|
||||
}
|
||||
}];
|
||||
this.columns = {
|
||||
id: { label: `ID`,width: '50'},
|
||||
serialNumber: { label: `序号`, width: '50',visible: true},
|
||||
serialNumber: { label: `序号`, minWidth: '50',visible: true, type: 'number', placeholder: '请输入', slotName: readonly ? null : 'tempEditModel'},
|
||||
vlanId: { label: `VLANID`, minWidth: '100',visible: true, type: 'number', placeholder: '请输入数字', slotName: readonly ? null : 'tempEditModel'},
|
||||
ipv4Address: { label: `IPv4地址`, minWidth: '100',visible: true, placeholder: '如1.1.1.1', slotName: readonly ? null : 'tempEditModel'},
|
||||
ipv4MaskBits: { label: `IPv4掩码位数`, minWidth: '100',visible: true, type: 'number', min: 1, max: 32, placeholder: '请输入1-32', slotName: readonly ? null : 'tempEditModel'},
|
||||
ipv4Gateway:{ label: `IPv4网关`,minWidth: '100',visible: true, placeholder: '如1.1.1.1', slotName: readonly ? null : 'tempEditModel'},
|
||||
bandwidthResult: { label: `虚拟网卡上报带宽(Mbps)`, minWidth: '130', visible: true, placeholder: '请输入', slotName: readonly ? null : 'tempEditModel'},
|
||||
bandwidthResult: { label: `虚拟网卡上报带宽(Mbps)`, minWidth: '140', visible: true, placeholder: '请输入', slotName: readonly ? null : 'tempEditModel'},
|
||||
macAddress: { label: `MAC地址`, minWidth: '120', visible: readonly},
|
||||
status: { label: `连通状态`, minWidth: '100', visible: readonly},
|
||||
};
|
||||
},
|
||||
poeInterfaceList() {
|
||||
networkList({clientId: this.ruleForm.clientId, newFlag: 1}).then(res => {
|
||||
let ipList = [];
|
||||
this.ipList = [];
|
||||
res && res.data.map(item => {
|
||||
this.ipContentList[item.id] = item;
|
||||
ipList.push({label: item.interfaceName, value: item.id});
|
||||
this.ipList.push({label: item.interfaceName, value: item.interfaceName});
|
||||
});
|
||||
this.formList[0].controls.pppoeInterface['options'] = ipList;
|
||||
this.formList[0].controls.pppoeInterface['options'] = this.ipList;
|
||||
});
|
||||
},
|
||||
// 切换编辑和保存
|
||||
formSubmit() {
|
||||
this.ruleForm = {name: '12'};
|
||||
if (!this.readonly) {
|
||||
console.log('submit=====',this.roleList,this.ruleForm);
|
||||
this.ruleForm = Object.assign({}, this.ruleForm, this.$refs.formRef.$refs.ruleForm.model);
|
||||
this.submitPoeModel();
|
||||
} else {
|
||||
this.roleList = this.roleList.length > 0 ? this.roleList : [{serialNumber: '1', vlanId: undefined, ipv4Address: undefined, ipv4MaskBits: undefined, ipv4Gateway: undefined, bandwidthResult: undefined}];
|
||||
this.ruleForm = Object.assign({}, this.ruleForm, {typeName: 111});
|
||||
this.roleList = this.roleList.length > 0 ? this.roleList : [{targetIndexNum: 1, serialNumber: 1, vlanId: undefined, ipv4Address: undefined, ipv4MaskBits: undefined, ipv4Gateway: undefined, bandwidthResult: undefined}];
|
||||
this.readonly = !this.readonly;
|
||||
this.fnFormList(this.readonly);
|
||||
}
|
||||
this.readonly = !this.readonly;
|
||||
this.fnFormList(this.readonly);
|
||||
},
|
||||
// 新增判断
|
||||
submitPoeModel() {
|
||||
let params = {
|
||||
clientId: this.ruleForm.clientId,
|
||||
pppoeEnabled: this.ruleForm.pppoeEnabled,
|
||||
pppoeConfigMode: this.ruleForm.pppoeConfigMode,
|
||||
pppoeInterface: this.ruleForm.pppoeInterface,
|
||||
subList: this.roleList
|
||||
};
|
||||
let indexNum = 0;
|
||||
if (this.modelVal && this.modelVal[0] && this.modelVal[0].subList && this.modelVal[0].subList.length === this.roleList.length) {
|
||||
let arr = ['vlanId', 'serialNumber', 'ipv4Address', 'ipv4MaskBits', 'ipv4Gateway', 'bandwidthResult'];
|
||||
Object.keys(params).some(keyName => {
|
||||
if (keyName ==='subList') {
|
||||
params['subList'].some((item,index) => {
|
||||
arr.some(keyTowName => {
|
||||
if (item[keyTowName] !== this.modelVal[0].subList[index][keyTowName]) {
|
||||
indexNum = 1;
|
||||
return true;
|
||||
}
|
||||
});
|
||||
return true;
|
||||
});
|
||||
} else if (params[keyName] !== this.modelVal[0][keyName]) {
|
||||
indexNum = 1;
|
||||
}
|
||||
});
|
||||
} else {
|
||||
indexNum = 1;
|
||||
}
|
||||
if (indexNum === 0) {
|
||||
this.readonly = true;
|
||||
this.fnFormList(this.readonly);
|
||||
return;
|
||||
}
|
||||
addPoeConfigMain(params).then(res => {
|
||||
this.ruleForm = Object.assign(this.ruleForm, this.$refs.formRef.$refs.ruleForm.model, {typeName: 222});
|
||||
this.readonly = true;
|
||||
this.fnFormList(this.readonly);
|
||||
});
|
||||
},
|
||||
// 监听事件
|
||||
callback(result, dataVal, formVal) {
|
||||
if (result && result.fnCode) {
|
||||
switch (result.fnCode) {
|
||||
case 'add':
|
||||
this.roleList.push({showNum: '1', serialNumber: this.roleList.length + 1, vlanId: undefined, ipv4Address: undefined, ipv4MaskBits: undefined, ipv4Gateway: undefined, bandwidthResult: undefined});
|
||||
this.roleList.push({targetIndexNum: this.roleList.length + 1,showNum: '1', serialNumber: 1, vlanId: undefined, ipv4Address: undefined, ipv4MaskBits: undefined, ipv4Gateway: undefined, bandwidthResult: undefined});
|
||||
break;
|
||||
case 'delete':
|
||||
console.log('dataVal===',dataVal);
|
||||
this.roleList.splice(dataVal.serialNumber - 1, 1);
|
||||
this.roleList.splice(this.roleList.findIndex(item => item.targetIndexNum === dataVal.targetIndexNum), 1);
|
||||
break;
|
||||
case 'submit':
|
||||
console.log('contentList===',this.contentList, 'dataVal===',dataVal);
|
||||
// this.$emit("dialogResult", {open: false});
|
||||
@@ -161,7 +211,6 @@
|
||||
document.body.removeChild(link);
|
||||
},
|
||||
handleFileUpload(file) {
|
||||
console.log('file====',file);
|
||||
// 如果是使用 Element UI 的 el-upload 组件,文件对象是 file.raw
|
||||
const actualFile = file.raw || file; // 兼容两种获取方式[1,3](@ref)
|
||||
|
||||
@@ -189,19 +238,18 @@
|
||||
|
||||
// 6. 将解析后的数据存储在组件的 data 中
|
||||
// this.excelData = jsonData;
|
||||
console.log('解析到的Excel数据:', jsonData);
|
||||
// console.log('解析到的Excel数据:', jsonData);
|
||||
|
||||
// 可以在这里调用后续处理方法,如数据校验、发送到后端等
|
||||
this.processExcelData(jsonData);
|
||||
|
||||
} catch (error) {
|
||||
console.error('解析Excel文件时出错:', error);
|
||||
// console.error('解析Excel文件时出错:', error);
|
||||
this.$message.error('文件解析失败,请检查文件格式是否正确。');
|
||||
}
|
||||
};
|
||||
|
||||
fileReader.onerror = (error) => {
|
||||
console.error('读取文件失败:', error);
|
||||
this.$message.error('读取文件失败,请重试。');
|
||||
};
|
||||
|
||||
@@ -216,17 +264,14 @@
|
||||
let arrList = [];
|
||||
data.map((item,index) => {
|
||||
if (item && item.length > 0) {
|
||||
let arr = ['vlanId', 'ipv4Address', 'ipv4MaskBits', 'ipv4Gateway', 'bandwidthResult'];
|
||||
let obj = {serialNumber: oldDataList.length + index + 1, showNum: '1'};
|
||||
let arr = ['vlanId', 'serialNumber', 'ipv4Address', 'ipv4MaskBits', 'ipv4Gateway', 'bandwidthResult'];
|
||||
let obj = {targetIndexNum: oldDataList.length + index + 1, showNum: '1'};
|
||||
arr.forEach((val, valIndex) => {
|
||||
obj[val] = item[valIndex];
|
||||
// console.log('val===',val, valIndex);
|
||||
// arrList.push(obj);
|
||||
});
|
||||
// console.log('item===',item, 'obj===', obj);
|
||||
arrList.push(obj);
|
||||
}
|
||||
});
|
||||
// console.log('arrList===',arrList);
|
||||
this.roleList = oldDataList.concat(arrList);
|
||||
} else {
|
||||
this.$message.warning('导入的文件中没有数据。');
|
||||
@@ -237,7 +282,7 @@
|
||||
this.roleList.forEach(item => {
|
||||
let indexNum = 0;
|
||||
Object.keys(item).some(val => {
|
||||
if (val !== 'serialNumber' && val !== 'showNum' && item[val]) {
|
||||
if (val !== 'serialNumber' && val !== 'targetIndexNum' && val !== 'showNum' && item[val]) {
|
||||
indexNum = 1;
|
||||
return;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user