修改表单样式

src/views/training/meeting-add/index.vue

@@ -22,26 +22,19 @@
                             </el-col>
                             <el-col :span="6">
                                 <el-form-item label="培训时间" prop="trainingTime">
-                                    <el-date-picker v-model="form.trainingTime" type="datetimerange"
-                                        value-format="YYYY-MM-DD HH:mm:ss" date-format="YYYY-MM-DD"
-                                        time-format="HH:mm:ss" range-separator="至" start-placeholder="开始时间"
-                                        end-placeholder="结束时间" />
+                                    <el-date-picker v-model="form.trainingTime" type="datetimerange" value-format="YYYY-MM-DD HH:mm:ss" date-format="YYYY-MM-DD" time-format="HH:mm:ss" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" />
                                 </el-form-item>
                             </el-col>
                             <el-col :span="6">
                                 <el-form-item label="报名时间" prop="signupTime">
-                                    <el-date-picker v-model="form.signupsTime" type="datetimerange"
-                                        value-format="YYYY-MM-DD HH:mm:ss" date-format="YYYY-MM-DD"
-                                        time-format="HH:mm:ss" range-separator="至" start-placeholder="开始时间"
-                                        end-placeholder="结束时间" />
+                                    <el-date-picker v-model="form.signupsTime" type="datetimerange" value-format="YYYY-MM-DD HH:mm:ss" date-format="YYYY-MM-DD" time-format="HH:mm:ss" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" />
                                 </el-form-item>
                             </el-col>
                             <el-col :span="6">
                                 <el-form-item label="培训方式" prop="joinType">
                                     <!-- 单选框 -->
                                     <el-radio-group v-model="form.joinType">
-                                        <el-radio v-for="item in lm_training_join_type" :key="item.value"
-                                            :label="item.value">{{ item.label }}</el-radio>
+                                        <el-radio v-for="item in lm_training_join_type" :key="item.value" :label="item.value">{{ item.label }}</el-radio>
                                     </el-radio-group>
                                 </el-form-item>
                             </el-col>
@@ -52,8 +45,7 @@
                             </el-col>
                             <el-col :span="6">
                                 <el-form-item label="会议联系人" prop="contactName">
-                                    <el-input v-model="form.contactName" maxlength="40" placeholder="请输入会议联系人"
-                                        clearable />
+                                    <el-input v-model="form.contactName" maxlength="40" placeholder="请输入会议联系人" clearable />
                                 </el-form-item>
                             </el-col>
                             <el-col :span="6">
@@ -63,8 +55,8 @@
                             </el-col>
                             <el-col :span="6">
                                 <el-form-item label="报名人数" prop="conditions.totalCheck">
-                                    <div class="d-flex a-c"><el-radio-group v-model="form.conditions.totalCheck"
-                                            style="flex-wrap: nowrap">
+                                    <div class="d-flex a-c">
+                                        <el-radio-group v-model="form.conditions.totalCheck" style="flex-wrap: nowrap">
                                             <el-radio label="0">不限制</el-radio>
                                             <el-radio label="1">限制</el-radio>
                                         </el-radio-group>
@@ -80,74 +72,47 @@
                                     <div class="d-flex flex-cln pl-10">
                                         <div class="d-flex">
                                             <div class="c-#606266 f-w-6" style="">报名总人数限制:</div>
-                                            <el-input class="flex1 pl-5" v-model="form.conditions.total" maxlength="20"
-                                                placeholder="请输入报名人数" clearable
-                                                :disabled="form.conditions.totalCheck !== '1'"
-                                                style="max-width: 200px;" />
+                                            <el-input class="flex1 pl-5" v-model="form.conditions.total" maxlength="20" placeholder="请输入报名人数" clearable :disabled="form.conditions.totalCheck !== '1'" style="max-width: 200px;" />
                                         </div>
                                         <div class="c-#606266 f-w-6" style="">条件限制:</div>
                                         <div class="d-flex">
                                             <div class="d-flex flex-cln">
-                                                <el-checkbox v-model="form.conditions.levelTotalCheck" label="按盟员单位等级限制"
-                                                    size="large" true-value="1" false-value="0" />
-                                                <div v-if="form.conditions.levelTotalCheck == '1' && form.conditions.cpyTotalCheck == '0'"
-                                                    class="pl-10 pr-10 pt-5 pb-5 border">
-                                                    <template v-for="(item, index) in form.conditions.levelCheck"
-                                                        :key="index">
+                                                <el-checkbox v-model="form.conditions.levelTotalCheck" label="按盟员单位等级限制" size="large" true-value="1" false-value="0" />
+                                                <div v-if="form.conditions.levelTotalCheck == '1' && form.conditions.cpyTotalCheck == '0'" class="pl-10 pr-10 pt-5 pb-5 border">
+                                                    <template v-for="(item, index) in form.conditions.levelCheck" :key="index">
                                                         <div class="d-flex a-c">
-                                                            <el-checkbox v-model="item.check" true-value="1"
-                                                                false-value="0"
-                                                                :label="'所有' + selectDictLabels(vip_level, item.vipLevel, ',') + '参会人数≤'"
-                                                                size="large" />
-                                                            <el-input class="pl-10" v-model="item.total" maxlength="20"
-                                                                placeholder="请输入报名人数" :disabled="!+item.check" />
+                                                            <el-checkbox v-model="item.check" true-value="1" false-value="0" :label="'所有' + selectDictLabels(vip_level, item.vipLevel, ',') + '参会人数≤'" size="large" />
+                                                            <el-input class="pl-10" v-model="item.total" maxlength="20" placeholder="请输入报名人数" :disabled="!+item.check" />
                                                         </div>
                                                     </template>
                                                 </div>
                                             </div>
