feat:tab切换太快的时候内容不对应

chenyao

22 hours ago 4c390d209b45d516fbe2f7552d26048687c83972

 applications/task-work-order/src/views/orderView/orderDataManage/evaluate/FormDiaLog.vue

@@ -1,56 +1,43 @@
<template>
   <el-dialog
      class="gd-dialog"
      v-model="visible"
      :title="titleEnum[dialogMode]"
      @closed="visible = false"
      destroy-on-close
   >
      <div class="detail-container" v-if="dialogReadonly">
         <el-row>
            <el-col :span="12">
               <div class="label">标题</div>
               <div class="val">{{ formData.title }}</div>
            </el-col>
            <el-col :span="12">
               <div class="label">数据名称</div>
               <div class="val">{{ formData.dataName }}</div>
            </el-col>
            <el-col :span="12">
               <div class="label">提出部门</div>
               <div class="val">{{ formData.proposeDeptName }}</div>
            </el-col>
            <el-col :span="12">
               <div class="label">数据提供部门</div>
               <div class="val">{{ formData.dataProvideDeptName }}</div>
            </el-col>
            <el-col :span="12">
               <div class="label">评分</div>
               <div class="val">{{ formData.score }}</div>
            </el-col>
            <el-col :span="12">
               <div class="label">是否解决</div>
               <div class="val">{{ formData.isResolved === '1' ? '是' : '否' }}</div>
            </el-col>
            <el-col :span="24">
               <div class="label">评价内容</div>
               <div class="val">{{ formData.evaluationContent }}</div>
            </el-col>
         </el-row>
      </div>
   <el-dialog class="gd-dialog" v-model="visible" :title="titleEnum[dialogMode]" @closed="visible = false"
      destroy-on-close :close-on-click-modal="false">
      <el-row class="detail-row-view" v-if="dialogReadonly">
         <el-col :span="12">
            <div class="label">标题</div>
            <div class="val">{{ formData.title }}</div>
         </el-col>
         <el-col :span="12">
            <div class="label">数据名称</div>
            <div class="val">{{ formData.dataName }}</div>
         </el-col>
         <el-col :span="12">
            <div class="label">提出部门</div>
            <div class="val">{{ formData.proposeDeptName }}</div>
         </el-col>
         <el-col :span="12">
            <div class="label">数据提供部门</div>
            <div class="val">{{ formData.dataProvideDeptName }}</div>
         </el-col>
         <el-col :span="12">
            <div class="label">评分</div>
            <div class="val">{{ formData.score }}</div>
         </el-col>
         <el-col :span="12">
            <div class="label">是否解决</div>
            <div class="val">{{ formData.isResolved === '1' ? '是' : '否' }}</div>
         </el-col>
         <el-col :span="24">
            <div class="label">评价内容</div>
            <div class="val">{{ formData.evaluationContent }}</div>
         </el-col>
      </el-row>

      <el-form
         class="gd-dialog-form"
         v-else
         ref="formRef"
         :model="formData"
         :rules="rules"
         :disabled="dialogReadonly"
         label-width="80px"
      <el-form class="gd-dialog-form" v-else ref="formRef" :model="formData" :rules="rules" :disabled="dialogReadonly"
      :label-width="pxToRem(112)"
      >
         <el-row>
            <el-col :span="12">
               <el-form-item label="标题" prop="title">
               <el-form-item label="标题" prop="title" :label-width="pxToRem(80)">
                  <el-input class="gd-input" v-model="formData.title" placeholder="请输入" clearable />
               </el-form-item>
            </el-col>
