feat: 指标

src/components/import/index.vue

@@ -0,0 +1,111 @@
+<script setup lang="ts">
+import { ref } from "vue";
+import { useRouter } from "vue-router";
+defineOptions({
+  name: "IndexDefineImport"
+});
+const router = useRouter();
+const emit = defineEmits(["handleImport"]);
+const uploadShow = ref(true);
+const uploadFile = () => {
+  uploadShow.value = !uploadShow.value;
+};
+const tableData = [
+  {
+    date: "2016-05-03",
+    name: "Tom",
+    address: "No. 189, Grove St, Los Angeles"
+  },
+  {
+    date: "2016-05-02",
+    name: "Tom",
+    address: "No. 189, Grove St, Los Angeles"
+  },
+  {
+    date: "2016-05-04",
+    name: "Tom",
+    address: "No. 189, Grove St, Los Angeles"
+  },
+  {
+    date: "2016-05-01",
+    name: "Tom",
+    address: "No. 189, Grove St, Los Angeles"
+  }
+];
+const backDefine = () => {
+  router.back();
+};
+</script>
+
+<template>
+  <div>
+    <div class="w-3/4 m-auto mt-4">
+      <div class="w-full bg p-3">
+        <el-button class="float-right" @click="backDefine">返回</el-button>
+        <h5>1.下载导入模板</h5>
+
+        <p class="text-xs mt-2 text">根据提升信息完善表格内容</p>
+        <el-button class="mt-2"
+          ><el-icon><Download /></el-icon>下载空的模板表格</el-button
+        >
+      </div>
+      <div class="w-full mt-4 bg p-3">
+        <h5>2.上传完善后的模板</h5>
+        <p class="text-xs mt-2 text mb-2">
+          更新信息的模板中，如有空的数据列，则相应字段信息会被清空，请谨慎填写
+        </p>
+        <div v-if="uploadShow">
+          <el-upload
+            class="upload-demo"
+            drag
+            action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
+            multiple
+          >
+            <el-icon class="el-icon--upload"><upload-filled /></el-icon>
+            <div class="el-upload__text">
+              点击<em>图标选择上传</em>或者将文件拖拽到此区域
+            </div>
+          </el-upload>
+        </div>
+        <div v-else class="mb-2">
+          <el-table
+            :data="tableData"
+            border
+            style="width: 100%"
+            max-height="250"
+          >
+            <el-table-column prop="date" label="指标编号" width="180" />
+            <el-table-column prop="name" label="指标名称" width="180" />
+            <el-table-column prop="address" label="指标分类" />
+            <el-table-column prop="address" label="指标定义" />
+            <el-table-column prop="address" label="指标口径" />
+          </el-table>
+        </div>
+        <div class="float-right">
+          <el-button>取消</el-button>
+          <el-button type="primary" @click="uploadFile">确认</el-button>
+        </div>
+        <p class="h-11 no-select">.</p>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.bg {
+  background-color: #f8f9fa;
+}
+
+.text {
+  color: #999;
+}
+
+.upoload {
+  float: right;
+}
+
+.no-select {
+  color: rgb(255 255 255 / 0%);
+  user-select: none;
+}
+</style>

src/router/modules/import.ts

@@ -0,0 +1,20 @@
+// 最简代码，也就是这些字段必须有
+export default {
+  path: "/import",
+  meta: {
+    title: ""
+  },
+  children: [
+    {
+      path: "/import/index",
+      name: "importIndex",
+      meta: {
+        title: "批量导入",
+        // title: "",
+        icon: "ep:home-filled",
+        showLink: false
+      },
+      component: () => import("@/components/import/index.vue")
+    }
+  ]
+} satisfies RouteConfigsTable;

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

@@ -4,6 +4,9 @@ defineOptions({
 });
 import { getState, getStateType } from "@/config/tag";
 import { ref } from "vue";
