修改表单构建

src/views/demo/1737357696683.vue

@@ -1,102 +0,0 @@
-<template>
-  <div class="app-container">
-    <el-form ref="formRef" :model="formData" :rules="rules" size="default" label-width="100px">
-      <el-row gutter="15">
-        <el-col :span="12">
-          <el-row gutter="15">
-            <el-col :span="12">
-              <el-form-item label="多选框组" prop="field104">
-                <el-checkbox-group v-model="formData.field104" size="default">
-                  <el-checkbox v-for="(item, index) in field104Options" :key="index" :label="item.value"
-                    :disabled="item.disabled">{{item.label}}</el-checkbox>
-                </el-checkbox-group>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </el-col>
-        <el-col :span="12">
-          <el-row gutter="15">
-            <el-col :span="12">
-              <el-form-item label="多选框组" prop="field105">
-                <el-checkbox-group v-model="formData.field105" size="default">
-                  <el-checkbox v-for="(item, index) in field105Options" :key="index" :label="item.value"
-                    :disabled="item.disabled">{{item.label}}</el-checkbox>
-                </el-checkbox-group>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </el-col>
-      </el-row>
-      <el-form-item>
-        <el-button type="primary" @click="submitForm">提交</el-button>
-        <el-button @click="resetForm">重置</el-button>
-      </el-form-item>
-    </el-form>
-  </div>
-</template>
-<script setup>
-const {
-  proxy
-} = getCurrentInstance()
-const formRef = ref()
-const data = reactive({
-  formData: {
-    field104: [],
-    field105: [],
-  },
-  rules: {
-    field104: [{
-      required: true,
-      type: 'array',
-      message: '请至少选择一个field104',
-      trigger: 'change'
-    }],
-    field105: [{
-      required: true,
-      type: 'array',
-      message: '请至少选择一个field105',
-      trigger: 'change'
-    }],
-  }
-})
-const {
-  formData,
-  rules
-} = toRefs(data)
-const field104Options = ref([{
-  "label": "选项一",
-  "value": 1
-}, {
-  "label": "选项二",
-  "value": 2
-}])
-const field105Options = ref([{
-  "label": "选项一",
-  "value": 1
-}, {
-  "label": "选项二",
-  "value": 2
-}])
-/**
- * @name: 表单提交
- * @description: 表单提交方法
- * @return {*}
- */
-function submitForm() {
-  formRef.value.validate((valid) => {
-    if (!valid) return
-    // TODO 提交表单
-  })
-}
-/**
- * @name: 表单重置
- * @description: 表单重置方法
- * @return {*}
- */
-function resetForm() {
-  formRef.value.resetFields()
-}
-
-</script>
-<style>
-</style>