@@ -60,82 +47,45 @@
               </el-form-item>
            </el-col>
            <el-col :span="12">
               <el-form-item label="提出部门" prop="proposeDeptId">
                  <el-tree-select
                     class="gd-select"
                     popper-class="gd-tree-select-popper"
                     v-model="formData.proposeDeptId"
                     node-key="id"
                     :data="deptTree"
                     :props="treeProps"
                     check-strictly
                     clearable
                  />
               <el-form-item label="提出部门" prop="proposeDeptId" :label-width="pxToRem(80)">
                  <el-tree-select class="gd-select" popper-class="gd-tree-select-popper"
                     v-model="formData.proposeDeptId" node-key="id" :data="deptTree" :props="treeProps"
                     check-strictly clearable />
               </el-form-item>
            </el-col>
            <el-col :span="12">
               <el-form-item label="数据提供部门" prop="dataProvideDeptId">
                  <el-tree-select
                     class="gd-select"
                     popper-class="gd-tree-select-popper"
                     v-model="formData.dataProvideDeptId"
                     node-key="id"
                     :data="deptTree"
                     :props="treeProps"
                     check-strictly
                     clearable
                  />
                  <el-tree-select class="gd-select" popper-class="gd-tree-select-popper"
                     v-model="formData.dataProvideDeptId" node-key="id" :data="deptTree" :props="treeProps"
                     check-strictly clearable />
               </el-form-item>
            </el-col>
            <el-col :span="12">
               <el-form-item label="评分" prop="score">
                  <el-input-number
                     class="gd-input"
                     v-model="formData.score"
                     :min="1"
                     :max="10"
                     placeholder="请输入"
                     controls-position="right"
                  />
               <el-form-item label="评分" prop="score" :label-width="pxToRem(80)">
                  <el-input-number class="gd-input" v-model="formData.score" :min="1" :max="10" placeholder="请输入"
                     controls-position="right" />
               </el-form-item>
            </el-col>
            <el-col :span="12">
               <el-form-item label="是否解决" prop="isResolved">
                  <el-select
                     class="gd-select"
                     popper-class="gd-select-popper"
                     v-model="formData.isResolved"
                     placeholder="请选择"
                     clearable
                  >
                     <el-option v-for="item in isResolvedOptions" :key="item.value" :label="item.label" :value="item.value" />
                  <el-select class="gd-select" popper-class="gd-select-popper" v-model="formData.isResolved"
                     placeholder="请选择" clearable>
                     <el-option v-for="item in isResolvedOptions" :key="item.value" :label="item.label"
                        :value="item.value" />
                  </el-select>
               </el-form-item>
            </el-col>
            <el-col :span="24">
               <el-form-item label="评价内容" prop="evaluationContent">
                  <el-input
                     class="gd-input"
                     v-model="formData.evaluationContent"
                     type="textarea"
                     :rows="4"
                     placeholder="请输入"
                     clearable
                  />
               <el-form-item label="评价内容" prop="evaluationContent" :label-width="pxToRem(80)">
                  <el-input class="gd-input-text" v-model="formData.evaluationContent" type="textarea" :rows="4"
                     placeholder="请输入" clearable />
               </el-form-item>
            </el-col>
         </el-row>
      </el-form>
      <template #footer>
      <template #footer v-if="!dialogReadonly">
         <el-button color="#F2F3F5" @click="visible = false">{{ dialogReadonly ? '关闭' : '取消' }}</el-button>
         <el-button
            class="save-btn"
            color="#4C34FF"
            v-if="!dialogReadonly"
            :loading="submitting"
            :disabled="submitting"
            @click="handleSubmit"
         >
         <el-button class="" color="#4C34FF" :loading="submitting" :disabled="submitting" @click="handleSubmit">
            保存
         </el-button>
      </template>
@@ -150,6 +100,7 @@
   gdDataEvaluationDetailApi,
   gdDataEvaluationSubmitApi,
} from '@/views/orderView/orderDataManage/evaluate/evaluateApi'
import { pxToRem } from '@/utils/rem'

// 初始化表单数据
const initForm = () => ({
@@ -176,17 +127,29 @@
const titleEnum = ref({ edit: '编辑', view: '查看', add: '新增' })

const rules = {
   title: fieldRules(true),
   dataName: fieldRules(true),
   title: fieldRules(true, 50),
   dataName: fieldRules(true, 50),
   proposeDeptId: fieldRules(true),
   dataProvideDeptId: fieldRules(true),
   score: fieldRules(true),
   score: [
      { required: true, message: '请输入', trigger: ['blur', 'change'] },
      {
         validator: (_rule, value, callback) => {
            if (value === '' || value === null || value === undefined) return callback()
            const num = Number(value)
            if (!Number.isFinite(num)) return callback(new Error('请输入数字'))
            if (num > 10) return callback(new Error('最大值为10'))
            return callback()
         },
         trigger: ['blur', 'change'],
      },
   ],
   isResolved: fieldRules(true),
   evaluationContent: fieldRules(true),
   evaluationContent: fieldRules(true, 200),
}

// 提交新增/编辑
async function handleSubmit() {
async function handleSubmit () {
   const isValid = await formRef.value?.validate().catch(() => false)
   if (!isValid) return
   submitting.value = true
@@ -201,14 +164,14 @@
}

// 加载详情
async function loadDetail() {
async function loadDetail () {
   if (!formData.value.id) return
   const res = await gdDataEvaluationDetailApi({ id: formData.value.id })
   formData.value = res?.data?.data ?? {}
}

// 打开弹框
async function open({ mode = 'add', row } = {}) {
async function open ({ mode = 'add', row } = {}) {
   dialogMode.value = mode
   formData.value = dialogMode.value === 'add' ? initForm() : row
   if (dialogMode.value !== 'add') {