问题描述

这个是需求：动态表格、表格里边下拉框，弹框选择

基础的列表，还行，这种真的是一时不知如何是好。打算晚上吃了饭找前端同事，帮忙看看。晚饭前，AI一下看看。结果，惊为天人！！

问题解决

提问：

生成代码：

<template><div class="exam-scoring-page"><h3>试卷评分</h3><div class="form-group"><el-radio-group v-model="vehicleSpecResult"><el-radio label="正确">车型参配：正确</el-radio><el-radio label="错误">车型参配：错误</el-radio></el-radio-group><el-radio-group v-model="detectionResult"><el-radio label="正确">检测结果：正确</el-radio><el-radio label="错误">检测结果：错误</el-radio></el-radio-group><el-radio-group v-model="paintFilmResult"><el-radio label="合格">漆膜打点：合格</el-radio><el-radio label="不合格">漆膜打点：不合格</el-radio></el-radio-group></div><div class="form-group"><label>问题标记：</label><el-table:data="problemList"borderstyle="width: 800px; margin-left: 60px"><el-table-column prop="part" label="部件"><template slot-scope="scope"><el-select v-model="scope.row.part" placeholder="请选择部件"><el-option label="左A柱内侧" value="左A柱内侧"></el-option><el-option label="右侧下边梁" value="右侧下边梁"></el-option><!-- 可根据实际需求添加更多选项 --></el-select></template></el-table-column><el-table-column prop="recordProblem" label="备案问题"><template slot-scope="scope"><el-radio-group v-model="scope.row.recordProblem"><el-radio label="未备案">未备案</el-radio><el-radio label="备案错误">备案错误</el-radio></el-radio-group></template></el-table-column><el-table-column prop="inspectorSelection" label="检测师点选"><template slot-scope="scope"><el-input v-model="scope.row.inspectorSelection" placeholder="请输入"></el-input></template></el-table-column><el-table-column prop="selectionProblem" label="点选存在问题"><template slot-scope="scope"><el-input v-model="scope.row.selectionProblem" placeholder="请输入"></el-input></template></el-table-column><el-table-column label="操作"><template slot-scope="scope"><el-button type="text" @click="addRow">添加</el-button><el-button type="text" @click="deleteRow(scope.$index)" v-if="problemList.length > 1">删除</el-button></template></el-table-column></el-table></div><div class="form-group"><label>试卷批改备注：</label><el-inputtype="textarea"v-model="remark":rows="5"style="width: 800px; margin-left: 60px"placeholder="请输入备注"></el-input></div><el-button type="primary" @click="save" style="margin-left: 450px; margin-top: 20px">保存</el-button></div>
</template><script>
export default {data() {return {vehicleSpecResult: "", // 车型参配结果detectionResult: "", // 检测结果paintFilmResult: "", // 漆膜打点结果problemList: [{part: "左A柱内侧",recordProblem: "备案错误",inspectorSelection: "未见异常(未见异常)",selectionProblem: "变形(变形),老化(老化)",},{part: "右侧下边梁",recordProblem: "未备案",inspectorSelection: "未见异常(未见异常)",selectionProblem: "",},{part: "",recordProblem: "未备案",inspectorSelection: "未见异常(未见异常)",selectionProblem: "变形(变形),老化(老化)",},], // 问题标记列表remark: "", // 试卷批改备注};},methods: {addRow() {this.problemList.push({part: "",recordProblem: "未备案",inspectorSelection: "未见异常(未见异常)",selectionProblem: "",});},deleteRow(index) {this.problemList.splice(index, 1);},save() {// 保存逻辑，可根据实际需求将数据提交到后端console.log("保存数据：", {vehicleSpecResult: this.vehicleSpecResult,detectionResult: this.detectionResult,paintFilmResult: this.paintFilmResult,problemList: this.problemList,remark: this.remark,});this.$message.success("保存成功");},},
};
</script><style scoped>
.exam-scoring-page {padding: 20px;
}
.form-group {margin-bottom: 20px;
}
.form-group label {display: inline-block;width: 60px;
}
.el-radio {margin-right: 20px;
}
</style>

copy过来代码，我试试效果：