-                                            <div class="d-flex flex-cln ml-20"> <el-checkbox
-                                                    v-model="form.conditions.cpyTotalCheck" label="按每家单位人数限制"
-                                                    size="large" true-value="1" false-value="0" />
-                                                <div v-if="form.conditions.cpyTotalCheck == '1' && form.conditions.levelTotalCheck == '0'"
-                                                    class="pl-10 pr-10 pt-5 pb-5 border">
-
-                                                    <template v-for="(item, index) in form.conditions.cpyCheck"
-                                                        :key="index">
+                                            <div class="d-flex flex-cln ml-20">
+                                                <el-checkbox v-model="form.conditions.cpyTotalCheck" label="按每家单位人数限制" size="large" true-value="1" false-value="0" />
+                                                <div v-if="form.conditions.cpyTotalCheck == '1' && form.conditions.levelTotalCheck == '0'" class="pl-10 pr-10 pt-5 pb-5 border">
+                                                    <template v-for="(item, index) in form.conditions.cpyCheck" :key="index">
                                                         <div class="d-flex a-c">
-                                                            <el-checkbox v-model="item.check"
-                                                                :label="selectDictLabels(vip_level, item.vipLevel, ',') + '限制每家单位人数≤'"
-                                                                size="large" true-value="1" false-value="0" /><el-input
-                                                                class="pl-10" v-model="item.total" maxlength="20"
-                                                                placeholder="请输入报名人数" :disabled="!+item.check" />
+                                                            <el-checkbox v-model="item.check" :label="selectDictLabels(vip_level, item.vipLevel, ',') + '限制每家单位人数≤'" size="large" true-value="1" false-value="0" />
+                                                            <el-input class="pl-10" v-model="item.total" maxlength="20" placeholder="请输入报名人数" :disabled="!+item.check" />
                                                         </div>
                                                     </template>
-
                                                 </div>
                                             </div>
                                         </div>
-                                        <div class="d-flex border"
-                                            v-if="form.conditions.levelTotalCheck == '1' && form.conditions.cpyTotalCheck == '1'">
+                                        <div class="d-flex border" v-if="form.conditions.levelTotalCheck == '1' && form.conditions.cpyTotalCheck == '1'">
                                             <div class="pl-10 pr-10 pt-5 pb-5 ">
-                                                <template v-for="(item, index) in form.conditions.levelCheck"
-                                                    :key="index">
+                                                <template v-for="(item, index) in form.conditions.levelCheck" :key="index">
                                                     <div class="d-flex a-c">
-                                                        <el-checkbox v-model="item.check"
-                                                            :label="'所有' + selectDictLabels(vip_level, item.vipLevel, ',') + '参会人数≤'"
-                                                            size="large" true-value="1" false-value="0" /><el-input
-                                                            class="pl-10" v-model="item.total" maxlength="20"
-                                                            placeholder="请输入报名人数" :disabled="!+item.check" />
+                                                        <el-checkbox v-model="item.check" :label="'所有' + selectDictLabels(vip_level, item.vipLevel, ',') + '参会人数≤'" size="large" true-value="1" false-value="0" />
+                                                        <el-input class="pl-10" v-model="item.total" maxlength="20" placeholder="请输入报名人数" :disabled="!+item.check" />
                                                     </div>
                                                 </template>
                                             </div>
                                             <div class="pl-10 pr-10 pt-5 pb-5">
-                                                <template v-for="(item, index) in form.conditions.cpyCheck"
-                                                    :key="index">
+                                                <template v-for="(item, index) in form.conditions.cpyCheck" :key="index">
                                                     <div class="d-flex a-c">
-                                                        <el-checkbox v-model="item.check"
-                                                            :label="selectDictLabels(vip_level, item.vipLevel, ',') + '限制每家单位人数≤'"
-                                                            size="large" true-value="1" false-value="0" /><el-input
-                                                            class="pl-10" v-model="item.total" maxlength="20"
-                                                            placeholder="请输入报名人数" :disabled="!+item.check" />
+                                                        <el-checkbox v-model="item.check" :label="selectDictLabels(vip_level, item.vipLevel, ',') + '限制每家单位人数≤'" size="large" true-value="1" false-value="0" />
+                                                        <el-input class="pl-10" v-model="item.total" maxlength="20" placeholder="请输入报名人数" :disabled="!+item.check" />
                                                     </div>
                                                 </template>
                                             </div>
@@ -158,8 +123,7 @@
                             <el-col :span="6">
                                 <el-form-item label="是否电子手签" prop="eleSignature">
                                     <div class="d-flex a-c">
-                                        <el-radio-group v-model="form.eleSignature"
-                                            style="flex-wrap: nowrap">
+                                        <el-radio-group v-model="form.eleSignature" style="flex-wrap: nowrap">
                                             <el-radio label="1">是</el-radio>
                                             <el-radio label="0">否</el-radio>
                                         </el-radio-group>
@@ -170,8 +134,7 @@
                         <el-row :gutter="20">
                             <el-col :span="12">
                                 <el-form-item label="培训详情" prop="description">
-                                    <el-input v-model="form.description" :rows="4" type="textarea"
-                                        placeholder="请输入培训详情" />
+                                    <el-input v-model="form.description" :rows="4" type="textarea" placeholder="请输入培训详情" />
                                 </el-form-item>
                             </el-col>
                             <el-col :span="12">
