feat: 考核管理

src/config/tag.ts

@@ -0,0 +1,20 @@
+export const getStateData = (index: number | string) => {
+  const stateDataMap = {
+    0: `草稿`,
+    1: "已上架",
+    2: "已下架"
+  };
+  return stateDataMap[index] || "未定义状态";
+};
+export const getStateType = (index: number | string) => {
+  switch (index) {
+    case 0:
+      return "danger";
+    case 1:
+      return "success";
+    case 2:
+      return "info";
+    default:
+      return null; // 为未定义状态设置默认值
+  }
+};

src/views/evaluate/children/change/components/editMould.vue

@@ -65,36 +65,39 @@ const radio1 = ref("1");
               </el-radio-group>
             </el-form-item>
             <el-form-item label="指标显示字段设置" label-position="top">
-              <div>
-                <el-text type="info">指标说明</el-text>
-                <el-switch class="ml-2" />
-              </div>
-              <br />
-              <div>
-                <el-text type="info">评价标准</el-text>
-                <el-switch class="ml-2" />
-              </div>
-              <br />
-              <div>
-                <el-text type="info">数据来源</el-text>
-                <el-switch class="ml-2" />
-              </div>
-              <div>
-                <el-text type="info">目标值</el-text>
-                <el-switch class="ml-2" />
-              </div>
-              <div>
-                <el-text type="info">完成值</el-text>
-                <el-switch class="ml-2" />
-              </div>
-              <div>
-                <el-text type="info">挑战值</el-text>
-                <el-switch class="ml-2" />
-              </div>
-              <div>
-                <el-text type="info">门栏值</el-text>
-                <el-switch class="ml-2" />
-              </div>
+              <!-- <template #default="{ row }"> -->
+              <template #default>
+                <div>
+                  <div>
+                    <el-text type="info">指标说明</el-text>
+                    <el-switch class="ml-2" />
+                  </div>
+                  <div>
+                    <el-text type="info">评价标准</el-text>
+                    <el-switch class="ml-2" />
+                  </div>
+                  <div>
+                    <el-text type="info">数据来源</el-text>
+                    <el-switch class="ml-2" />
+                  </div>
+                  <div class="ml-3">
+                    <el-text type="info">目标值</el-text>
+                    <el-switch class="ml-2" />
+                  </div>
+                  <div class="ml-3">
+                    <el-text type="info">完成值</el-text>
+                    <el-switch class="ml-2" />
+                  </div>
+                  <div class="ml-3">
+                    <el-text type="info">挑战值</el-text>
+                    <el-switch class="ml-2" />
+                  </div>
+                  <div class="ml-3">
+                    <el-text type="info">门栏值</el-text>
+                    <el-switch class="ml-2" />
+                  </div>
+                </div>
+              </template>
             </el-form-item>
           </el-form>
         </div>

src/views/evaluate/children/change/components/importIndex.vue

