a

src/views/recruit/recruitstudentplancorrectscoreconfig/detaiform.vue

@@ -2,12 +2,12 @@
   <el-dialog
     :title="!dataForm.id ? '新增' : '修改'"
     :close-on-click-modal="false"
-    :visible.sync="visible">
-    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()"
+    v-model="visible">
+    <el-form :model="dataForm" :rules="dataRule" ref="dataFormRef" @keyup.enter="dataFormSubmit"
              label-width="140px">
 
       <el-form-item label="招生计划" prop="groupId">
-        <el-select v-model="dataForm.groupId" filterable placeholder="请选择招生计划" size="small" style="width: 100%" :disabled="!dataForm.id ? false : true">
+        <el-select v-model="dataForm.groupId" filterable placeholder="请选择招生计划" size="small" style="width: 100%" :disabled="!!dataForm.id">
           <el-option
             v-for="item in planList"
             :key="item.id"
@@ -17,7 +17,7 @@
         </el-select>
       </el-form-item>
       <el-form-item label="地区" prop="regionId">
-        <el-select v-model="dataForm.regionId" filterable placeholder="请选择地区" size="small" style="width: 100%" >
+        <el-select v-model="dataForm.regionId" filterable placeholder="请选择地区" size="small" style="width: 100%">
           <el-option
             v-for="item in regionList"
             :key="item.code"
@@ -31,99 +31,127 @@
       </el-form-item>
     </el-form>
 
-    <span slot="footer" class="dialog-footer">
-      <el-button @click="visible = false">取消</el-button>
-      <el-button type="primary" @click="dataFormSubmit()" v-if="canSubmit">确定</el-button>
-    </span>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="visible = false">取消</el-button>
+        <el-button type="primary" @click="dataFormSubmit" v-if="canSubmit">确定</el-button>
+      </div>
+    </template>
   </el-dialog>
 </template>
 
-<script>
-import {addObj, getObj, putObj} from '@/api/recruit/recruitstudentplancorrectscoreconfig'
-import {areaList} from "@/api/recruit/recruitstudentschool";
-import {list} from "@/api/recruit/recruitstudentplangroup";
+<script setup lang="ts">
+import { ref, reactive, nextTick } from 'vue'
+import { ElNotification } from 'element-plus'
+import { addObj, getObj, putObj } from '@/api/recruit/recruitstudentplancorrectscoreconfig'
+import { areaList } from "@/api/recruit/recruitstudentschool"
+import { list } from "@/api/recruit/recruitstudentplangroup"
 