@@ -202,9 +165,7 @@
                             <el-col :span="12">
                                 <el-form-item label="相关文件" prop="attachments">
                                     <div class="d-flex flex-cln mt-10 f-s-12 c-#606266">
-                                        <FileUpload v-model="form.attachments" format="array" :limit="20"
-                                            :fileSize="100">
-                                        </FileUpload>
+                                        <FileUpload v-model="form.attachments" format="array" :limit="20" :fileSize="100"></FileUpload>
                                         <div>此模块报名审核通过后才可查看</div>
                                     </div>
                                 </el-form-item>
@@ -212,15 +173,16 @@
                         </el-row>
                     </div>
                     <div class="pd-16 border-bottom d-flex">
-                    
-                        <div class="w-50% ov-hd">
+                        <div class="w-50% ov-at h-1000">
                             <div class="info-title mb-10">证书信息</div>
                             <div class="d-flex j-start a-c">
                                 <el-form-item label="是否颁发证书" prop="certFlag">
                                     <el-radio-group v-model="form.certFlag">
-                                        <el-radio v-for="item in yes_no" :key="item.value" :label="item.value">{{
+                                        <el-radio v-for="item in yes_no" :key="item.value" :label="item.value">
+                                            {{
                                             item.label
-                                        }}</el-radio>
+                                            }}
+                                        </el-radio>
                                     </el-radio-group>
                                 </el-form-item>
                                 <div v-if="+form.certFlag" class="ml-20">
@@ -229,26 +191,21 @@
                             </div>
                             <template v-if="form.certFlag">
                                 <template v-for="(item, index) in form.certificateInfo" :key="index">
-                                    <el-row :gutter="20" class="bg-#f4f4f4 pd-16 mb-10">
+                                    <el-row :gutter="20" class="bg-#f4f4f4 pd-16 mb-10" >
                                         <el-col :span="10">
-                                            <el-form-item label="证书名称" :prop="`certificateInfo.${index}.certType`"
-                                                :rules="[{ required: true, message: '请选择证书名称', trigger: 'change' }]">
+                                            <el-form-item label="证书名称" :prop="`certificateInfo.${index}.certType`" :rules="[{ required: true, message: '请选择证书名称', trigger: 'change' }]">
                                                 <el-select v-model="item.certType" placeholder="证书名称" clearable>
-                                                    <el-option v-for="item in lm_training_cert" :key="item.value"
-                                                        :label="item.label" :value="item.value" />
+                                                    <el-option v-for="item in lm_training_cert" :key="item.value" :label="item.label" :value="item.value" />
                                                 </el-select>
                                             </el-form-item>
                                         </el-col>
                                         <el-col :span="10">
-                                            <el-form-item :prop="`certificateInfo.${index}.certImg`"
-                                                :rules="[{ required: true, message: '请上传证书图片', trigger: 'change' }]">
+                                            <el-form-item :prop="`certificateInfo.${index}.certImg`" :rules="[{ required: true, message: '请上传证书图片', trigger: 'change' }]">
                                                 <template #label>
                                                     <span>证书模板图片</span>
-                                                    <el-button @click="goEditor()" type="primary"
-                                                        text>去编辑模板图片</el-button>
+                                                    <el-button @click="goEditor()" type="primary" text>去编辑模板图片</el-button>
                                                 </template>
-                                                <ImageUpload v-model="item.certImg" :fileSize="40" :limit="1">
-                                                </ImageUpload>
+                                                <ImageUpload v-model="item.certImg" :fileSize="40" :limit="1"></ImageUpload>
                                             </el-form-item>
                                         </el-col>
                                         <el-col :span="4">
@@ -262,14 +219,10 @@
                         </div>
 
                         <div class="w-50% d-flex flex-cln j-c a-c pl-20">
-                            <el-button type="primary" class="w-100%" plain style="height: 70px; margin-bottom: 20px;"
-                                @click="showSignIn = true">
-                                点击去编辑报名信息></el-button>
+                            <el-button type="primary" class="w-100%" plain style="height: 70px; margin-bottom: 20px;" @click="showSignIn = true">点击去编辑报名信息></el-button>
                             <div class="w-400 h-700 border over-auto">
                                 <div class="pd-10 border bg-#fafafa">
-                                    <div class="pt-10  f-s-20 f-w-6 d-flex j-c a-c flex-cln ">
-                                        报名信息
-                                    </div>
+                                    <div class="pt-10  f-s-20 f-w-6 d-flex j-c a-c flex-cln ">报名信息</div>
                                     <div class="f-s-12 f-w-4 d-flex j-start c-red">此页面为意向人报名时所见页面：</div>
                                 </div>
                                 <template v-for="(item, index) in fixedField" :key="index">
@@ -280,7 +233,7 @@
                                 </template>
                                 <template v-for="(field, index) in fields" :key="index">
                                     <div class="meeting-custom-wrapper" @click.stop="showSignIn = true">
-                                        <MeetingCustom :field="field" style="pointer-events: none" v-if="field" />
+                                        <meetingCustomPreview :field="field" style="pointer-events: none" v-if="field" />
                                     </div>
                                 </template>
                             </div>
@@ -303,7 +256,7 @@ import { useRouter } from 'vue-router';
 import { trainingAdd, trainingDetail, trainingUpdate } from '@/api/training';
 import { FieldDefinition } from '../models/type'
 // 需要添加以下导入
