update drawer and edit

This commit is contained in:
lb 2023-11-24 10:41:11 +08:00
parent d79ba71bd7
commit 54b63a7f53
7 changed files with 290 additions and 133 deletions

View File

@ -166,13 +166,17 @@ export default {
input: true, input: true,
label: '参数列名', label: '参数列名',
prop: 'plcParamName', prop: 'plcParamName',
rules: [{ required: true, message: '参数列名不能为空', trigger: 'blur' }], rules: [
{ required: true, message: '参数列名不能为空', trigger: 'blur' },
],
}, },
{ {
input: true, input: true,
label: '参数名称', label: '参数名称',
prop: 'name', prop: 'name',
rules: [{ required: true, message: '参数名称不能为空', trigger: 'blur' }], rules: [
{ required: true, message: '参数名称不能为空', trigger: 'blur' },
],
}, },
], ],
[ [
@ -419,35 +423,35 @@ export default {
}, },
// //
async submitAttrForm() { submitAttrForm() {
this.$refs['attrForm'].validate((valid) => { this.$refs['attrForm'].validate(async (valid) => {
if (!valid) { if (!valid) {
return; return;
} }
}); const isEdit = this.attrForm.id != null;
const isEdit = this.attrForm.id != null; this.attrFormSubmitting = true;
this.attrFormSubmitting = true; const res = await this.$axios({
const res = await this.$axios({ url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate,
url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate, method: isEdit ? 'put' : 'post',
method: isEdit ? 'put' : 'post', data: {
data: { ...this.attrForm,
...this.attrForm, connectId: this.infoData.id,
connectId: this.infoData.id
},
});
if (res.code == 0) {
this.closeAttrForm();
this.$message({
message: `${isEdit ? '更新' : '创建'}成功`,
type: 'success',
duration: 1500,
onClose: () => {
this.getAttrList();
}, },
}); });
}
this.attrFormSubmitting = false; if (res.code == 0) {
this.closeAttrForm();
this.$message({
message: `${isEdit ? '更新' : '创建'}成功`,
type: 'success',
duration: 1500,
onClose: () => {
this.getAttrList();
},
});
}
this.attrFormSubmitting = false;
});
}, },
closeAttrForm() { closeAttrForm() {

View File

@ -12,7 +12,7 @@
:wrapper-closable="false" :wrapper-closable="false"
class="drawer" class="drawer"
custom-class="mes-drawer" custom-class="mes-drawer"
size="60%" :size="size || '50%'"
@closed="$emit('destroy')"> @closed="$emit('destroy')">
<SmallTitle slot="title"> <SmallTitle slot="title">
{{ {{
@ -42,7 +42,8 @@
:dataForm="form" :dataForm="form"
:rows="formRows" /> --> :rows="formRows" /> -->
<el-row style="margin-bottom: 24px"> <!-- if -->
<el-row v-if="mode.includes('detail')" style="margin-bottom: 24px">
<el-col :span="8"> <el-col :span="8">
<div <div
class="title" class="title"
@ -62,13 +63,39 @@
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
<!-- else -->
<el-row v-else style="margin-bottom: 24px" :gutter="20">
<el-form ref="form" :model="form">
<el-col :span="8">
<el-form-item
class="title"
label="设备分组名称"
style="font-size: 16px; margin: 8px 0">
<el-input
v-model="form.name"
placeholder="请输入设备分组名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
class="title"
label="设备分组编码"
style="font-size: 16px; margin: 8px 0">
<el-input
v-model="form.code"
placeholder="请输入设备分组编码"></el-input>
</el-form-item>
</el-col>
</el-form>
</el-row>
</div> </div>
<div <div
v-if="section.key == 'attrs'" v-if="section.key == 'attrs'"
style="position: relative; margin-top: 12px"> style="position: relative; margin-top: 12px">
<!-- v-if="!mode.includes('detail')" --> <div
<div style="position: absolute; top: -40px; right: 0"> v-if="!mode.includes('detail')"
style="position: absolute; top: -40px; right: 0">
<el-button @click="handleAddAttr" type="text"> <el-button @click="handleAddAttr" type="text">
<i class="el-icon-plus"></i> <i class="el-icon-plus"></i>
添加报警 添加报警
@ -84,7 +111,7 @@
<!-- :add-button-show="mode.includes('detail') ? null : '添加属性'" <!-- :add-button-show="mode.includes('detail') ? null : '添加属性'"
@emitButtonClick="handleAddAttr" --> @emitButtonClick="handleAddAttr" -->
<method-btn <method-btn
v-if="section.tableBtn" v-if="section.tableBtn && !mode.includes('detail')"
slot="handleBtn" slot="handleBtn"
label="操作" label="操作"
:method-list="tableBtn" :method-list="tableBtn"
@ -103,11 +130,13 @@
</div> </div>
<div class="drawer-body__footer"> <div class="drawer-body__footer">
<el-button style="" @click="handleCancel">取消</el-button> <el-button style="" @click="handleCancel">返回</el-button>
<!-- <el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit"> <el-button
编辑 type="primary"
</el-button> --> v-if="!mode.includes('detail')"
<!-- <el-button v-else type="primary" @click="handleCancel">确定</el-button> --> @click="handleSave">
保存
</el-button>
</div> </div>
</div> </div>
@ -163,7 +192,7 @@ const SmallTitle = {
export default { export default {
components: { SmallTitle, DialogForm, BaseInfoForm }, components: { SmallTitle, DialogForm, BaseInfoForm },
props: ['sections', 'defaultMode', 'dataId'], // dataId id props: ['sections', 'defaultMode', 'dataId', 'size'], // dataId id
data() { data() {
return { return {
mode: '', mode: '',
@ -191,7 +220,9 @@ export default {
label: '报警编码', // label: '报警编码', //
prop: 'code', prop: 'code',
url: '/base/equipment-group-alarm/getCode', url: '/base/equipment-group-alarm/getCode',
rules: [{ required: true, message: '报警编码不能为空', trigger: 'blur' }], rules: [
{ required: true, message: '报警编码不能为空', trigger: 'blur' },
],
}, },
{ {
select: true, select: true,
@ -205,13 +236,17 @@ export default {
input: true, input: true,
label: '参数列名', // label: '参数列名', //
prop: 'plcParamName', prop: 'plcParamName',
rules: [{ required: true, message: '参数列名不能为空', trigger: 'blur' }], rules: [
{ required: true, message: '参数列名不能为空', trigger: 'blur' },
],
}, },
{ {
input: true, input: true,
label: '报警内容', label: '报警内容',
prop: 'alarmContent', prop: 'alarmContent',
rules: [{ required: true, message: '报警内容不能为空', trigger: 'blur' }], rules: [
{ required: true, message: '报警内容不能为空', trigger: 'blur' },
],
}, },
], ],
[ [
@ -223,7 +258,9 @@ export default {
{ label: '布尔型', value: 2 }, { label: '布尔型', value: 2 },
{ label: '字符型', value: 1 }, { label: '字符型', value: 1 },
], ],
rules: [{ required: true, message: '报警类型不能为空', trigger: 'blur' }], rules: [
{ required: true, message: '报警类型不能为空', trigger: 'blur' },
],
}, },
{ {
input: true, input: true,
@ -322,7 +359,7 @@ export default {
handleSave() { handleSave() {
this.$refs['form'][0].validate(async (valid) => { this.$refs['form'][0].validate(async (valid) => {
if (valid) { if (valid) {
const isEdit = this.mode == 'edit'; const isEdit = !this.mode.includes('detail');
await this.$axios({ await this.$axios({
url: this.sections[0][isEdit ? 'urlUpdate' : 'urlCreate'], url: this.sections[0][isEdit ? 'urlUpdate' : 'urlCreate'],
method: isEdit ? 'put' : 'post', method: isEdit ? 'put' : 'post',
@ -403,32 +440,32 @@ export default {
}, },
// //
async submitAttrForm() { submitAttrForm() {
this.$refs['attrForm'].validate((valid) => { this.$refs['attrForm'].validate(async (valid) => {
if (!valid) { if (!valid) {
return; return;
} }
}); const isEdit = this.attrForm.id != null;
const isEdit = this.attrForm.id != null; this.attrFormSubmitting = true;
this.attrFormSubmitting = true; const res = await this.$axios({
const res = await this.$axios({ url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate,
url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate, method: isEdit ? 'put' : 'post',
method: isEdit ? 'put' : 'post', data: this.attrForm,
data: this.attrForm,
});
if (res.code == 0) {
this.closeAttrForm();
this.$message({
message: `${isEdit ? '更新' : '创建'}成功`,
type: 'success',
duration: 1500,
onClose: () => {
this.getAttrList();
},
}); });
}
this.attrFormSubmitting = false; if (res.code == 0) {
this.closeAttrForm();
this.$message({
message: `${isEdit ? '更新' : '创建'}成功`,
type: 'success',
duration: 1500,
onClose: () => {
this.getAttrList();
},
});
}
this.attrFormSubmitting = false;
});
}, },
closeAttrForm() { closeAttrForm() {

View File

@ -45,6 +45,7 @@
<BasicDrawer <BasicDrawer
v-if="editVisible" v-if="editVisible"
ref="drawer" ref="drawer"
size="45%"
:default-mode="editMode" :default-mode="editMode"
:data-id="alarmForm.id" :data-id="alarmForm.id"
:sections="[ :sections="[
@ -403,12 +404,25 @@ export default {
}); });
}); });
}, },
handleTableBtnClick({ data, type }) {
switch (type) {
case 'edit':
this.handleDetail(data, 'edit');
break;
case 'delete':
this.handleDelete(data);
break;
case 'detail':
this.handleDetail(data);
break;
}
},
// //
handleDetail(row) { handleDetail(row, mode = 'detail') {
// debugger; // debugger;
const { id, code, name, createTime } = row; const { id, code, name, createTime } = row;
// //
this.editMode = 'detail'; this.editMode = mode;
this.alarmForm.id = id; this.alarmForm.id = id;
this.alarmForm.equipmentGroupCode = code; this.alarmForm.equipmentGroupCode = code;
this.alarmForm.equipmentGroupName = name; this.alarmForm.equipmentGroupName = name;

View File

@ -12,7 +12,7 @@
:wrapper-closable="false" :wrapper-closable="false"
class="drawer" class="drawer"
custom-class="mes-drawer" custom-class="mes-drawer"
size="60%" :size="size || '50%'"
@closed="$emit('destroy')"> @closed="$emit('destroy')">
<SmallTitle slot="title"> <SmallTitle slot="title">
{{ {{
@ -42,7 +42,7 @@
:dataForm="form" :dataForm="form"
:rows="formRows" /> --> :rows="formRows" /> -->
<el-row style="margin-bottom: 24px"> <el-row v-if="mode.includes('detail')" style="margin-bottom: 24px">
<el-col :span="8"> <el-col :span="8">
<div <div
class="title" class="title"
@ -62,13 +62,38 @@
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
<el-row v-else style="margin-bottom: 24px" :gutter="20">
<el-form ref="form" :model="form">
<el-col :span="8">
<el-form-item
class="title"
label="设备分组名称"
style="font-size: 16px; margin: 8px 0">
<el-input
v-model="form.name"
placeholder="请输入设备分组名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
class="title"
label="设备分组编码"
style="font-size: 16px; margin: 8px 0">
<el-input
v-model="form.code"
placeholder="请输入设备分组编码"></el-input>
</el-form-item>
</el-col>
</el-form>
</el-row>
</div> </div>
<div <div
v-if="section.key == 'attrs'" v-if="section.key == 'attrs'"
style="position: relative; margin-top: 12px"> style="position: relative; margin-top: 12px">
<!-- v-if="!mode.includes('detail')" --> <div
<div style="position: absolute; top: -40px; right: 0"> v-if="!mode.includes('detail')"
style="position: absolute; top: -40px; right: 0">
<el-button @click="handleAddAttr" type="text"> <el-button @click="handleAddAttr" type="text">
<i class="el-icon-plus"></i> <i class="el-icon-plus"></i>
添加属性 添加属性
@ -84,7 +109,7 @@
<!-- :add-button-show="mode.includes('detail') ? null : '添加属性'" <!-- :add-button-show="mode.includes('detail') ? null : '添加属性'"
@emitButtonClick="handleAddAttr" --> @emitButtonClick="handleAddAttr" -->
<method-btn <method-btn
v-if="section.tableBtn" v-if="section.tableBtn && !mode.includes('detail')"
slot="handleBtn" slot="handleBtn"
label="操作" label="操作"
:method-list="tableBtn" :method-list="tableBtn"
@ -104,10 +129,12 @@
<div class="drawer-body__footer"> <div class="drawer-body__footer">
<el-button style="" @click="handleCancel">取消</el-button> <el-button style="" @click="handleCancel">取消</el-button>
<!-- <el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit"> <el-button
编辑 type="primary"
</el-button> --> v-if="!mode.includes('detail')"
<!-- <el-button v-else type="primary" @click="handleCancel">确定</el-button> --> @click="handleSave">
保存
</el-button>
</div> </div>
</div> </div>
@ -163,7 +190,7 @@ const SmallTitle = {
export default { export default {
components: { SmallTitle, DialogForm, BaseInfoForm }, components: { SmallTitle, DialogForm, BaseInfoForm },
props: ['sections', 'defaultMode', 'dataId'], // dataId id props: ['sections', 'defaultMode', 'dataId', 'size'], // dataId id
data() { data() {
return { return {
mode: '', mode: '',
@ -191,7 +218,9 @@ export default {
label: '报警编码', // label: '报警编码', //
prop: 'code', prop: 'code',
url: '/base/equipment-group-alarm/getCode', url: '/base/equipment-group-alarm/getCode',
rules: [{ required: true, message: '报警编码不能为空', trigger: 'blur' }], rules: [
{ required: true, message: '报警编码不能为空', trigger: 'blur' },
],
}, },
{ {
select: true, select: true,
@ -201,7 +230,9 @@ export default {
{ label: '布尔型', value: 2 }, { label: '布尔型', value: 2 },
{ label: '字符型', value: 1 }, { label: '字符型', value: 1 },
], ],
rules: [{ required: true, message: '报警类型不能为空', trigger: 'blur' }], rules: [
{ required: true, message: '报警类型不能为空', trigger: 'blur' },
],
}, },
], ],
[ [
@ -222,13 +253,17 @@ export default {
input: true, input: true,
label: '参数列名', // label: '参数列名', //
prop: 'plcParamName', prop: 'plcParamName',
rules: [{ required: true, message: '参数列名不能为空', trigger: 'blur' }], rules: [
{ required: true, message: '参数列名不能为空', trigger: 'blur' },
],
}, },
{ {
input: true, input: true,
label: '报警内容', label: '报警内容',
prop: 'alarmContent', prop: 'alarmContent',
rules: [{ required: true, message: '报警内容不能为空', trigger: 'blur' }], rules: [
{ required: true, message: '报警内容不能为空', trigger: 'blur' },
],
}, },
], ],
], ],
@ -322,7 +357,7 @@ export default {
handleSave() { handleSave() {
this.$refs['form'][0].validate(async (valid) => { this.$refs['form'][0].validate(async (valid) => {
if (valid) { if (valid) {
const isEdit = this.mode == 'edit'; const isEdit = !this.mode.includes('detail');
await this.$axios({ await this.$axios({
url: this.sections[0][isEdit ? 'urlUpdate' : 'urlCreate'], url: this.sections[0][isEdit ? 'urlUpdate' : 'urlCreate'],
method: isEdit ? 'put' : 'post', method: isEdit ? 'put' : 'post',
@ -403,33 +438,32 @@ export default {
}, },
// //
async submitAttrForm() { submitAttrForm() {
this.$refs['attrForm'].validate((valid) => { this.$refs['attrForm'].validate(async (valid) => {
if (!valid) { if (!valid) {
return; return;
} }
}); const isEdit = this.attrForm.id != null;
console.log('this.attrform', this.attrForm); this.attrFormSubmitting = true;
const isEdit = this.attrForm.id != null; const res = await this.$axios({
this.attrFormSubmitting = true; url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate,
const res = await this.$axios({ method: isEdit ? 'put' : 'post',
url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate, data: this.attrForm,
method: isEdit ? 'put' : 'post',
data: this.attrForm,
});
if (res.code == 0) {
this.closeAttrForm();
this.$message({
message: `${isEdit ? '更新' : '创建'}成功`,
type: 'success',
duration: 1500,
onClose: () => {
this.getAttrList();
},
}); });
}
this.attrFormSubmitting = false; if (res.code == 0) {
this.closeAttrForm();
this.$message({
message: `${isEdit ? '更新' : '创建'}成功`,
type: 'success',
duration: 1500,
onClose: () => {
this.getAttrList();
},
});
}
this.attrFormSubmitting = false;
});
}, },
closeAttrForm() { closeAttrForm() {

View File

@ -45,6 +45,7 @@
<BasicDrawer <BasicDrawer
v-if="editVisible" v-if="editVisible"
ref="drawer" ref="drawer"
size="45%"
:default-mode="editMode" :default-mode="editMode"
:data-id="alarmForm.id" :data-id="alarmForm.id"
:sections="[ :sections="[
@ -224,7 +225,9 @@ export default {
bind: { bind: {
filterable: true, filterable: true,
}, },
rules: [{ required: true, message: '设备不能为空', trigger: 'blur' }], rules: [
{ required: true, message: '设备不能为空', trigger: 'blur' },
],
}, },
], ],
[ [
@ -238,7 +241,9 @@ export default {
bind: { bind: {
filterable: true, filterable: true,
}, },
rules: [{ required: true, message: '报警分组不能为空', trigger: 'blur' }], rules: [
{ required: true, message: '报警分组不能为空', trigger: 'blur' },
],
}, },
], ],
], ],
@ -269,7 +274,13 @@ export default {
input: true, input: true,
label: '设备分组名称', label: '设备分组名称',
prop: 'name', prop: 'name',
rules: [{ required: true, message: '设备分组名称不能为空', trigger: 'blur' }], rules: [
{
required: true,
message: '设备分组名称不能为空',
trigger: 'blur',
},
],
// bind: { // bind: {
// disabled: this.editMode == 'detail', // some condition, like detail mode... // disabled: this.editMode == 'detail', // some condition, like detail mode...
// } // }
@ -287,26 +298,23 @@ export default {
prop: 'createTime', prop: 'createTime',
label: '添加时间', label: '添加时间',
fixed: true, fixed: true,
width: 180,
filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
}, },
{ width: 240, prop: 'code', label: '报警编码' }, { prop: 'code', label: '报警编码' },
{ {
width: 100,
prop: 'type', prop: 'type',
label: '报警类型', label: '报警类型',
filter: (val) => filter: (val) =>
val != null ? ['-', '字符型', '布尔型', '-'][val] : '-', val != null ? ['-', '字符型', '布尔型', '-'][val] : '-',
}, },
{ {
width: 90,
prop: 'grade', prop: 'grade',
label: '报警级别', label: '报警级别',
filter: publicFormatter(this.DICT_TYPE.EQU_ALARM_LEVEL), filter: publicFormatter(this.DICT_TYPE.EQU_ALARM_LEVEL),
}, },
{ width: 180, prop: 'alarmCode', label: '设备报警编码' }, { prop: 'alarmCode', label: '设备报警编码' },
{ width: 128, prop: 'plcParamName', label: '参数列名' }, { prop: 'plcParamName', label: '参数列名' },
{ width: 128, prop: 'alarmContent', label: '报警内容' }, { prop: 'alarmContent', label: '报警内容' },
], ],
}; };
}, },
@ -361,6 +369,19 @@ export default {
}; };
this.resetForm('form'); this.resetForm('form');
}, },
handleTableBtnClick({ data, type }) {
switch (type) {
case 'edit':
this.handleDetail(data, 'edit');
break;
case 'delete':
this.handleDelete(data);
break;
case 'detail':
this.handleDetail(data);
break;
}
},
/** 搜索按钮操作 */ /** 搜索按钮操作 */
handleQuery() { handleQuery() {
this.queryParams.pageNo = 1; this.queryParams.pageNo = 1;
@ -411,11 +432,11 @@ export default {
}); });
}, },
// //
handleDetail(row) { handleDetail(row, mode = 'detail') {
const { equipmentId, equipmentName, groupCode, groupId, groupName, id } = const { equipmentId, equipmentName, groupCode, groupId, groupName, id } =
row; row;
// //
this.editMode = 'detail'; this.editMode = mode;
this.alarmForm.id = groupId; this.alarmForm.id = groupId;
this.alarmForm.equipmentGroupCode = groupCode; this.alarmForm.equipmentGroupCode = groupCode;
this.alarmForm.equipmentGroupName = groupName; this.alarmForm.equipmentGroupName = groupName;

View File

@ -52,6 +52,7 @@
<BasicDrawer <BasicDrawer
v-if="editVisible" v-if="editVisible"
ref="drawer" ref="drawer"
size="45%"
:default-mode="editMode" :default-mode="editMode"
:info-data="alarmForm" :info-data="alarmForm"
:sections="[ :sections="[
@ -59,6 +60,10 @@
name: '基本信息', name: '基本信息',
key: 'base', key: 'base',
rows: drawerBaseInfoRows, rows: drawerBaseInfoRows,
url: '/base/equipment-plc-connect/get',
urlUpdate: '/base/equipment-plc-connect/update',
urlCreate: '/base/equipment-plc-connect/create',
queryParams: { id: alarmForm.id },
}, },
{ {
name: '采集参数', name: '采集参数',
@ -189,7 +194,7 @@ export default {
placeholder: '请选择设备', placeholder: '请选择设备',
param: 'equipmentId', param: 'equipmentId',
selectOptions: [], selectOptions: [],
filterable: true filterable: true,
}, },
{ {
type: 'select', type: 'select',
@ -197,7 +202,7 @@ export default {
placeholder: '请选择关联表编码', placeholder: '请选择关联表编码',
param: 'plcId', param: 'plcId',
selectOptions: [], selectOptions: [],
filterable: true filterable: true,
}, },
{ {
type: 'button', type: 'button',
@ -311,8 +316,8 @@ export default {
label: '生产参数类型', label: '生产参数类型',
filter: (val) => filter: (val) =>
val != null val != null
// ? ['', '', '', '', '', ''][val] ? // ? ['', '', '', '', '', ''][val]
? ['', '进口计数', '出口计数', '损耗计数', '无类型', ''][val] ['', '进口计数', '出口计数', '损耗计数', '无类型', ''][val]
: '-', : '-',
}, },
{ {
@ -423,6 +428,19 @@ export default {
}; };
this.resetForm('form'); this.resetForm('form');
}, },
handleTableBtnClick({ data, type }) {
switch (type) {
case 'edit':
this.handleDetail(data, 'edit');
break;
case 'delete':
this.handleDelete(data);
break;
case 'detail':
this.handleDetail(data);
break;
}
},
/** 搜索按钮操作 */ /** 搜索按钮操作 */
handleQuery() { handleQuery() {
this.queryParams.pageNo = 1; this.queryParams.pageNo = 1;
@ -474,7 +492,7 @@ export default {
}, },
// //
handleDetail(row) { handleDetail(row, mode = 'detail') {
// debugger; // debugger;
const { const {
id, id,
@ -490,7 +508,7 @@ export default {
workshopSection, workshopSection,
} = row; } = row;
// //
this.editMode = 'detail'; this.editMode = mode;
this.alarmForm.id = id; this.alarmForm.id = id;
this.alarmForm.plcTableName = plcTableName; // this.alarmForm.plcTableName = plcTableName; //
this.alarmForm.equipmentName = equipmentName; this.alarmForm.equipmentName = equipmentName;

View File

@ -12,7 +12,7 @@
:wrapper-closable="false" :wrapper-closable="false"
class="drawer" class="drawer"
custom-class="mes-drawer" custom-class="mes-drawer"
size="60%" :size="size || '50%'"
@closed="$emit('destroy')"> @closed="$emit('destroy')">
<SmallTitle slot="title"> <SmallTitle slot="title">
{{ {{
@ -42,7 +42,8 @@
v-model="form" v-model="form"
:rows="formRows" /> --> :rows="formRows" /> -->
<el-row style="margin-bottom: 24px"> <!-- if -->
<el-row v-if="mode.includes('detail')" style="margin-bottom: 24px">
<el-col :span="8"> <el-col :span="8">
<div <div
class="title" class="title"
@ -64,13 +65,39 @@
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
<!-- else -->
<el-row v-else style="margin-bottom: 24px" :gutter="20">
<el-form ref="form" :model="form">
<el-col :span="8">
<el-form-item
class="title"
label="设备名"
style="font-size: 16px; margin: 8px 0">
<el-input
v-model="form.equipmentName"
placeholder="请输入设备名"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
class="title"
label="设备关联表名"
style="font-size: 16px; margin: 8px 0">
<el-input
v-model="form.plcTableName"
placeholder="请输入关联表名"></el-input>
</el-form-item>
</el-col>
</el-form>
</el-row>
</div> </div>
<div <div
v-if="section.key == 'attrs'" v-if="section.key == 'attrs'"
style="position: relative; margin-top: 12px"> style="position: relative; margin-top: 12px">
<!-- v-if="!mode.includes('detail')" --> <div
<div style="position: absolute; top: -40px; right: 0"> v-if="!mode.includes('detail')"
style="position: absolute; top: -40px; right: 0">
<el-button @click="handleAddAttr" type="text"> <el-button @click="handleAddAttr" type="text">
<i class="el-icon-plus"></i> <i class="el-icon-plus"></i>
添加属性 添加属性
@ -86,7 +113,7 @@
<!-- :add-button-show="mode.includes('detail') ? null : '添加属性'" <!-- :add-button-show="mode.includes('detail') ? null : '添加属性'"
@emitButtonClick="handleAddAttr" --> @emitButtonClick="handleAddAttr" -->
<method-btn <method-btn
v-if="section.tableBtn" v-if="section.tableBtn && !mode.includes('detail')"
slot="handleBtn" slot="handleBtn"
label="操作" label="操作"
:method-list="tableBtn" :method-list="tableBtn"
@ -106,10 +133,12 @@
<div class="drawer-body__footer"> <div class="drawer-body__footer">
<el-button style="" @click="handleCancel">取消</el-button> <el-button style="" @click="handleCancel">取消</el-button>
<!-- <el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit"> <el-button
编辑 type="primary"
</el-button> --> v-if="!mode.includes('detail')"
<!-- <el-button v-else type="primary" @click="handleCancel">确定</el-button> --> @click="handleSave">
保存
</el-button>
</div> </div>
</div> </div>
@ -164,7 +193,7 @@ const SmallTitle = {
export default { export default {
components: { SmallTitle, DialogForm: BaseInfoForm, BaseInfoForm }, components: { SmallTitle, DialogForm: BaseInfoForm, BaseInfoForm },
props: ['sections', 'defaultMode', 'infoData'], props: ['sections', 'defaultMode', 'infoData', 'size'],
data() { data() {
return { return {
mode: '', mode: '',
@ -412,7 +441,7 @@ export default {
handleSave() { handleSave() {
this.$refs['form'][0].validate(async (valid) => { this.$refs['form'][0].validate(async (valid) => {
if (valid) { if (valid) {
const isEdit = this.mode == 'edit'; const isEdit = !this.mode.includes('detail');
await this.$axios({ await this.$axios({
url: this.sections[0][isEdit ? 'urlUpdate' : 'urlCreate'], url: this.sections[0][isEdit ? 'urlUpdate' : 'urlCreate'],
method: isEdit ? 'put' : 'post', method: isEdit ? 'put' : 'post',