-export default {
-  data() {
-    return {
-      visible: false,
-      canSubmit: false,
-      dataForm: {
-        id: "",
-        groupId: "",
-        regionId:"",
-        fullScore:""
-      },
-      regionList:[],
-      planList:[],
-      dataRule: {
-        groupId: [
-          {required: true, message: '招生计划不能为空', trigger: 'blur'}
-        ],
-        regionId:[
-          {required: true, message: '地区不能为空', trigger: 'blur'}
-        ],
-        fullScore:[
-          {required: true, message: '分数线不能为空', trigger: 'blur'}
-        ],
+// Emits
+const emit = defineEmits<{
+  (e: 'refreshDataList'): void
+}>()
+
+// 表单引用
+const dataFormRef = ref()
+
+// 响应式数据
+const visible = ref(false)
+const canSubmit = ref(false)
+const regionList = ref<any[]>([])
+const planList = ref<any[]>([])
+
+const dataForm = reactive({
+  id: "",
+  groupId: "",
+  regionId: "",
+  fullScore: null as number | null,
+  regionName: ""
+})
+
+const dataRule = {
+  groupId: [
+    { required: true, message: '招生计划不能为空', trigger: 'blur' }
+  ],
+  regionId: [
+    { required: true, message: '地区不能为空', trigger: 'blur' }
+  ],
+  fullScore: [
+    { required: true, message: '分数线不能为空', trigger: 'blur' }
+  ],
+}
+
+// 初始化数据
+const initData = () => {
+  list().then((data: any) => {
+    planList.value = data.data
+  })
+  areaList({ type: "0", parentId: "11" }).then((data: any) => {
+    regionList.value = data.data
+  })
+}
+
+// 表单提交
+const dataFormSubmit = () => {
+  dataFormRef.value?.validate((valid: boolean) => {
+    if (valid) {
+      canSubmit.value = false
+      regionList.value.forEach(e => {
+        if (e.code == dataForm.regionId) {
+          dataForm.regionName = e.name
+        }
+      })
+      if (dataForm.id) {
+        putObj(dataForm).then(() => {
+          ElNotification.success({
+            title: '成功',
+            message: '修改成功'
+          })
+          visible.value = false
+          emit('refreshDataList')
+        }).catch(() => {
+          canSubmit.value = true
+        })
+      } else {
+        addObj(dataForm).then(() => {
+          ElNotification.success({
+            title: '成功',
+            message: '添加成功'
+          })
+          visible.value = false
+          emit('refreshDataList')
+        }).catch(() => {
+          canSubmit.value = true
+        })
       }
     }
-  },
-  created() {
-  },
-  methods: {
-    init(id) {
-      this.dataForm.id = id || null;
-      this.visible = true;
-      this.canSubmit = true;
-      this.$nextTick(() => {
-        this.initData();
-        this.$refs['dataForm'].resetFields()
-        if (this.dataForm.id) {
-          getObj(this.dataForm.id).then(response => {
-            this.dataForm = response.data.data
-          })
-        }
-      })
-    },
-    initData() {
-      list().then(data => {
-        this.planList = data.data.data
-      });
-      areaList({type:"0",parentId:"11"}).then(data =>{
-        this.regionList = data.data.data;
-      });
-    },
-    // 表单提交
-    dataFormSubmit() {
-      this.$refs['dataForm'].validate((valid) => {
-        if (valid) {
-          this.canSubmit = false;
-          this.regionList.forEach(e=>{
-            if(e.code == this.dataForm.regionId){
-              this.dataForm.regionName =e.name;
-            }
-          });
-          if (this.dataForm.id) {
-            putObj(this.dataForm).then(data => {
-              this.$notify.success('修改成功')
-              this.visible = false
-              this.$emit('refreshDataList')
-            }).catch(() => {
-              this.canSubmit = true;
-            });
-          } else {
-            addObj(this.dataForm).then(data => {
-              this.$notify.success('添加成功')
-              this.visible = false
-              this.$emit('refreshDataList')
-            }).catch(() => {
-              this.canSubmit = true;
-            });
-          }
-        }
+  })
+}
+
+// 初始化方法
+const init = (id: string | null) => {
+  dataForm.id = id || ""
+  visible.value = true
+  canSubmit.value = true
+  nextTick(() => {
+    initData()
+    dataFormRef.value?.resetFields()
+    if (dataForm.id) {
+      getObj(dataForm.id).then((response: any) => {
+        Object.assign(dataForm, response.data)
       })
     }
-  }
+  })
 }
+
+// 暴露方法给父组件
+defineExpose({
+  init
+})
 </script>
+
+<style scoped>
+.dialog-footer {
+  text-align: right;
+}
+</style>

src/views/recruit/recruitstudentplancorrectscoreconfig/index.vue

@@ -160,8 +160,8 @@ const state: BasicTableProps = reactive<BasicTableProps>({
     const response = await fetchList(params)
     return {
       data: {
-        records: response.data.data.records,
-        total: response.data.data.total
+        records: response.data.records,
+        total: response.data.total
       }
     }
   },
@@ -175,7 +175,7 @@ const { getDataList, currentChangeHandle, sizeChangeHandle, tableStyle } = useTa
 const init = async () => {
   try {
     const data = await list()
-    planList.value = data.data.data || []
+    planList.value = data.data || []
     if (planList.value.length > 0) {
       queryForm.groupId = planList.value[0].id
     }