-import MeetingCustom from '../models/meeting-custom.vue'
+import meetingCustomPreview from '../models/meeting-custom-preview.vue'
 import MeetingEditors from '../models/meeting-editors.vue'
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const { lm_training_join_type, yes_no, lm_training_cert, vip_level } = toRefs<any>(proxy?.useDict('lm_training_join_type', 'yes_no', 'lm_training_cert', 'vip_level'));
@@ -442,7 +395,6 @@ const getMeetingDetail = async () => {
 onMounted(() => {
     getMeetingDetail();
 });
-
 </script>
 <style scoped>
 .border {

src/views/training/models/index.ts

@@ -3,4 +3,5 @@ export { default as MeetingDetailInfo } from './meeting-detail-info.vue';
 export { default as MeetingDetailattend } from './meeting-detail-attend.vue';
 export { default as TemporaryRegistration } from './temporary-registration.vue'; // 查看签到码
 export { default as MeetingCustom } from './meeting-custom.vue'; // 查看签到码
-export { default as registrationInfo } from './registration-info.vue'; 
+export { default as registrationInfo } from './registration-info.vue'; 
+export { default as meetingCustomPreview } from './meeting-custom-preview.vue'; 

src/views/training/models/meeting-custom-preview.vue

@@ -0,0 +1,138 @@
+<template>
+    <div class="pd-10 pl-15 border1">
+        <template v-if="field.type === '1' || field.type === '7' || field.type === '10'">
+            <div v-if="field.name.includes('text1-')" prop="label">
+                <el-tag type="info" size="small">单行文本</el-tag>
+                <div class="d-flex flex-cln pb-5 pt-5">
+                    <div class="pb-5 f-s-16 f-w-6 c-#606266"  >{{ field.label }}</div>
+                    <el-input class="pd-5 disabled-input" :placeholder="'请输入'" style="width: 340px; pointer-events: none ;" />
+                </div>
+            </div>
+            <div v-else-if="field.name.includes('text2-')" prop="label">
+                <el-tag type="info" size="small">多行文本</el-tag>
+                <div class="d-flex flex-cln pb-5 pt-5">
+                    <div class="pb-5 f-s-16 f-w-6 c-#606266" >{{ field.label }}</div>
+                    <el-input
+                        class="pd-5 disabled-input"
+                        :placeholder="'请输入'"
+                        style="width: 340px; pointer-events: none ;"
+                        type="textarea"
+                        :autosize="{
+                            minRows: 4, maxRows: 7
+                        }"
+                    />
+                </div>
+            </div>
+            <div v-else-if="field.name.includes('desc1-')" prop="defValue" :rules="[{ required: true, message: '请输入描述', trigger: 'blur' }]">
+                <el-tag type="info" size="small">文本描述</el-tag>
+                <el-input
+                    class="pd-5 no-disabled-input"
+                    v-model="field.defValue"
+                    :placeholder="'请输入'"
+                    type="textarea"
+                    :autosize="{
+                            minRows: 4, maxRows: 7
+                        }"
+                    style="width: 340px;font-weight: 600;"
+                />
+            </div>
+            <div class="d-flex flex-cln" v-else>
+                <div class="pb-5 f-s-16 f-w-6 c-#606266">{{ field.label }}</div>
+                <el-input class="pd-5 disabled-input" :placeholder="'请输入'" style="width: 340px; pointer-events: none ;" />
+            </div>
+        </template>
+        <template v-if="field.type === '4' || field.type === '5'">
+            <div v-if="field.name.includes('rad-')" prop="label" :rules="[{ required: true, message: '请输入标题', trigger: 'blur' }]">
+                <div class="d-flex flex-cln">
+                    <div><el-tag type="info" size="small">单选</el-tag></div>
+                    <div class="pb-5 pt-5 f-s-16 f-w-6 c-#606266">{{ field.label }}</div>
+                </div>
+            </div>
+            <div
+                v-if="field.name.includes('rad-')"
+                v-for="(item, index) in field.options"
+                :key="index"
+                :prop="'options.' + index + '.label'"
+                :rules="{
+                        required: true,
+                        message: '请输入选项内容',
+                        trigger: 'blur',
+                    }"
+            >
+                <div class="pd-1 p-rtv d-flex a-c">
+                    <el-radio-group v-model="field.value" style="pointer-events: none ;">
+                        <el-radio :label="1"><span></span></el-radio>
+                    </el-radio-group>
+                    <div class="f-s-14 f-w-5 c-#606266">{{ item.label }}</div>
+                </div>
+            </div>
+            <div v-if="field.name.includes('che-')" prop="label">
+                <div class="d-flex flex-cln">
+                    <div><el-tag type="info" size="small">多选</el-tag></div>
+                    <div class="pb-5 pt-5 f-s-16 f-w-6 c-#606266">{{ field.label }}</div>
+                </div>
+            </div>
+            <div
+                v-if="field.name.includes('che-')"
+                v-for="(item, index) in field.options"
+                :key="index"
+                :prop="'options.' + index + '.label'"
+                :rules="{
+                        required: true,
+                        message: '请输入选项内容',
+                        trigger: 'blur',
+                    }"
+            >
+                <div class="pd-1 p-rtv d-flex a-c">
+                    <el-checkbox class="pd-5" :label="1" style="pointer-events: none ;"><span></span></el-checkbox>
+                    <div class="f-s-14 f-w-5 c-#606266">{{ item.label }}</div>
+                </div>
+            </div>
+            <div v-if="field.name.includes('sex-')">
+                <div class="pb-5 f-s-16 f-w-6">{{ field.label }}</div>
+                <el-radio-group :disabled="true">
+                    <el-radio value="1" v-for="(item, index) in field.options" :key="index">
+                        {{ item.label}}
+                    </el-radio>
+                </el-radio-group>
+            </div>
+        </template>
+        <template v-if="field.type === '3'">
+            <div class="pb-5 f-w-6 f-s-16">出生日期</div>
+            <el-time-select v-if="field.label == '出生日期'" style="width: 340px" start="08:30" step="00:15" end="18:30" placeholder="请选择出生日期" :disabled="true" />
+        </template>
+        <template v-if="field.type === '6' || field.type === '8' || field.type === '9'">
+            <div prop="label">
+                <div class="d-flex flex-cln">
+                    <div>
+                        <el-tag type="info" class="" size="small" v-if="field.name.includes('pic1-')">图片</el-tag>
+                        <el-tag type="info" size="small" v-else-if="field.name.includes('file1-')">文件</el-tag>
+                        <el-tag type="info" size="small" v-else>图文描述</el-tag>
+                    </div>
+                    <div class="pb-5 f-s-16 f-w-6 c-#606266"  >{{ field.label }}</div>
+                    <el-input ref="titleInput" class="pd-5 no-disabled-input"  v-model="field.label" :placeholder="'请输入标题'" style="width: 340px;font-size: 16px;" clearable " />
+                </div>
+            </div>
+            <ImageUpload v-if="!field.name.includes('pic2')" v-model="field.defValue" :limit="1" isString class="pl-5 noup"></ImageUpload>
+            <div prop="defValue" v-if="field.name.includes('pic2')">
+                <div>
+                    <ImageUpload v-model="field.defValue" :limit="3" isString class="pl-5 up"></ImageUpload>
+                </div>
+            </div>
+            <div class="f-s-12 c-999 pl-5">参会者点击可上传文件/图片</div>
+            <div class="f-s-12 c-999 pl-5">单个图片/文件大小不超过100MB;</div>
+            <div class="f-s-12 c-999 pl-5">支持格式:gif、png、jpg、jpeg、bmp、doc、docx、pdf、xls、xlsx、ppt.pptx、txt、zip、gzip、rar、mp4、mov</div>
+        </template>
+    </div>
+</template>
+<script setup lang="ts">
+const prop = defineProps<{
+    field: any // 使用any简化类型，实际应为FieldDefinition
+}>()
+</script>
+<style scoped>
+
+.border1 {
+    border: 1px solid #f2f2f2;
+    background-color: #fff;
+}</style>