+import { useRouter } from "vue-router";
+import { Search } from "@element-plus/icons-vue";
+const router = useRouter();
 const activeName = ref("first");
 const tableData = [
   {
@@ -33,6 +36,10 @@ const tableData = [
 ];
 const setEdit = (row: any) => {};
 const setDelete = (row: any) => {};
+// 批量导入
+const addsImport = () => {
+  router.push("/import/index");
+};
 </script>
 
 <template>
@@ -64,7 +71,7 @@ const setDelete = (row: any) => {};
           <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" />
+            <el-input class="ml-2" :prefix-icon="Search" />
           </div>
           <div class="mr-10">
             <el-button type="primary" plain>批量调整执行人</el-button>
@@ -112,7 +119,20 @@ const setDelete = (row: any) => {};
           </el-table-column>
         </el-table>
       </el-tab-pane>
-      <el-tab-pane label="考核指标" name="second">Config</el-tab-pane>
+      <el-tab-pane label="考核指标" name="second"
+        ><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" :prefix-icon="Search" />
+          </div>
+          <div class="mr-10">
+            <el-button type="primary" plain @click="addsImport"
+              >批量导入</el-button
+            >
+          </div>
+        </div>
+      </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>

src/views/indexDefine/children/components/DetailsDrawer.vue

@@ -1,107 +0,0 @@
-<script setup lang="ts">
-import { ref, reactive } from "vue";
-import { ElMessageBox } from "element-plus";
-import type { DrawerProps, FormItemProps, FormProps } from "element-plus";
-// const itemLabelPosition = ref<FormItemProps["labelPosition"]>("");
-const drawer = ref(false);
-const direction = ref<DrawerProps["direction"]>("rtl");
-const formLabelAlign = reactive({
-  name: "",
-  region: "",
-  type: ""
-});
-const handleClose = (done: () => void) => {
-  ElMessageBox.confirm("配置项未保存，确认关闭", {
-    type: "warning"
-  }).then(() => {
-    drawer.value = false;
-  });
-};
-function cancelClick() {
-  drawer.value = false;
-}
-function confirmClick() {
-  console.log(1111);
-}
-const open = row => {
-  drawer.value = 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-item label="门诊收住院率" label-position="top">
-              <el-input />
-            </el-form-item>
-            <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-item label="指标口径" label-position="top">
-              <el-input />
-            </el-form-item>
-            <el-form-item label="SQL语句" label-position="top">
-              <el-input />
-            </el-form-item>
-            <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-item label="操作用户" label-position="top">
-              <el-input />
-            </el-form-item>
-            <el-form-item label="创建时间" label-position="top">
-              <el-date-picker
-                v-model="timer"
-                type="datetime"
-                placeholder="Select date and time"
-              />
-            </el-form-item>
-            <el-form-item label="更新时间" label-position="top">
-              <el-date-picker
-                v-model="timer"
-                type="datetime"
-                placeholder="Select date and time"
-              />
-            </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/indexDefine/children/components/dialog.vue

@@ -37,14 +37,14 @@ defineExpose({
 </script>
 
 <template>
-  <el-dialog v-model="visible" title="新建指标" width="400">
-    <div class="m-auto w-[300px]">
+  <el-dialog v-model="visible" title="新建指标" width="480">
+    <div class="m-auto w-full">
       <el-form
         ref="ruleFormRef"
         :model="form"
         label-position="right"
         label-width="auto"
-        style="max-width: 300px"
+        style="max-width: 600px"
       >
         <el-form-item label="指标名称">
           <el-input

src/views/indexDefine/children/components/editDrawer.vue

@@ -4,6 +4,7 @@ import { ElMessageBox } from "element-plus";
 import type { DrawerProps, FormItemProps, FormProps } from "element-plus";
 // const itemLabelPosition = ref<FormItemProps["labelPosition"]>("");
 const drawer = ref(false);
+const disabledShow = ref<any>(true);
 const direction = ref<DrawerProps["direction"]>("rtl");
 const formLabelAlign = reactive({
   name: "",
@@ -14,18 +15,25 @@ const handleClose = (done: () => void) => {
   ElMessageBox.confirm("配置项未保存，确认关闭", {
     type: "warning"
   }).then(() => {
+    disabledShow.value = true;
     drawer.value = false;
   });
 };
 function cancelClick() {
-  drawer.value = false;
+  disabledShow.value = true;
 }
 function confirmClick() {
   console.log(1111);
+  disabledShow.value = true;
+  drawer.value = false;
 }
 const open = row => {
   drawer.value = true;
 };
+// 编辑
+const editClick = () => {
+  disabledShow.value = false;
+};
 defineExpose({
   open
 });
@@ -49,31 +57,34 @@ defineExpose({
             :model="formLabelAlign"
           >
             <el-form-item label="指标名称" label-position="top">
-              <el-input />
+              <el-input :disabled="disabledShow" />
             </el-form-item>
             <el-form-item label="指标分类" label-position="top">
-              <el-input />
+              <el-input :disabled="disabledShow" />
             </el-form-item>
             <el-form-item label="指标定义" label-position="top">
-              <el-input />
+              <el-input :disabled="disabledShow" />
             </el-form-item>
             <el-form-item label="指标口径" label-position="top">
-              <el-input />
+              <el-input :disabled="disabledShow" />
             </el-form-item>
             <el-form-item label="来源" label-position="top">
-              <el-input />
+              <el-input :disabled="disabledShow" />
             </el-form-item>
             <el-form-item label="SQL语句" label-position="top">
-              <el-input />
+              <el-input :disabled="disabledShow" />
             </el-form-item>
             <el-form-item label="状态" label-position="top">
-              <el-input />
+              <el-input :disabled="disabledShow" />
             </el-form-item>
           </el-form>
         </div>
       </template>
       <template #footer>
-        <div>
+        <el-button v-if="disabledShow" type="warning" @click="editClick"
+          >编辑</el-button
+        >
+        <div v-else>
           <el-button @click="cancelClick">取消</el-button>
           <el-button type="primary" @click="confirmClick">确认</el-button>
         </div>

src/views/indexDefine/children/components/logDrawer.vue

@@ -0,0 +1,101 @@
+<script setup lang="ts">
+import { ref, reactive } from "vue";
+import { ElMessageBox } from "element-plus";
+import type { DrawerProps, FormItemProps, FormProps } from "element-plus";
+// const itemLabelPosition = ref<FormItemProps["labelPosition"]>("");
+const drawer = ref(false);
+const direction = ref<DrawerProps["direction"]>("rtl");
+const formLabelAlign = reactive({
+  name: "",
+  region: "",
+  type: ""
+});
+const handleClose = (done: () => void) => {
+  ElMessageBox.confirm("配置项未保存，确认关闭", {
+    type: "warning"
+  }).then(() => {
+    drawer.value = false;
+  });
+};
+const logList = reactive([
+  {
+    name: "张三",
+    time: "2022-01-01 12:00:00",
+    content:
+      "修改了配置项修改了配置项修改了配置项修改了配置项修改了配置项修改了配置项修改了配置项修改了配置项修改了配置项"
+  },
+  {
+    name: "李四",
+    time: "2022-01-01 12:00:00",
+    content: "修改了配置项"
+  },
+  {
+    name: "王五",
+    time: "2022-01-01 12:00:00",
+    content: "修改了配置项修改了配置项"
+  }
+]);
+function cancelClick() {
+  drawer.value = false;
+}
+function confirmClick() {
+  console.log(1111);
+}
+const open = row => {
+  drawer.value = 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>
+          <div v-for="(item, index) in logList" :key="index" class="w-full">
+            <div>
+              <el-text class="font-semibold">操作用户</el-text>
+              <div
+                class="bg-gray-100 pl-3 pb-2 pt-2 rounded text-sm text-gray-500"
+              >
+                {{ item.name }}
+              </div>
+            </div>
+            <div class="mt-4">
+              <el-text class="font-semibold">更新时间</el-text>
+              <div
+                class="bg-gray-100 pl-3 pb-2 pt-2 rounded text-sm text-gray-500"
+              >
+                {{ item.time }}
+              </div>
+            </div>
+            <div class="mt-4">
+              <el-text class="font-semibold">更新内容</el-text>
+              <div
+                class="bg-gray-100 pl-3 pr-3 pb-2 pt-2 rounded text-sm text-gray-500"
+              >
+                {{ item.content }}
+              </div>
+              <el-divider />
+            </div>
+          </div>
+        </div>
+      </template>
+      <template #footer>
+        <div>
+          <el-button @click="cancelClick">关闭</el-button>
+        </div>
+      </template>
+    </el-drawer>
+  </div>
+</template>

src/views/indexDefine/children/define.vue

@@ -2,19 +2,21 @@
 defineOptions({
   name: "IndexDefine"
 });
-import { ref } from "vue";
+import { ref, markRaw } from "vue";
 import dialogVue from "./components/dialog.vue";
 import editDrawer from "./components/editDrawer.vue";
-import DetailsDrawer from "./components/DetailsDrawer.vue";
+import logDrawer from "./components/logDrawer.vue";
 import IndexDefineImport from "./import/index.vue";
 import { Edit, More } from "@element-plus/icons-vue";
 import { ElMessage, ElMessageBox } from "element-plus";
+import { Delete, Check } from "@element-plus/icons-vue";
 const value = ref("");
 const dialogShow = ref();
 const EditdrawerShow = ref();
-const DetailsdrawerShow = ref();
 const EditshowDrawer = ref(false);
-const DetailsshowDrawer = ref(false);
+// 日志
+const logDrawerRef = ref();
+const logDrawerShow = ref(false);
 const options = [
   {
     value: "Option1",
@@ -91,7 +93,8 @@ const setDelete = row => {
   ElMessageBox.confirm("指标删除后无法恢复", "确定要删除这项指标吗", {
     confirmButtonText: "确认",
     cancelButtonText: "取消",
-    type: "warning"
+    type: "warning",
+    icon: markRaw(Delete)
   })
     .then(() => {
       ElMessage({
@@ -106,17 +109,56 @@ const setDelete = row => {
       });
     });
 };
-// 详情
-const setDetails = row => {
-  DetailsshowDrawer.value = true;
-  DetailsdrawerShow.value.open();
-  console.log(row);
-};
 // 批量导入
 const sizeImport = ref(false);
 const GoSizeImport = () => {
   sizeImport.value = !sizeImport.value;
 };
+// 日志
+const logs = row => {
+  logDrawerRef.value.open();
+  logDrawerShow.value = true;
+};
+// 发布
+const release = row => {
+  ElMessageBox.confirm("请确认", "确定要发布这项指标吗", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning"
+  })
+    .then(() => {
+      ElMessage({
+        type: "success",
+        message: "发布成功"
+      });
+    })
+    .catch(() => {
+      ElMessage({
+        type: "info",
+        message: "已取消"
+      });
+    });
+};
+// 下架
+const offShelf = row => {
+  ElMessageBox.confirm(" ", "确定要下架这项指标吗", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning"
+  })
+    .then(() => {
+      ElMessage({
+        type: "success",
+        message: "下架成功"
+      });
+    })
+    .catch(() => {
+      ElMessage({
+        type: "info",
+        message: "已取消"
+      });
+    });
+};
 </script>
 
 <template>
@@ -126,16 +168,14 @@ const GoSizeImport = () => {
     <div v-else>
       <!-- 指标详情 -->
       <editDrawer ref="EditdrawerShow" v-model:drawerValue="EditshowDrawer" />
-      <DetailsDrawer
-        ref="DetailsdrawerShow"
-        v-model:drawerValue="DetailsshowDrawer"
-      />
       <!-- 新建 -->
       <dialogVue
         ref="dialogShow"
         v-model:modelValue="showDialog"
         @closeDialog="close"
       />
+      <!-- 日志 -->
+      <logDrawer ref="logDrawerRef" v-model="logDrawerShow" />
       <div class="w-[100%]">
         <div class="mb-2 flex gap-2 justify-between flex-wrap">
           <div class="flex mt-2">
@@ -219,13 +259,16 @@ const GoSizeImport = () => {
                     <el-dropdown-item @click="setDelete(row)">
                       删除
                     </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="release(row)">
+                      发布
+                    </el-dropdown-item>
+                    <el-dropdown-item @click="offShelf(row)">
+                      下架
                     </el-dropdown-item>
+                    <el-dropdown-item @click="logs(row)">
+                      日志
+                    </el-dropdown-item>
+                    <el-dropdown-item> 数据 </el-dropdown-item>
                   </el-dropdown-menu>
                 </template>
               </el-dropdown>