Newer
Older
xc-business-system / src / views / quality / meeting / components / edit.vue
liyaguang on 20 Oct 2023 6 KB feat(*): 会议记录页面
<!-- 会议记录编辑页面 -->
<script name="MeetingHandler" lang="ts" setup>
import type { FormInstance, FormRules, UploadUserFile } from 'element-plus'
import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
import dayjs from 'dayjs'
import useUserStore from '@/store/modules/user'
const $route = useRoute()
const $router = useRouter()
const userStore = useUserStore()
const ruleFormRef = ref<FormInstance>() // from组件
const dialogStatus = ref('create')
const ruleForm = ref({
  flag: '',
  user: '',
  name: '',
  time: '',
  contentList: [],
}) // 表单
const rules = ref<FormRules>({
  name: [{ required: true, message: '模板名称必填', trigger: ['blur', 'change'] }],
}) // 表单验证规则
const contentList = ref([])
onMounted(() => {
  contentList.value = ruleForm.value.contentList
  // 获取当前用户信息
  ruleForm.value.time = dayjs().format('YYYY-MM-DD HH:mm') // 创建时间
  // ruleForm.value.createUserId = userStore.id
  ruleForm.value.user = userStore.name
})
// 保存
const tableRef = ref() // 模板内容管理组件
const saveForm = async (formEl: FormInstance | undefined) => {
  if (!formEl) { return }
  await formEl.validate((valid, fields) => {
    if (valid && tableRef.value.checkCertificateList()) {
      // if (!tableRef.value.list.length) {
      //   ElMessage.warning('模板内容管理必填')
      //   return
      // }
      ElMessageBox.confirm(
        '确认保存吗?',
        '提示',
        {
          confirmButtonText: '确认',
          cancelButtonText: '取消',
          type: 'warning',
        },
      )
    }
  })
}
</script>

<template>
  <app-container style="overflow: hidden;">
    <detail-page title="会议记录">
      <template #btns>
        <el-button type="primary" @click="saveForm(ruleFormRef)">
          发送与会人员确认
        </el-button>
        <el-button type="primary" @click="saveForm(ruleFormRef)">
          保存
        </el-button>
        <el-button type="info" @click="() => $router.go(-1)">
          关闭
        </el-button>
      </template>
    </detail-page>
    <detail-block title="">
      <el-form ref="ruleFormRef" :model="ruleForm" :class="$route.path.includes('detail') ? 'isDetail' : ''" :rules="rules" label-position="right" label-width="120px" class="form" :disabled="$route.path.includes('detail')">
        <el-row :gutter="24" class="marg">
          <el-col :span="6">
            <el-form-item label="文件编号" prop="fileNo">
              <el-input v-model.trim="ruleForm.flag" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="文件名称" prop="name">
              <el-input v-model.trim="ruleForm.name" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="记录人" prop="fileNo">
              <el-input v-model.trim="ruleForm.user" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="记录时间" prop="fileNo">
              <!-- <el-input v-model.trim="ruleForm.time" disabled /> -->
              <!-- <el-input v-model.trim="ruleForm.time" disabled /> -->
              <el-date-picker
                v-model="ruleForm.time"
                type="datetime"
                placeholder="记录时间"
                value-format="YYYY-MM-DD HH:mm"
                format="YYYY-MM-DD HH:mm"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24" class="marg">
          <el-col :span="6">
            <el-form-item label="关联工作类别" prop="fileNo">
              <el-select
                v-model="ruleForm.storageLocation"
                placeholder="关联工作类别"
                class="short-input"
                filterable
                style="width: 100%;"
              >
                <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="关联工作" prop="fileNo">
              <el-select
                v-model="ruleForm.storageLocation"
                placeholder="关联工作"
                class="short-input"
                filterable
                style="width: 100%;"
              >
                <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </detail-block>
    <detail-block title="">
      <el-form :model="ruleForm" :class="$route.path.includes('detail') ? 'isDetail' : ''" :rules="rules" label-position="right" label-width="120px" class="form" :disabled="$route.path.includes('detail')">
        <el-row :gutter="24" class="marg">
          <el-col :span="24">
            <el-form-item label="会议时间" prop="fileNo">
              <el-input v-model.trim="ruleForm.a" :rows="3" type="textarea" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24" class="marg">
          <el-col :span="24">
            <el-form-item label="会议地点" prop="fileNo">
              <el-input v-model.trim="ruleForm.a" :rows="3" type="textarea" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24" class="marg">
          <el-col :span="24">
            <el-form-item label="参会人员" prop="fileNo">
              <el-button type="primary">
                选择人员
              </el-button>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24" class="marg">
          <el-col :span="24">
            <el-form-item label="" prop="fileNo">
              <el-input v-model.trim="ruleForm.a" :rows="3" type="textarea" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24" class="marg">
          <el-col :span="24">
            <el-form-item label="会议内容" prop="fileNo">
              <el-input v-model.trim="ruleForm.a" :rows="8" type="textarea" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </detail-block>
  </app-container>
</template>