src/views/training/models/meeting-custom.vue

@@ -1,116 +1,140 @@
 <template>
     <div class="pd-10 pl-15 border1">
-        <el-form ref="formRef" label-width="auto" label-position="top" :model="field" :rules="rules"
-            :scroll-to-error="true">
+        <el-form ref="formRef" label-width="auto" label-position="top" :model="field" :rules="rules" :scroll-to-error="true">
             <template v-if="field.type === '1' || field.type === '7' || field.type === '10'">
                 <el-form-item v-if="field.name.includes('text1-')" prop="label">
                     <el-tag type="info" size="small">单行文本</el-tag>
-                    <el-input class="pd-5 no-disabled-input" v-model="field.label" :placeholder="'请输入标题'"
-                        style="width: 340px;font-size: 16px;" clearable />
-                    <el-input class="pd-5 disabled-input" :placeholder="'请输入'"
-                        style="width: 340px; pointer-events: none ;" />
+                    <div class="d-flex flex-cln">
+                        <div class="pb-5 f-s-16 f-w-6 c-#606266" @click="changeShowtitle()" v-show="!showtitle">{{ field.label }}</div>
+                        <el-input ref="titleInput" class="pd-5 no-disabled-input" v-show="showtitle" v-model="field.label" :placeholder="'请输入标题'" style="width: 340px;font-size: 16px;" clearable @blur="showtitle = false" />
+                        <el-input class="pd-5 disabled-input" :placeholder="'请输入'" style="width: 340px; pointer-events: none ;" />
+                    </div>
                 </el-form-item>
                 <el-form-item v-else-if="field.name.includes('text2-')" prop="label">
                     <el-tag type="info" size="small">多行文本</el-tag>
-                    <el-input class="pd-5 no-disabled-input" v-model="field.label" :placeholder="'请输入标题'"
-                        style="width: 340px" />
-                    <el-input class="pd-5 disabled-input" v-model="field.value" :placeholder="'请输入'" type="textarea"
-                        :disabled="true" style="width: 340px; pointer-events: none ;" />
+                    <div class="d-flex flex-cln">
+                        <div class="pb-5 f-s-16 f-w-6 c-#606266" @click="changeShowtitle()" v-show="!showtitle">{{ field.label }}</div>
+                        <el-input ref="titleInput" class="pd-5 no-disabled-input" v-show="showtitle" v-model="field.label" :placeholder="'请输入标题'" style="width: 340px;font-size: 16px;" clearable @blur="showtitle = false" />
+                        <el-input
+                            class="pd-5 disabled-input"
+                            :placeholder="'请输入'"
+                            style="width: 340px; pointer-events: none ;"
+                            type="textarea"
+                            :autosize="{
+                            minRows: 4, maxRows: 7
+                        }"
+                        />
+                    </div>
                 </el-form-item>
-                <el-form-item v-else-if="field.name.includes('desc1-')" prop="defValue"
-                    :rules="[{ required: true, message: '请输入描述', trigger: 'blur' }]">
+                <el-form-item v-else-if="field.name.includes('desc1-')" prop="defValue" :rules="[{ required: true, message: '请输入描述', trigger: 'blur' }]">
                     <el-tag type="info" size="small">文本描述</el-tag>