@@ -0,0 +1,143 @@
+<script setup lang="ts">
+import { ref, reactive, computed } from "vue";
+import { ElMessageBox, ElMessage, ElTable } from "element-plus";
+import { Search } from "@element-plus/icons-vue";
+import { textSpanOverlapsWith } from "typescript";
+import { getStateData, getStateType } from "@/config/tag";
+const dialogVisibleAdd = ref(false);
+const handleClose = () => {
+  ElMessageBox.confirm("确认关闭弹窗吗？")
+    .then(() => {
+      dialogVisibleAdd.value = !dialogVisibleAdd.value;
+      ElMessage({
+        message: "已关闭"
+      });
+    })
+    .catch(() => {
+      // catch error
+    });
+};
+const tableData = [
+  {
+    date: "2016-05-04",
+    name: "Aleyna Kutzner",
+    address: "Lohrbergstr",
+    index: 1
+  },
+  {
+    date: "2016-05-03",
+    name: "Helen Jacobi",
+    address: "760 A St",
+    index: 2
+  },
+  {
+    date: "2016-05-02",
+    name: "Brandon Deckert",
+    address: "Arnold-O",
+    index: 0
+  },
+  {
+    date: "2016-05-01",
+    name: "Margie Smith",
+    address: "23618 ",
+    index: 0
+  }
+];
+// 添加部门保存
+const saveDepartment = () => {
+  ElMessageBox.confirm("不保存，更新的信息将会丢失", "需要保存吗？", {
+    type: "warning"
+  })
+    .then(() => {
+      dialogVisibleAdd.value = false;
+      ElMessage({
+        message: "已保存",
+        type: "success"
+      });
+    })
+    .catch(() => {
+      // catch error
+    });
+};
+const open = () => {
+  dialogVisibleAdd.value = true;
+};
+// 选中
+const selectedNums = ref(0);
+const handleSelectionChange = selectedRows => {
+  // this.selectedRows = selectedRows;
+  selectedNums.value = selectedRows.length;
+  console.log("选中的行:", selectedRows);
+};
+defineExpose({
+  open
+});
+</script>
+
+<template>
+  <div>
+    <el-dialog
+      v-model="dialogVisibleAdd"
+      title="添加成员"
+      width="600"
+      :before-close="handleClose"
+    >
+      <div class="w-full flex justify-between items-center">
+        <div><el-text>指标分类</el-text></div>
+        <div><el-input placeholder="请输入" :prefix-icon="Search" /></div>
+      </div>
+      <el-table
+        :data="tableData"
+        style="width: 100%"
+        @selection-change="handleSelectionChange"
+      >
+        <el-table-column type="selection" width="55" />
+        <el-table-column label="指标名称">
+          <template #default="scope">{{ scope.row.date }}</template>
+        </el-table-column>
+        <el-table-column property="name" label="指标分类" width="100" />
+        <el-table-column
+          property="address"
+          label="状态"
+          width="100"
+          show-overflow-tooltip
+        >
+          <template #default="scope">
+            <el-tag :type="getStateType(scope.row.index)">
+              {{ getStateData(scope.row.index) }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column property="address" label="数据来源" width="120" />
+      </el-table>
+      <div class="w-full flex justify-evenly items-center">
+        <div class="mt-5"><el-text>共111项数据</el-text></div>
+        <div class="ml-10">
+          <el-pagination
+            size="small"
+            background
+            layout="prev, pager, next"
+            :total="50"
+            class="mt-4"
+          />
+        </div>
+      </div>
+      <template #footer>
+        <div class="dialog-footer w-full flex justify-between mt-4">
+          <div>
+            <el-text>已选择</el-text>
+            <el-text type="primary">
+              {{ selectedNums }}
+            </el-text>
+            <el-text>项</el-text>
+          </div>
+
+          <div>
+            <el-button @click="handleClose">取消</el-button>
+            <el-button type="primary" @click="saveDepartment"> 确认 </el-button>
+          </div>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>

src/views/evaluate/children/change/components/newAdd.vue

@@ -7,17 +7,26 @@ import { useRouter } from "vue-router";
 import { Edit } from "@element-plus/icons-vue";
 import { ElMessageBox, ElMessage } from "element-plus";
 import editMould from "./editMould.vue";
+import settingIndexDrawer from "./settingIndexDrawer.vue";
+import importIndex from "./importIndex.vue";
 const router = useRouter();
+const formRef = ref();
 const active = ref(0);
 const editDrawer = ref();
 const editDrawerShow = ref(false);
+// 指标设置
+const settingIndexDrawerRef = ref();
+const settingIndexDrawerShow = ref(false);
+// 导入指标
+const importIndexRef = ref();
+const importIndexShow = ref(false);
 const handleSelect = index => {
   // console.log(index);
   active.value = index;
 };
 const tepName = ref();
 const tepNameForm = reactive({
-  name: "张三"
+  name: ""
 });
 const backChange = () => {
   router.back();
@@ -80,11 +89,43 @@ const tableData = ref([
     zip: "CA 90036"
   }
 ]);
-const save = () => {
-  if (active.value++ > 2) active.value = 0;
+const save = formEl => {
+  console.log(formEl);
+  formEl.validate(valid => {
+    console.log(valid);
+    if (valid) {
+      console.log("submit!");
+    } else {
+      console.log("error submit!");
+    }
+  });
+  if (active.value++ > 2) {
+    active.value = 0;
+  }
 };
 const deleteRow = row => {
   console.log(row);
+  ElMessageBox.confirm(
+    "指标删除后不可恢复，请谨慎操作！",
+    "确定删除该指标吗？",
+    {
+      confirmButtonText: "确认",
+      cancelButtonText: "取消",
+      type: "warning"
+    }
+  )
+    .then(() => {
+      ElMessage({
+        type: "success",
+        message: "删除成功"
+      });
+    })
+    .catch(() => {
+      ElMessage({
+        type: "info",
+        message: "用户取消"
+      });
+    });
 };
 // 编辑
 const editPen = row => {
@@ -114,10 +155,26 @@ const deletePen = row => {
       });
     });
 };
