Newer
Older
adminAccountabilityFront / src / views / result / dept / components / detail.vue
wangxitong on 26 Sep 2023 7 KB 问效考核结果&指标态势分析
<script lang="ts" setup name="deptDetail">
import type { FormInstance, FormRules, UploadUserFile } from 'element-plus'
import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
import deptTable from './deptTable.vue'
import { getDetail } from '@/api/home/result/dept'
import { ProxyList } from '@/api/home/rule/programme'
const $route = useRoute()
const $router = useRouter()
// 对话框类型:create,update
const dialogStatus = ref('create')
// 显示标题
const textMap: { [key: string]: string } = {
  update: '编辑',
  create: '新增',
  detail: '详情',
}
// 表单对象
const ruleForm = ref({
  assNo: '',
  assObject: '',
  assObjectName: '',
  assStatus: '',
  assStatusName: '',
  assessedDept: '',
  ruleDescription: '',
  assessedDeptName: '',
  cycle: '',
  cycleName: '',
  endTime: '',
  id: '',
  planId: '',
  planName: '',
  recoRating: '',
  recoRatingName: '',
  reportStatus: '',
  reportStatusName: '',
  reportTime: '',
  score: '',
  startTime: '',
  submitTime: '',
  timeFmt: '',
  typeScore1: '',
  typeScore2: '',
  typeScore3: '',
  typeScore4: '',
  updateTime: '',
})
const proxyList = ref([])
// 表单验证规则
const rules = ref<FormRules>({
})
// 表单实例对象
const ruleFormRef = ref()
// 一级考核指标实例对象
const deptRef = ref()

const radio = ref('基本信息')

// 获取方案指标列表
const fetchProxyList = () => {
  // if ($route.path.includes('create')) {
  //   return
  // }
  ProxyList({ planId: ruleForm.value.id, limit: 9999, offset: 1 }).then((res) => {
    proxyList.value = res.data.rows
  })
}

onMounted(() => {
  dialogStatus.value = $route.params.type as string
  getDetail({ id: $route.query.id }).then((res) => {
    ruleForm.value = res.data
    fetchProxyList()
  })
})
</script>

<template>
  <app-container style="overflow: hidden;">
    <detail-page class="base-info-device" :title="`考核结果-${textMap[dialogStatus]}`">
      <template #btns>
        <el-button type="info" @click="$router.go(-1)">
          关闭
        </el-button>
      </template>
    </detail-page>
    <detail-block-com>
      <el-radio-group v-model="radio">
        <el-radio-button label="基本信息" />
        <el-radio-button label="一级考核指标" />
      </el-radio-group>
    </detail-block-com>
    <!-- 基本信息 -->
    <detail-block-com v-show="radio === '基本信息'">
      <el-form
        ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="210px" class="form"
        :class="[$route.path.includes('detail') ? 'isDetail' : '']" :disabled="$route.path.includes('detail')"
      >
        <el-row :gutter="24" class="marg">
          <el-col :span="12">
            <el-form-item label="考核结果编号">
              <el-input v-model.trim="ruleForm.assNo" placeholder="考核结果编号" style="width: 100%;" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="考核方案名称">
              <el-input v-model.trim="ruleForm.planName" placeholder="考核方案名称" style="width: 100%;" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="考核对象名称">
              <el-input v-model.trim="ruleForm.assObjectName" placeholder="考核对象名称" style="width: 100%;" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="考核对象">
              <el-input v-model.trim="ruleForm.assObject" placeholder="考核对象" style="width: 100%;" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="考核周期">
              <el-input v-model.trim="ruleForm.cycleName" placeholder="考核周期(年)" style="width: 100%;" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="考核等级评定">
              <el-input v-model.trim="ruleForm.recoRatingName" placeholder="考核等级评定" style="width: 100%;" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="考核得分">
              <el-input v-model.trim="ruleForm.score" placeholder="考核得分" style="width: 100%;" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="考核得分计算规则">
              <el-input v-model.trim="ruleForm.ruleDescription" placeholder="考核得分计算规则" style="width: 100%;" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="服务高质量跨越式发展成效得分">
              <el-input v-model.trim="ruleForm.typeScore1" placeholder="服务高质量跨越式发展成效得分" style="width: 100%;" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="加强党的建设成效得分">
              <el-input v-model.trim="ruleForm.typeScore2" placeholder="加强党的建设成效得分" style="width: 100%;" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="满意度评价得分">
              <el-input v-model.trim="ruleForm.typeScore3" placeholder="满意度评价得分" style="width: 100%;" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="服务高质量跨越式发展成效加减分项指标得分">
              <el-input v-model.trim="ruleForm.typeScore4" placeholder="考核得分" style="width: 100%;" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="填报状态">
              <el-input v-model.trim="ruleForm.reportStatusName" placeholder="填报状态" style="width: 100%;" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="考核状态">
              <el-input v-model.trim="ruleForm.assStatusName" placeholder="考核状态" style="width: 100%;" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24" class="marg">
          <el-col :span="12">
            <el-form-item label="考核填报发送日期" prop="startTime">
              <el-date-picker
                v-model="ruleForm.startTime"
                style="width: 100%;" type="datetime" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
                placeholder="考核填报发送日期"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="考核填报截至日期" prop="endTime">
              <el-date-picker
                v-model="ruleForm.endTime"
                style="width: 100%;" type="datetime" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
                placeholder="考核填报截至日期"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </detail-block-com>
    <!-- 一级考核指标 -->
    <dept-table v-show="radio === '一级考核指标'" ref="deptRef" :data="proxyList" />
  </app-container>
</template>

<style lang="scss" scoped>
.isDetail {
  ::v-deep {
    .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap > .el-form-item__label::before,
    .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label::before {
      content: "";
      display: none;
    }
  }
}
</style>