-                    <el-input class="pd-5" v-model="field.defValue" :placeholder="'请输入'" type="textarea"
-                        style="width: 340px;font-weight: 600;" />
+                    <el-input
+                        class="pd-5 no-disabled-input"
+                        v-model="field.defValue"
+                        :placeholder="'请输入'"
+                        type="textarea"
+                        :autosize="{
+                            minRows: 4, maxRows: 7
+                        }"
+                        style="width: 340px;font-weight: 600;"
+                    />
                 </el-form-item>
                 <div class="d-flex flex-cln" v-else>
-                    <div class="pb-5 f-s-16 f-w-6">{{ field.label }}</div>
-                    <el-input class="pd-5 disabled-input" :placeholder="'请输入'"
-                        style="width: 340px; pointer-events: none ;" />
+                    <div class="pb-5 f-s-16 f-w-6 c-#606266">{{ field.label }}</div>
+                    <el-input class="pd-5 disabled-input" :placeholder="'请输入'" style="width: 340px; pointer-events: none ;" />
                 </div>
             </template>
             <template v-if="field.type === '4' || field.type === '5'">
-                <el-form-item v-if="field.name.includes('rad-')" prop="label"
-                    :rules="[{ required: true, message: '请输入标题', trigger: 'blur' }]">
-                    <el-tag type="info" size="small">单选</el-tag>
-                    <el-input class="pd-5 no-disabled-input" v-model="field.label" :placeholder="'请输入标题'"
-                        style="width: 340px" />
+                <el-form-item v-if="field.name.includes('rad-')" prop="label" :rules="[{ required: true, message: '请输入标题', trigger: 'blur' }]">
+                    <div class="d-flex flex-cln">
+                        <div><el-tag type="info" size="small">单选</el-tag></div>
+                        <div class="pb-5 f-s-16 f-w-6 c-#606266" @click="changeShowtitle()" v-show="!showtitle">{{ field.label }}</div>
+                        <el-input ref="titleInput" class="pd-5 no-disabled-input" v-show="showtitle" v-model="field.label" :placeholder="'请输入标题'" style="width: 340px" @blur="showtitle = false" />
+                    </div>
                 </el-form-item>
-                <el-form-item v-if="field.name.includes('rad-')" v-for="(item, index) in field.options" :key="index"
-                    :prop="'options.' + index + '.label'" :rules="{
+                <el-form-item
+                    v-if="field.name.includes('rad-')"
+                    v-for="(item, index) in field.options"
+                    :key="index"
+                    :prop="'options.' + index + '.label'"
+                    :rules="{
                         required: true,
                         message: '请输入选项内容',
                         trigger: 'blur',
-                    }">
+                    }"
+                >
                     <div class="pd-1 p-rtv">
                         <el-radio-group v-model="field.value" style="pointer-events: none ;">
-                            <el-radio :label="1"> <span></span></el-radio>
+                            <el-radio :label="1"><span></span></el-radio>
                         </el-radio-group>
-                        <el-input type="text" v-model="item.label" style="width: 310px" :placeholder="'请输入选项内容'"
-                            @input="val => { item.label = val; item.value = val; }" />
+                        <el-input type="text" v-model="item.label" style="width: 310px" :placeholder="'请输入选项内容'" @input="val => { item.label = val; item.value = val; }" />
                         <el-icon class="ml-10 delete-btn" color="red" @click="removeOption(index)">
                             <Close />
                         </el-icon>
                     </div>
                 </el-form-item>
-                <el-button v-if="field.name.includes('rad-')" type="primary" plain class="w-100% mt-10"
-                    @click="addOption()">新增选项</el-button>
+                <el-button v-if="field.name.includes('rad-')" type="primary" plain class="w-100% mt-10" @click="addOption()">新增选项</el-button>
                 <el-form-item v-if="field.name.includes('che-')" prop="label">
-                    <el-tag type="info" size="small">多选</el-tag>
-                    <el-input class="pd-5 no-disabled-input" v-model="field.label" :placeholder="'请输入标题'"
-                        style="width: 340px" />
+                    <div class="d-flex flex-cln">
+                        <div><el-tag type="info" size="small">多选</el-tag></div>
+                        <div class="pb-5 f-s-16 f-w-6 c-#606266" @click="changeShowtitle()" v-show="!showtitle">{{ field.label }}</div>
+                        <el-input ref="titleInput" class="pd-5 no-disabled-input" v-show="showtitle" v-model="field.label" :placeholder="'请输入标题'" style="width: 340px" @blur="showtitle = false" />
+                    </div>
                 </el-form-item>
-                <el-form-item v-if="field.name.includes('che-')" v-for="(item, index) in field.options" :key="index"
-                    :prop="'options.' + index + '.label'" :rules="{
+                <el-form-item
+                    v-if="field.name.includes('che-')"
+                    v-for="(item, index) in field.options"
+                    :key="index"
+                    :prop="'options.' + index + '.label'"
+                    :rules="{
                         required: true,
                         message: '请输入选项内容',
                         trigger: 'blur',
-                    }">
+                    }"
+                >
                     <div class="pd-1 p-rtv">
                         <el-checkbox class="pd-5" :label="1" style="pointer-events: none ;"><span></span></el-checkbox>
-                        <el-input type="text" v-model="item.label" style="width: 310px" :placeholder="'请输入选项内容'"
-                            @input="val => { item.label = val; item.value = val; }" />
+                        <el-input type="text" v-model="item.label" style="width: 310px" :placeholder="'请输入选项内容'" @input="val => { item.label = val; item.value = val; }" />
                         <el-icon class="ml-10 delete-btn" color="red" @click="removeOption(index)">
                             <Close />
                         </el-icon>
                     </div>
                 </el-form-item>