+const settingIndex = row => {
+  console.log(row);
+  settingIndexDrawerRef.value.open();
+};
+const importIndexDialog = row => {
+  console.log(row);
+  importIndexRef.value.open();
+};
 </script>
 
 <template>
   <div class="w-[100%]">
+    <!-- 导入指标 -->
+    <importIndex ref="importIndexRef" v-model="importIndexShow" />
+    <!-- 指标设置 -->
+    <settingIndexDrawer
+      ref="settingIndexDrawerRef"
+      v-model:drawerValue="settingIndexDrawerShow"
+    />
+    <!-- 编辑模块 -->
     <editMould ref="editDrawer" v-model:drawerValue="editDrawerShow" />
     <div class="w-[100%] flex justify-evenly">
       <div class="left-box">
@@ -149,19 +206,22 @@ const deletePen = row => {
         </el-steps>
       </div>
       <div class="right-box">
-        <el-button type="primary" class="mr-2" @click="save">保存</el-button>
+        <el-button type="primary" class="mr-2" @click="save(formRef)"
+          >保存</el-button
+        >
       </div>
     </div>
     <div class="mt-2">
       <div v-if="active == 0" class="w-[40%] m-auto mt-10">
         <el-form
+          ref="formRef"
           :model="tepNameForm"
           label-width="auto"
           style="max-width: 600px"
         >
           <el-form-item
-            label="模板名称"
             prop="name"
+            label="模板名称"
             :rules="[
               {
                 required: true,
@@ -202,16 +262,20 @@ const deletePen = row => {
             <el-table-column prop="zip" label="目标值" width="120" />
             <el-table-column fixed="right" label="操作">
               <template #default="{ row }">
-                <el-icon class="mr-3"><Setting /></el-icon>
-                <el-icon @click="deleteRow(row)"
-                  ><Delete class="text-red-500"
+                <el-icon class="mr-3" @click="settingIndex(row)"
+                  ><Setting
                 /></el-icon>
+                <el-icon @click="deleteRow(row)">
+                  <Delete class="text-red-500" />
+                </el-icon>
               </template>
             </el-table-column>
           </el-table>
           <template #footer>
             <el-button type="primary" link class="mr-4"> 添加指标 </el-button>
-            <el-button type="primary" link> 导入指标 </el-button>
+            <el-button type="primary" link @click="importIndexDialog">
+              导入指标
+            </el-button>
           </template>
         </el-card>
       </div>

src/views/evaluate/children/change/components/settingIndexDrawer.vue

@@ -0,0 +1,81 @@
+<script setup lang="ts">
+import { ref, reactive } from "vue";
+import { ElMessageBox, ElMessage } from "element-plus";
+import type { DrawerProps, FormItemProps, FormProps } from "element-plus";
+// const itemLabelPosition = ref<FormItemProps["labelPosition"]>("");
+const drawer = ref(false);
+const disabledValue = ref(true);
+const direction = ref<DrawerProps["direction"]>("rtl");
+const formLabelAlign = reactive({
+  name: "",
+  region: "",
+  type: ""
+});
+const handleClose = (done: () => void) => {
+  ElMessageBox.confirm("配置项未保存，确认关闭", {
+    type: "warning"
+  }).then(() => {
+    drawer.value = false;
+    disabledValue.value = true;
+    editShow.value = true;
+  });
+};
+function cancelClick() {
+  disabledValue.value = true;
+  editShow.value = true;
+}
+function confirmClick() {
+  console.log(1111);
+  disabledValue.value = true;
+  editShow.value = true;
+  drawer.value = !drawer.value;
+  ElMessage({
+    message: "保存成功",
+    type: "success"
+  });
+}
+const open = row => {
+  drawer.value = true;
+};
+const editShow = ref(true);
+defineExpose({
+  open
+});
+const timer = ref("");
+</script>
+
+<template>
+  <div>
+    <el-drawer
+      v-model="drawer"
+      :direction="direction"
+      :before-close="handleClose"
+    >
+      <template #header>
+        <h4>指标设置</h4>
+      </template>
+      <template #default>
+        <div>
+          <el-form
+            label-position="top"
+            label-width="auto"
+            :model="formLabelAlign"
+          >
+            <el-form-item label="完成值录入人" label-position="top">
+              <el-input />
+            </el-form-item>
+            <el-form-item label="评分方式" label-position="top">
+              <el-input />
+            </el-form-item>
+          </el-form>
+        </div>
+      </template>
+      <template #footer>
+        <div>
+          <el-button @click="cancelClick">取消</el-button>
+          <el-button type="primary" @click="confirmClick">确认</el-button>
+        </div>
+      </template>
+    </el-drawer>
+  </div>
+</template>

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

@@ -33,6 +33,8 @@ const tableData = [
 const newAdd = () => {
   router.push("/evaluate/children/components/newAdd");
 };
+const setEdit = (row: any) => {};
+const setDelete = (row: any) => {};
 </script>
 
 <template>

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

@@ -2,7 +2,11 @@
 defineOptions({
   name: "evaluateChangeMould"
 });
+import { ref } from "vue";
 import { useRouter } from "vue-router";
+import copyMould from "./mould/copyMould.vue";
+const copyMouldRef = ref();
+const copyMouldShow = ref(false);
 const router = useRouter();
 const tableData = [
   {
@@ -33,10 +37,17 @@ const tableData = [
 const newAdd = () => {
   router.push("/evaluate/children/change/components/newAdd");
 };
+const setEdit = (row: any) => {};
+const setDelete = (row: any) => {};
+// 复制
+const setCopy = (row: any) => {
+  copyMouldRef.value.open(row);
+};
 </script>
 
 <template>
   <div class="w-[100%]">
+    <copyMould ref="copyMouldRef" v-model="copyMouldShow" />
     <div class="mb-2 flex gap-2 justify-between flex-wrap">
       <div class="flex mt-2">
         <div class="flex mr-2">
@@ -69,14 +80,10 @@ const newAdd = () => {
               <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-item> 下架 </el-dropdown-item>
-                  <el-dropdown-item> 日志 </el-dropdown-item>
-                  <el-dropdown-item> 数据 </el-dropdown-item>
-                  <el-dropdown-item @click="setDetails(row)">
-                    详情
+                  <el-dropdown-item @click="setCopy(row)">
+                    复制
                   </el-dropdown-item>
                 </el-dropdown-menu>
               </template>

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

@@ -0,0 +1,75 @@
+<script setup lang="ts">
+import { ref, reactive } from "vue";
+import { ElMessageBox, ElMessage } from "element-plus";
+const dialogVisibleAdd = ref(false);
+const copyTitle = ref("");
+const copyMould = () => {
+  return "复制来源:" + copyTitle.value;
+};
+const form = reactive({
+  name: "",
+  region: "",
+  date1: "",
+  date2: "",
+  delivery: false,
+  type: [],
+  resource: "",
+  desc: ""
+});
+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) => {
+  copyTitle.value = item.name;
+  dialogVisibleAdd.value = true;
+};
+defineExpose({
+  open
+});
+</script>
+
+<template>
+  <div>
+    <el-dialog
+      v-model="dialogVisibleAdd"
+      :title="copyMould()"
+      width="500"
+      :before-close="handleClose"
+    >
+      <el-form :model="form" label-width="auto" style="max-width: 600px">
+        <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>
+      <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>