1.界面展示
2.图中状态字段接收的数据如下
3.代码转换，添加计算属性代码
再在绑定属性的地方做转换
computed: {statusMap() {return {"-1": "已退号",1: "挂号",2: "接诊",3: "已完诊",};},},<m-input:span="8"@input="handleStatusInput":disabled="true"label="状态":value="statusMap[registrationData.zt]"></m-input>await getPatientRegistrationInfo(param).then((res) => {if (res.code === 200) {this.dw_gh = res.data;this.registrationData.zt = this.dw_gh[0].ZT;
// .
// .
// .
// .}});上面是输入框的映射，还有一种是表格列的映射，如下
<m-dialog :title="dw_1_dialogTitle"height='50vh'width="50%"v-model.sync='isShow_dw_1'top="5vh"@closed="":closeOnModal="false":show-close="false"appendToBody><div style="height: 90%;" class="border-shadow"><MultiDataTable v-loading=""id='dw_1':data="dw_1"ref='dw_1_ref':tableColumns="dw_1_Column"@selection-change=""@row-click=""@select=""@select-all=""v-cloakcell-class-name='nowarp' seq><template #CZ="{row, rowIndex}"><el-button type="text" @click="handleOperation(row, {prop: 'CZ'})">查看</el-button></template><template #CZ1="{row, rowIndex}"><el-button type="text" @click="handleOperation(row, {prop: 'CZ1'})">审核</el-button></template></MultiDataTable></div><div class="common-btn" style="margin-top: 16px; text-align: right" ><m-row><m-button name="refresh" @click="" style="margin-right: 20px">确定</m-button><!-- 回退/审批 按钮 --><m-button name="close" @click="" style="margin-right: 40px">取消</m-button></m-row></div></m-dialog>data() {return {dw_1_Column: [{label: '类型',prop: 'LX',width: 110,align: 'center',},{label: '单据号',prop: 'DJH',width: 130,align: 'center',},{label: '办理日期',prop: 'BLRQ',width: 110,align: 'center',},{label: '状态',prop: 'ZT',width: 110,formatter: (row) => {return this.dw_1_stateMapping[Number(row.row.ZT)] || row.row.ZT;},align: 'center',},{label: '查看',prop: 'CZ',slotName:"CZ",width: 110,align: 'center',},{label: '审核',prop: 'CZ1',slotName:"CZ1",width: 110,align: 'center',},],dw_1_stateMapping: {1: '新制',2: '审核',},}
}
如图