-                <el-button v-if="field.name.includes('che-')" type="primary" plain class="w-100% mt-10"
-                    @click="addOption()">新增选项</el-button>
+                <el-button v-if="field.name.includes('che-')" type="primary" plain class="w-100% mt-10" @click="addOption()">新增选项</el-button>
                 <div v-if="field.name.includes('sex-')">
-                    <div class="pb-5">{{ field.label }}</div>
+                    <div class="pb-5 f-s-16 f-w-6">{{ field.label }}</div>
                     <el-radio-group :disabled="true">
-                        <el-radio value="1" v-for="(item, index) in field.options" :key="index">{{ item.label
-                            }}</el-radio>
+                        <el-radio value="1" v-for="(item, index) in field.options" :key="index">
+                            {{ item.label}}
+                        </el-radio>
                     </el-radio-group>
                 </div>
             </template>
             <template v-if="field.type === '3'">
-                <div class="pb-5">出生日期</div>
-                <el-time-select v-if="field.label == '出生日期'" style="width: 340px" start="08:30" step="00:15" end="18:30"
-                    placeholder="请选择出生日期" :disabled="true" />
+                <div class="pb-5 f-w-6 f-s-16">出生日期</div>
+                <el-time-select v-if="field.label == '出生日期'" style="width: 340px" start="08:30" step="00:15" end="18:30" placeholder="请输入" :disabled="true" />
             </template>
             <template v-if="field.type === '6' || field.type === '8' || field.type === '9'">
                 <el-form-item prop="label">
-                    <el-tag type="info" class="" size="small" v-if="field.name.includes('pic1-')">图片</el-tag>
-                    <el-tag type="info" size="small" v-else-if="field.name.includes('file1-')">文件</el-tag>
-                    <el-tag type="info" size="small" v-else>图文描述</el-tag>
-                    <el-input class="pd-5 pl-0 no-disabled-input" v-model="field.label" :placeholder="'请输入内容'"
-                        style="width: 340px" props="label" clearable />
+                    <div class="d-flex flex-cln">
+                        <div>
+                            <el-tag type="info" class="" size="small" v-if="field.name.includes('pic1-')">图片</el-tag>
+                            <el-tag type="info" size="small" v-else-if="field.name.includes('file1-')">文件</el-tag>
+                            <el-tag type="info" size="small" v-else>图文描述</el-tag>
+                        </div>
+                        <div class="pb-5 f-s-16 f-w-6 c-#606266" @click="changeShowtitle()" v-show="!showtitle">{{ field.label }}</div>
+                        <el-input ref="titleInput" class="pd-5 no-disabled-input" v-show="showtitle" v-model="field.label" :placeholder="'请输入标题'" style="width: 340px;font-size: 16px;" clearable @blur="showtitle = false" />
+                    </div>
                 </el-form-item>
-                <ImageUpload v-if="!field.name.includes('pic2')" v-model="field.defValue" :limit="1" isString
-                    class="pl-5 noup">
-                </ImageUpload>
+                <ImageUpload v-if="!field.name.includes('pic2')" v-model="field.defValue" :limit="1" isString class="pl-5 noup"></ImageUpload>
                 <el-form-item prop="defValue" v-if="field.name.includes('pic2')">
                     <div>
-                        <ImageUpload v-model="field.defValue" :limit="3" isString class="pl-5 up">
-                        </ImageUpload>
+                        <ImageUpload v-model="field.defValue" :limit="3" isString class="pl-5 up"></ImageUpload>
                     </div>
                 </el-form-item>
                 <div class="f-s-12 c-999 pl-5">参会者点击可上传文件/图片</div>
                 <div class="f-s-12 c-999 pl-5">单个图片/文件大小不超过100MB;</div>
-                <div class="f-s-12 c-999 pl-5">
-                    支持格式:gif、png、jpg、jpeg、bmp、doc、docx、pdf、xls、xlsx、ppt.pptx、txt、zip、gzip、rar、mp4、mov</div>
+                <div class="f-s-12 c-999 pl-5">支持格式:gif、png、jpg、jpeg、bmp、doc、docx、pdf、xls、xlsx、ppt.pptx、txt、zip、gzip、rar、mp4、mov</div>
             </template>
         </el-form>
     </div>
