feat: 考核管理

src/config/tag.ts

@@ -6,6 +6,14 @@ export const getStateData = (index: number | string) => {
   };
   return stateDataMap[index] || "未定义状态";
 };
+export const getState = (index: number | string) => {
+  const stateDataMap = {
+    0: `进行中`,
+    1: "已完成",
+    2: "草稿"
+  };
+  return stateDataMap[index] || "未定义状态";
+};
 export const getStateType = (index: number | string) => {
   switch (index) {
     case 0:
@@ -14,6 +22,10 @@ export const getStateType = (index: number | string) => {
       return "success";
     case 2:
       return "info";
+    case 3:
+      return "primary";
+    case 4:
+      return "warning";
     default:
       return null; // 为未定义状态设置默认值
   }

src/router/modules/evaluate.ts

@@ -7,6 +7,7 @@ export default {
     icon: "ri:information-line",
     rank: 4
   },
+  component: () => import("@/views/evaluate/children/change/manage.vue"),
   children: [
     {
       path: "/evaluate/children/change",
@@ -45,6 +46,16 @@ export default {
             title: "考核管理",
             showParent: true
           }
+        },
+        {
+          path: "/evaluate/children/change/mould/manageObject",
+          name: "evaluateChangeManageObject",
+          component: () =>
+            import("@/views/evaluate/children/change/mould/manageObject.vue"),
+          meta: {
+            title: "考核对象",
+            showLink: false
+          }
         }
         // {
         //   path: "/evaluate/children/components/newAdd",

src/router/modules/index.ts

@@ -6,6 +6,7 @@ export default {
     icon: "ri:information-line",
     rank: 1
   },
+  component: () => import("@/views/indexDefine/children/define.vue"),
   children: [
     {
       path: "/IndexDefine/index",

src/views/evaluate/children/change/manage.vue

@@ -3,6 +3,10 @@ defineOptions({
   name: "evaluateChangeManage"
 });
 import { useRouter } from "vue-router";
+import { ref } from "vue";
+import addExam from "./manage/addExam.vue";
+const addExamRef = ref();
+const addExamShow = ref(false);
 const router = useRouter();
 const tableData = [
   {
@@ -31,7 +35,11 @@ const tableData = [
   }
 ];
 const newAdd = () => {
-  router.push("/evaluate/children/components/newAdd");
+  addExamRef.value.open();
+};
+const handleRowClick = (row: any) => {
+  router.push({ path: "/evaluate/children/change/mould/manageObject" });
+  console.log(row);
 };
 const setEdit = (row: any) => {};
 const setDelete = (row: any) => {};
@@ -39,6 +47,8 @@ const setDelete = (row: any) => {};
 
 <template>
   <div class="w-[100%]">
+    <!-- 发起考核 -->
+    <addExam ref="addExamRef" v-model="addExamShow" />
     <div class="mb-2 flex gap-2 justify-between flex-wrap">
       <div class="flex mt-2">
         <div class="flex mr-2">
@@ -52,7 +62,12 @@ const setDelete = (row: any) => {};
       </div>
     </div>
     <div class="mt-8">
-      <el-table :data="tableData" style="width: 100%" max-height="250">
+      <el-table
+        :data="tableData"
+        style="width: 100%"
+        max-height="250"
+        @row-click="handleRowClick"
+      >
         <el-table-column prop="address" label="考核名称" width="300" fixed />
         <el-table-column prop="date" label="周期" width="250" />
         <el-table-column prop="name" label="执行期" width="250" />
@@ -75,7 +90,7 @@ const setDelete = (row: any) => {};
               <template #dropdown>
                 <el-dropdown-menu class="setting">
                   <el-dropdown-item @click="setDelete(row)">
-                    删除
+                    <el-text type="danger">删除</el-text>
                   </el-dropdown-item>
                   <el-dropdown-item> 复制 </el-dropdown-item>
                 </el-dropdown-menu>

src/views/evaluate/children/change/manage/addExam.vue

@@ -0,0 +1,241 @@
+<script setup lang="ts">
+import { ref, reactive } from "vue";
+import { ElMessageBox, ElMessage } from "element-plus";
+const dialogVisibleAdd = ref(false);
+const form = reactive({
+  name: "",
+  region: "month",
+  date1: "",
+  date2: "",
+  delivery: false,
+  type: [],
+  resource: "",
+  desc: "",
+  form1: {
+    left: [{ value: "1" }],
+    right: [{ value: "1" }]
+  },
+  form2: {}
+});
+const rules = reactive({
+  name: [
+    { required: true, message: "Please input Activity name", trigger: "blur" }
+  ]
+});
+const formLeftRules = reactive({
+  left: [{ required: true, message: "请选择考核指标", trigger: "blur" }],
+  value: [{ required: true, message: "请选择被考核对象", trigger: "blur" }]
+});
+const formRightRules = reactive({
+  left: [{ required: true, message: "请选择考核指标", trigger: "blur" }],
+  right: [{ required: true, message: "请选择考核模板", trigger: "blur" }]
+});
+const handleClose = () => {
+  ElMessageBox.confirm("确认关闭弹窗吗？")
+    .then(() => {
+      dialogVisibleAdd.value = !dialogVisibleAdd.value;
+      ElMessage({
+        message: "已关闭"
+      });
+    })
+    .catch(() => {
+      // catch error
+    });
+};
+// 添加部门保存
+const saveDepartment = () => {
+  dialogVisibleAdd.value = false;
+  ElMessage({
+    message: "添加成功",
+    type: "success"
+  });
+};
+const open = (item: any) => {
+  dialogVisibleAdd.value = true;
+};
+const addNew = () => {
+  form.form1.right.push({ value: "" });
+  form.form1.left.push({ value: "" });
+};
+const deleteItem = (index: any) => {
+  form.form1.left.splice(index, 1);
+  form.form1.right.splice(index, 1);
+};
+// 单选
+const timeType = ref<any>("month");
+const format = ref<any>("YYYY-MM");
+const handleRegionChange = (value: any) => {
+  console.log(value);
+  form.date1 = "";
+  timeType.value = value;
+  switch (value) {
+    case "year":
+      format.value = "YYYY";
+      break;
+    case "quarter":
+      format.value = "YYYY-Q";
+      break;
+    case "month":
+      format.value = "YYYY-MM";
+      break;
+    case "date":
+      format.value = "YYYY-MM-DD";
+  }
+};
+function getQuarter(month) {
+  const monthIndex = parseInt(month) - 1; // 转换为 0 开头的索引
+  return Math.floor(monthIndex / 3) + 1; // 计算季度
+}
+const monthTime = ref("");
+defineExpose({
+  open
+});
+</script>
+
+<template>
+  <div>
+    <el-dialog
+      v-model="dialogVisibleAdd"
+      title="发起考核"
+      width="500"
+      :before-close="handleClose"
+    >
+      <!-- <el-date-picker v-model="monthTime" type="month" placeholder="P">
+        <template #default="{ cell }">
+          {{ console.log("cell", cell) }}
+          <div class="el-date-table-cell" :class="{ current: cell.isCurrent }">
+            <span class="el-date-table-cell__text"
+              >{{ cell.text + 1 }}yyyy</span
+            >
+          </div>
+        </template>
+      </el-date-picker> -->
+      <el-form
+        :model="form"
+        label-width="auto"
+        style="max-width: 600px"
+        :rules="rules"
+        label-position="top"
+      >
+        <el-form-item label="考核名称" prop="name">
+          <el-input placeholder="请输入" />
+        </el-form-item>
+        <el-form-item label="考核周期">
+          <!-- <el-radio-group v-model="radio1"> -->
+          <el-radio-group v-model="form.region" @change="handleRegionChange">
+            <el-radio value="month" size="large">月度</el-radio>
+            <el-radio value="quarter" size="large">季度</el-radio>
+            <el-radio value="3" size="large">半年</el-radio>
+            <el-radio value="year" size="large">年度</el-radio>
+            <el-radio value="date" size="large">日期</el-radio>
+          </el-radio-group>
+          <el-date-picker
+            v-if="timeType === 'date'"
+            v-model="form.date1"
+            type="daterange"
+            range-separator="至"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+          />
+          <el-date-picker
+            v-else
+            v-model="form.date1"
+            :type="timeType"
+            placeholder="请选择日期"
+            :format="format"
+          />
+          <!-- </el-date-picker> -->
+        </el-form-item>
+        <el-form-item label="被考核类型">
+          <el-select
+            v-model="form.region"
+            placeholder="please select your zone"
+          >
+            <el-option label="Zone one" value="shanghai" />
+            <el-option label="Zone two" value="beijing" />
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          label="被考核对象与模板设置"
+          prop="form1"
+          label-position="top"
+        >
+          <div class="w-full flex">
+            <div class="w-1/3">
+              <el-form
+                label-position="top"
+                :model="form.form1"
+                :rules="formLeftRules"
+              >
+                <el-form-item label="被考核对象" prop="left">
+                  <div
+                    v-for="(item, index) in form.form1.left"
+                    :key="index"
+                    class="w-full mt-1"
+                  >
+                    <el-select
+                      v-model="item.value"
+                      placeholder="please select your zone"
+                      style="width: 180px"
+                    >
+                      <el-option label="Zone one" value="shanghai" />
+                      <el-option label="Zone two" value="beijing" />
+                    </el-select>
+                  </div>
+                </el-form-item>
+              </el-form>
+            </div>
+            <div class="w-1/2 ml-7">
+              <el-form
+                label-position="top"
+                :model="form.form1"
+                :rules="formRightRules"
+              >
+                <el-form-item label="考核模板" prop="right">
+                  <div
+                    v-for="(item, index) in form.form1.right"
+                    :key="index"
+                    class="w-full flex mt-1"
+                  >
+                    <el-select
+                      v-model="item.value"
+                      placeholder="please select your zone"
+                      style="width: 180px"
+                    >
+                      <el-option label="Zone one" value="shanghai" />
+                      <el-option label="Zone two" value="beijing" />
+                    </el-select>
+                    <div
+                      v-if="index !== 0"
+                      class="ml-7 cursor-pointer w-1"
+                      @click="deleteItem(index)"
+                    >
+                      <el-text type="danger">
+                        <el-icon><Delete /></el-icon>
+                      </el-text>
+                    </div>
+                  </div>
+                </el-form-item>
+              </el-form>
+            </div>
+          </div>
+        </el-form-item>
+        <el-form-item>
+          <template #label>
+            <div class="cursor-pointer w-14" @click="addNew">
+              <el-text type="primary">
+                <el-icon><Plus /></el-icon>添加
+              </el-text>
+            </div>
+          </template>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="handleClose">取消</el-button>
+          <el-button type="primary" @click="saveDepartment"> 确认 </el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>

src/views/evaluate/children/change/mould/manageObject.vue

@@ -0,0 +1,145 @@
+<script setup lang="ts">
+defineOptions({
+  name: "evaluateChangeManageObject"
+});
+import { getState, getStateType } from "@/config/tag";
+import { ref } from "vue";
+const activeName = ref("first");
+const tableData = [
+  {
+    date: "2016-05-03",
+    name: "Tom",
+    address: "No. 189, Grove St, Los Angeles",
+    show: false
+  },
+  {
+    date: "2016-05-02",
+    name: "Tom",
+    address: "No. 189, Grove St, Los Angeles",
+    show: false
+  },
+  {
+    date: "2016-05-04",
+    name: "Tom",
+    address: "No. 189, Grove St, Los Angeles",
+    show: false
+  },
+  {
+    date: "2016-05-01",
+    name: "Tom",
+    address: "No. 189, Grove St, Los Angeles",
+    show: false
+  }
+];
+const setEdit = (row: any) => {};
+const setDelete = (row: any) => {};
+</script>
+
+<template>
+  <div class="w-full">
+    <div class="w-full flex items-center justify-between">
+      <div class="flex items-center justify-between mt-2">
+        <div class="bg-icon">
+          <div>
+            <el-icon><Tickets /></el-icon>
+          </div>
+        </div>
+        <div>
+          <div class="flex items-center justify-between">
+            <h5>恩泽医院外科片区评估</h5>
+            <el-tag class="ml-2" :type="getStateType(0)">
+              {{ getState(0) }}
+            </el-tag>
+          </div>
+          <el-text type="info" class="text-xs">2023/01/01-2016/05/01</el-text>
+        </div>
+      </div>
+      <div class="mr-10">
+        <el-button type="primary">公布考核结果</el-button>
+      </div>
+    </div>
+    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
+      <el-tab-pane label="考核对象" name="first">
+        <div class="w-full flex items-center justify-between">
+          <div class="w-1/2 flex items-center justify-between">
+            <el-text class="w-1/5">考核模板</el-text>
+            <el-input class="ml-1" />
+            <el-input class="ml-2" />
+          </div>
+          <div class="mr-10">
+            <el-button type="primary" plain>批量调整执行人</el-button>
+            <el-button type="primary" plain>批量重置流程</el-button>
+            <el-button type="primary" plain>批量删除</el-button>
+            <el-button type="primary" plain>添加被考核人</el-button>
+          </div>
+        </div>
+        <el-table
+          :data="tableData"
+          style="width: 100%"
+          max-height="250"
+          @row-click="handleRowClick"
+        >
+          <el-table-column type="selection" width="55" />
+          <el-table-column prop="address" label="考核名称" width="300" fixed />
+          <el-table-column prop="date" label="周期" width="250" />
+          <el-table-column prop="name" label="执行期" width="250" />
+          <el-table-column prop="name" label="考核模板" width="300" />
+          <el-table-column prop="name" label="状态" width="150" />
+          <el-table-column prop="name" label="创建人" width="150" />
+          <el-table-column prop="name" label="更新时间" width="150" />
+          <el-table-column label="操作" width="200" fixed="right">
+            <template #default="{ row }">
+              <!-- <el-button link :icon="Edit" /> -->
+              <el-dropdown trigger="click">
+                <span class="el-dropdown-link navbar-bg-hover select-none">
+                  <el-icon @click="setEdit(row)"><Edit /></el-icon>
+                </span>
+              </el-dropdown>
+              <el-dropdown class="ml-2" trigger="click">
+                <span class="el-dropdown-link navbar-bg-hover select-none">
+                  <el-icon><More /></el-icon>
+                </span>
+                <template #dropdown>
+                  <el-dropdown-menu class="setting">
+                    <el-dropdown-item @click="setDelete(row)">
+                      <el-text type="danger">删除</el-text>
+                    </el-dropdown-item>
+                    <el-dropdown-item> 复制 </el-dropdown-item>
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-tab-pane>
+      <el-tab-pane label="考核指标" name="second">Config</el-tab-pane>
+      <el-tab-pane label="统计分析" name="third">Role</el-tab-pane>
+      <el-tab-pane label="基础信息" name="fourth">Task</el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.bg-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 45px;
+  height: 45px;
+  margin-right: 5px;
+  background: #00a870;
+  border-radius: 5px;
+
+  div {
+    // border: 1px solid red;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 60%;
+    height: 60%;
+    color: #00a870;
+    background: #fff;
+    border-radius: 2px;
+  }
+}
+</style>