@@ -132,7 +156,14 @@ const rules = computed(() => {
 const removeOption = (index: number) => {
     prop.field.options.splice(index, 1)
 }
-
+const showtitle = ref(false)
+const titleInput = ref(null)
+const changeShowtitle = ()=>{
+    showtitle.value = true
+  nextTick(() => {
+    titleInput.value.focus()
+  })
+}
 const addOption = () => {
     if (!prop.field.options) {
         prop.field.options = []
@@ -146,7 +177,6 @@ defineExpose({
     formRef,  // 暴露表单引用
     validate: () => formRef.value.validate() // 暴露验证方法
 })
-
 </script>
 
 <style scoped>
@@ -220,7 +250,7 @@ defineExpose({
 }
 
 :deep(.no-disabled-input .el-input__wrapper) {
-    box-shadow: none !important;
+    /* box-shadow: none !important; */
     font-weight: bold !important;
     border-radius: 0;
     border: 1px solid transparent !important;
@@ -229,7 +259,7 @@ defineExpose({
 }
 
 :deep(.no-disabled-input .el-input__wrapper.is-focus) {
-    box-shadow: none !important;
+    /* box-shadow: none !important; */
     border: 1px solid #dcdfe6 !important;
 }
 

src/views/training/models/meeting-detail-attend.vue

@@ -12,13 +12,10 @@
                                 <span v-if="+item.check">
                                     所有
                                     <span class="f-w-6">
-                                        {{ selectDictLabels(vip_level,
-                                    item.vipLevel,
-                                    ',') }}
+                                        {{ selectDictLabels(vip_level,item.vipLevel,',') }}
                                     </span>
                                     参会人数 ≤
-                                    {{ item.total
-                                    }}
+                                    {{ item.total}}
                                 </span>
                             </div>
                         </template>
@@ -44,11 +41,7 @@
         <div class="d-flex mb-16 ">
             <div class="info-title">
                 <span>参会人员信息</span>
-                <span class="f-s-14 c-666">
-                    (提交报名:{{ form?.submitCount || 0 }}人 | 审核通过:{{ form?.joinCount || 0 }}人 | 签到:{{
-                        form?.signCount || 0
-                    }}人 | 领取证书:{{ form?.certCount || 0 }}人)
-                </span>
+                <span class="f-s-14 c-666">(提交报名:{{ form?.submitCount || 0 }}人 | 审核通过:{{ form?.joinCount || 0 }}人 | 签到:{{form?.signCount || 0}}人 | 领取证书:{{ form?.certCount || 0 }}人)</span>
             </div>
         </div>
         <div class="d-flex j-sb">

src/views/training/models/meeting-editors.vue

@@ -218,9 +218,9 @@
                     </template>
                     <VueDraggable ref="el" v-model="fields">
                         <template v-for="(field, index) in fields" :key="index">
-                            <div class="meeting-custom-wrapper" :class="{ 'active-border': activeField === field }" @click="setActive(field)">
+                            <div class="meeting-custom-wrapper" :class="{ 'active-border': activeField === field }" @click="setActive(field)" :ref="el => setFieldRef(el, index)">
                                 <MeetingCustom :field="field" ref="childRef" v-if="field" />
-                                <img class="ml-10 delete-btn" :src="shanchu" @click.stop="removeField(index)" />
+                                <img class="ml-10 delete-btn c-s-p" :src="shanchu" @click.stop="removeField(index)" />
                             </div>
                         </template>
                     </VueDraggable>
@@ -263,15 +263,41 @@ const emit = defineEmits(['update:show', 'close', 'success', 'update:info']);
 const close = () => {
     emit('update:show', false);
     emit('close', false);
+    console.log(props.info);
+    
 };
 const setActive = (field: any) => {
     activeField.value = field;
 };
-const addCustoms = (value) => {
-    const newField = new FieldDefinition(value);
-    fields.value.push(newField);
-    activeField.value = newField; // 自动选中新增字段
-};
+const fieldRefs = ref([])
+
+// 设置字段引用
+const setFieldRef = (el, index) => {
+  if (el) {
+    fieldRefs.value[index] = el
+  }
+}
+
+const addCustoms = async (value) => {
+  const newField = new FieldDefinition(value)
+  fields.value.push(newField)
+  activeField.value = newField
+  console.log(fields.value,'fields.value');
+
+  // 等待DOM更新
+  await nextTick()
+
+  // 获取新增字段的索引
+  const newIndex = fields.value.length - 1
+
+  // 滚动到新增字段位置
+  if (fieldRefs.value[newIndex]) {
+    fieldRefs.value[newIndex].scrollIntoView({
+      behavior: 'smooth',
+      block: 'nearest'
+    })
+  }
+}
 function generateSecureRandomString(length = 8) {
     const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';
     const randomValues = new Uint32Array(length);
@@ -356,12 +382,7 @@ const fixedField = ref<FieldDefinition[]>([
     }
 ]);
 onMounted(() => {
-    // if (localStorage.getItem('RegistrationInformation')) {
-    //     fields.value = JSON.parse(localStorage.getItem('RegistrationInformation'))
-    // } else { console.log(props, '00000');
-    //     fields.value = props.info
-    // }
-    fields.value = props.info;
+    fields.value = JSON.parse(JSON.stringify(props.info));
 });
 watch(
     () => props.show,

src/views/training/models/temporary-registration.vue

@@ -1,6 +1,5 @@
 <template>
-    <vxe-modal v-model="dialogVisible" :title="title" show-zoom resize show-footer destroy-on-close transfer
-        @hide="close" :width="width" :z-index="1002">
+    <vxe-modal v-model="dialogVisible" :title="title" show-zoom resize show-footer destroy-on-close transfer @hide="close" :width="width" :z-index="1002">
         <template #default>
             <div>
                 <div v-if="info" ref="codeImgRef" style="width: 400px; margin: 0 auto;">
@@ -10,8 +9,7 @@
                     <div class="mb-6">培训方式：{{ selectDictLabel(dict.dm_training_join_type, info.joinType) }}</div>
                     <div class="mb-6">联系电话：{{ info?.tel }}</div>
                     <div class="d-flex j-c a-c pd-10">
-                        <vueQr :text="VITE_APP_SHARE_QR_CODE_URL + '/enroll?id=' + info?.id + '&tempJoin=1'" :size="300"
-                            colorDark="orange"></vueQr>
+                        <vueQr :text="VITE_APP_SHARE_QR_CODE_URL + '/enroll?id=' + info?.id + '&tempJoin=1'" :size="300" colorDark="orange"></vueQr>
                     </div>
                 </div>
             </div>