feat: 指标库

src/api/indexDefine.ts

@@ -28,6 +28,11 @@ export const delQuota = id => {
 export const postUpdateDept = data => {
   return http.request<QuotaPage>("post", "/quota/updateQuota", { data });
 };
+// 来源
+export const getQuotaSourceList = data => {
+  return http.request<QuotaPage>("get", "/quota/getQuotaSourceList", { data });
+};
+
 // // 下载
 export const GetdownloadDataRosterTemplate = () => {
   return http.request<any>("get", "/quota/downloaQuotaTemplate");

src/api/select.ts

@@ -0,0 +1,21 @@
+import { http } from "@/utils/http";
+import { ref } from "vue";
+export const select = ref<any>([]);
+// 字典
+type QuotaPageList = {
+  code: number;
+  msg: string;
+  data: Array<any>;
+};
+export const selectDictList = () => {
+  return http.request<QuotaPageList>("get", "/commonDict/selectDictList", {
+    dictType: "1"
+  });
+};
+export const getSelectDictListtApi = async () => {
+  const { code, data } = await selectDictList();
+  if (code == 200) {
+    select.value = data;
+    return data;
+  }
+};

src/views/background/framework/roles/rolePower.vue

@@ -10,6 +10,7 @@ import addRole from "./components/addRole.vue";
 import addPerson from "./components/addPerson.vue";
 import { getMenuList, getMenuListCodeForRole } from "@/api/menu";
 import { postPageRole, postDelRole, postPageUserByRole } from "@/api/roles";
+import pngcaret from "@/assets/icon-png/caret-right-small.svg";
 // 新增角色
 const addRoleRef = ref();
 const addRoleShow = ref(false);
@@ -239,20 +240,20 @@ const getMenuListCodeForRoleApi = async item => {
         <div
           v-for="(item, index) in rolesList.data"
           :key="index"
-          class="w-[100%] flex justify-between items-center"
+          class="w-[100%] flex justify-between items-center roles-text"
         >
+          <pngcaret class="mr-1 mt-2" />
           <div
             :class="[
               'w-[100%] flex justify-between items-center mt-2 cursor-pointer',
-              { 'bg-blue-200': bgColor === item.id }
+              { 'roles-bg': bgColor === item.id }
             ]"
           >
             <div
               class="flex justify-between items-center"
               @click="lookRoles(item)"
             >
-              <el-icon class="mr-2"><Avatar /></el-icon>
-              <el-text class="">{{ item.roleName }}</el-text>
+              <span class="">{{ item.roleName }}</span>
             </div>
             <div class="flex justify-between items-center">
               <el-dropdown trigger="click">
@@ -287,20 +288,20 @@ const getMenuListCodeForRoleApi = async item => {
         <div
           v-for="(item, index) in rolesList.dataUser"
           :key="index"
-          class="w-[100%] flex justify-between items-center"
+          class="w-[100%] flex justify-between items-center roles-text"
         >
+          <pngcaret class="mr-1 mt-2" />
           <div
             :class="[
               'w-[100%] flex justify-between items-center mt-2 cursor-pointer',
-              { 'bg-blue-200': bgColor === item.id }
+              { 'roles-bg': bgColor === item.id }
             ]"
           >
             <div
               class="flex justify-between items-center"
               @click="lookRoles(item)"
             >
-              <el-icon class="mr-2"><Avatar /></el-icon>
-              <el-text class="">{{ item.roleName }}</el-text>
+              <span class="">{{ item.roleName }}</span>
             </div>
             <div class="flex justify-between items-center">
               <el-dropdown trigger="click">
@@ -444,4 +445,17 @@ const getMenuListCodeForRoleApi = async item => {
 //   line-height: 10px;
 //   border: 1px solid red;
 // }
+.roles-bg {
+  color: #0052d9;
+  background-color: #0053d91a;
+}
+
+.roles-text {
+  font-size: 14px;
+  // font-family: PingFangSC-Regular;
+  font-weight: 400;
+  line-height: 22px;
+  color: #000000e6;
+  letter-spacing: 0;
+}
 </style>

src/views/background/framework/users/index.vue

@@ -11,7 +11,7 @@ import addUsers from "./components/addUsers.vue";
 import editPerson from "./components/editPerson.vue";
 import { postPageGroup, postDelUserGroup } from "@/api/userGroup";
 import UserPageTable from "@/components/UserPageTable/index.vue";
-
+import pngcaret from "@/assets/icon-png/caret-right-small.svg";
 // 新增用户组
 const addUsersRef = ref();
 const addUsersShow = ref(false);
@@ -193,18 +193,18 @@ const deltetePerson = row => {
           :key="item.id"
           class="w-[100%] flex justify-between items-center"
         >
+          <pngcaret class="mr-1 mt-2" />
           <div
             :class="[
               'w-[100%] flex justify-between items-center mt-2 cursor-pointer',
-              { 'bg-blue-200': bgColor === item.id }
+              { 'roles-bg': bgColor === item.id }
             ]"
           >
             <div
               class="flex justify-between items-center'"
               @click="lookRoles(item)"
             >
-              <el-icon class="mr-2"><Avatar /></el-icon>
-              <el-text class="">{{ item.groupName }}</el-text>
+              <span class="">{{ item.groupName }}</span>
             </div>
             <div class="flex justify-between items-center">
               <el-dropdown trigger="click">
@@ -321,4 +321,17 @@ const deltetePerson = row => {
 //   line-height: 10px;
 //   border: 1px solid red;
 // }
+.roles-bg {
+  color: #0052d9;
+  background-color: #0053d91a;
+}
+
+.roles-text {
+  font-size: 14px;
+  // font-family: PingFangSC-Regular;
+  font-weight: 400;
+  line-height: 22px;
+  color: #000000e6;
+  letter-spacing: 0;
+}
 </style>

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

@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import { reactive, computed, ref } from "vue";
+import { reactive, computed, ref, onMounted } from "vue";
 import { ElMessage } from "element-plus";
 import { addQuota } from "@/api/indexDefine";
+import { getSelectDictListtApi, select } from "@/api/select";
+// import dayjs from "dayjs";
 const emit = defineEmits(["closeDialog"]);
 const visible = ref(false);
 const ruleFormRef = ref(null);
@@ -13,6 +15,9 @@ const form = reactive({
   source: "",
   statue: null
 });
+onMounted(() => {
+  getSelectDictListtApi();
+});
 const msgName = ref("");
 const addQuotaApi = async () => {
   ruleFormRef.value.validate(async (valid: boolean) => {
@@ -44,9 +49,8 @@ const rules = reactive({
   statue: [{ required: true, message: "请填写选择状态", trigger: "blur" }]
 });
 const close = () => {
-  // 请关闭弹框
-  console.log(visible.value);
   visible.value = false;
+  emit("closeDialog");
 };
 const save = () => {
   addQuotaApi();
@@ -92,9 +96,17 @@ defineExpose({
           </el-text>
         </el-form-item>
         <el-form-item label="指标分类">
-          <el-select v-model="form.categoryName" placeholder="请选择">
-            <el-option label="Zone No.1" value="shanghai" />
-            <el-option label="Zone No.2" value="beijing" />
+          <el-select
+            v-model="form.categoryName"
+            filterable
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="(item, index) in select"
+              :key="index"
+              :label="item.dictValue"
+              :value="item.dictValue"
+            />
           </el-select>
         </el-form-item>
         <el-form-item label="指标定义" prop="define">

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

@@ -1,13 +1,18 @@
 <script setup lang="ts">
-import { ref, reactive } from "vue";
+import { ref, reactive, onMounted } from "vue";
 import { ElMessage, ElMessageBox } from "element-plus";
 import type { DrawerProps, FormItemProps, FormProps } from "element-plus";
-import { postUpdateDept } from "@/api/indexDefine";
-const emit = defineEmits(["EditDrawer"]);
-
+import { postUpdateDept, getQuotaSourceList } from "@/api/indexDefine";
+import { getSelectDictListtApi, select } from "@/api/select";
+import { getStateData, getStateType } from "@/config/tag";
+const emit = defineEmits(["closeEditDialog"]);
+// closeEditDialog
 // const itemLabelPosition = ref<FormItemProps["labelPosition"]>("");
 const drawer = ref(false);
 const disabledShow = ref<any>(true);
+onMounted(() => {
+  getSelectDictListtApi();
+});
 const direction = ref<DrawerProps["direction"]>("rtl");
 const formLabelAlign = reactive({
   id: "",
@@ -18,32 +23,44 @@ const formLabelAlign = reactive({
   source: "",
   statue: null
 });
+const rules = reactive<FormProps["rules"]>({
+  name: [{ required: true, message: "请输入指标名称", trigger: "blur" }],
+  define: { required: true, message: "请输入指标定义", trigger: "blur" },
+  caliber: { required: true, message: "请输入指标口径", trigger: "blur" },
+  statue: { required: true, message: "请选择指标状态", trigger: "blur" }
+});
 const handleClose = (done: () => void) => {
-  ElMessageBox.confirm("配置项未保存，确认关闭", {
-    type: "warning"
-  }).then(() => {
+  if (disabledShow.value) {
     disabledShow.value = true;
     drawer.value = false;
-  });
+  } else {
+    ElMessageBox.confirm("配置项未保存，确认关闭", {
+      type: "warning"
+    }).then(() => {
+      disabledShow.value = true;
+      drawer.value = false;
+    });
+  }
 };
 function cancelClick() {
   disabledShow.value = true;
 }
 // 确认
 const postUpdateDeptApi = async () => {
-  const { code } = await postUpdateDept(formLabelAlign);
+  const { code, msg } = await postUpdateDept(formLabelAlign);
   if (code === 200) {
     ElMessage({
-      message: "添加成功",
+      message: "修改成功",
       type: "success"
     });
-    emit("EditDrawer");
+    disabledShow.value = true;
+    drawer.value = false;
+    emit("closeEditDialog");
+  } else {
+    ElMessage.error(msg);
   }
 };
 function confirmClick() {
-  console.log(1111);
-  disabledShow.value = true;
-  drawer.value = false;
   postUpdateDeptApi();
 }
 const open = row => {
@@ -74,28 +91,61 @@ defineExpose({
           <el-form
             label-position="top"
             label-width="auto"
+            :rules="rules"
             :model="formLabelAlign"
           >
-            <el-form-item label="指标名称" label-position="top">
-              <el-input :disabled="disabledShow" />
+            <el-form-item label="指标名称" label-position="top" prop="name">
+              <el-input
+                v-model="formLabelAlign.name"
+                :disabled="disabledShow"
+              />
             </el-form-item>
             <el-form-item label="指标分类" label-position="top">
-              <el-input :disabled="disabledShow" />
+              <el-select
+                :key="formLabelAlign.categoryName"
+                v-model="formLabelAlign.categoryName"
+                :disabled="disabledShow"
+                placeholder="请选择状态"
+              >
+                <el-option
+                  v-for="(item, index) in select"
+                  :key="index"
+                  :label="item.dictValue"
+                  :value="item.dictValue"
+                />
+              </el-select>
             </el-form-item>
-            <el-form-item label="指标定义" label-position="top">
-              <el-input :disabled="disabledShow" />
+            <el-form-item label="指标定义" label-position="top" prop="define">
+              <el-input
+                v-model="formLabelAlign.define"
+                :disabled="disabledShow"
+                type="textarea"
+              />
             </el-form-item>
-            <el-form-item label="指标口径" label-position="top">
-              <el-input :disabled="disabledShow" />
+            <el-form-item label="指标口径" label-position="top" prop="caliber">
+              <el-input
+                v-model="formLabelAlign.caliber"
+                :disabled="disabledShow"
+                type="textarea"
+              />
             </el-form-item>
             <el-form-item label="来源" label-position="top">
-              <el-input :disabled="disabledShow" />
-            </el-form-item>
-            <el-form-item label="SQL语句" label-position="top">
-              <el-input :disabled="disabledShow" />
+              <el-input
+                v-model="formLabelAlign.source"
+                :disabled="disabledShow"
+              />
             </el-form-item>
-            <el-form-item label="状态" label-position="top">
-              <el-input :disabled="disabledShow" />
+            <el-form-item label="状态" label-position="top" prop="statue">
+              <el-select
+                :key="formLabelAlign.statue"
+                v-model="formLabelAlign.statue"
+                :disabled="disabledShow"
+                placeholder="请选择状态"
+              >
+                <el-option label="草稿" :value="0" />
+                <el-option label="发布" :value="1" />
+                <el-option label="下架" :value="2" />
+              </el-select>
             </el-form-item>
           </el-form>
         </div>

src/views/indexDefine/children/define.vue

@@ -2,7 +2,7 @@
 defineOptions({
   name: "IndexDefine"
 });
-import { ref, reactive, markRaw } from "vue";
+import { ref, reactive, markRaw, onMounted } from "vue";
 import dialogVue from "./components/dialog.vue";
 import editDrawer from "./components/editDrawer.vue";
 import logDrawer from "./components/logDrawer.vue";
@@ -11,7 +11,10 @@ import { Edit, More } from "@element-plus/icons-vue";
 import { ElMessage, ElMessageBox } from "element-plus";
 import { Delete, Check } from "@element-plus/icons-vue";
 import { Search } from "@element-plus/icons-vue";
-import { getQuotaPageList, delQuota } from "@/api/indexDefine";
+import { getSelectDictListtApi, select } from "@/api/select";
+import { getQuotaPageList, delQuota, postUpdateDept } from "@/api/indexDefine";
+import { getStateData, getStateType } from "@/config/tag";
+import dayjs from "dayjs";
 const value = ref("");
 const dialogShow = ref();
 const EditdrawerShow = ref();
@@ -19,26 +22,21 @@ const EditshowDrawer = ref(false);
 // 日志
 const logDrawerRef = ref();
 const logDrawerShow = ref(false);
+onMounted(() => {
+  getSelectDictListtApi();
+});
 const options = [
   {
-    value: "Option1",
-    label: "Option1"
-  },
-  {
-    value: "Option2",
-    label: "Option2"
+    value: "0",
+    label: "草稿"
   },
   {
-    value: "Option3",
-    label: "Option3"
+    value: "1",
+    label: "已发布"
   },
   {
-    value: "Option4",
-    label: "Option4"
-  },
-  {
-    value: "Option5",
-    label: "Option5"
+    value: "2",
+    label: "已下架"
   }
 ];
 const currentPage4 = ref(5);
@@ -46,7 +44,10 @@ const pageSize4 = ref(100);
 const params = reactive({
   params: {
     pageNumber: 1,
-    pageSize: 10
+    pageSize: 10,
+    param: null,
+    categoryName: null,
+    statue: null
   },
   records: [],
   total: 0
@@ -84,7 +85,6 @@ const close = () => {
 const setEdit = row => {
   EditshowDrawer.value = true;
   EditdrawerShow.value.open(row);
-  console.log(row);
 };
 // 删除
 const delQuotaApi = async row => {
@@ -127,16 +127,14 @@ const logs = row => {
 };
 // 发布
 const release = row => {
-  ElMessageBox.confirm("请确认", "确定要发布这项指标吗", {
+  ElMessageBox.confirm("确定要发布这项指标吗", "", {
     confirmButtonText: "确认",
     cancelButtonText: "取消",
     type: "warning"
   })
     .then(() => {
-      ElMessage({
-        type: "success",
-        message: "发布成功"
-      });
+      row.statue = 1;
+      postUpdateDeptApi(row, "上架");
     })
     .catch(() => {
       ElMessage({
@@ -147,16 +145,14 @@ const release = row => {
 };
 // 下架
 const offShelf = row => {
-  ElMessageBox.confirm(" ", "确定要下架这项指标吗", {
+  ElMessageBox.confirm("确定要下架这项指标吗", "", {
     confirmButtonText: "确认",
     cancelButtonText: "取消",
     type: "warning"
   })
     .then(() => {
-      ElMessage({
-        type: "success",
-        message: "下架成功"
-      });
+      row.statue = 2;
+      postUpdateDeptApi(row, "下架");
     })
     .catch(() => {
       ElMessage({
@@ -165,6 +161,17 @@ const offShelf = row => {
       });
     });
 };
+// 修改信息
+const postUpdateDeptApi = async (row, state) => {
+  const res = await postUpdateDept(row);
+  if (res.code == 200) {
+    ElMessage({
+      type: "success",
+      message: `${state}成功`
+    });
+    getQuotaPageListApi();
+  }
+};
 </script>
 
 <template>
@@ -192,26 +199,30 @@ const offShelf = row => {
             <div class="flex mr-2">
               <div class="text-sm leading-8 mr-3">指标分类</div>
               <el-select
-                v-model="value"
+                v-model="params.params.categoryName"
                 clearable
+                filterable
                 placeholder="请选择"
                 style="width: 150px"
+                @change="getQuotaPageListApi"
               >
                 <el-option
-                  v-for="item in options"
-                  :key="item.value"
-                  :label="item.label"
-                  :value="item.value"
+                  v-for="(item, index) in select"
+                  :key="index"
+                  :label="item.dictValue"
+                  :value="item.dictValue"
                 />
               </el-select>
             </div>
             <div class="flex mr-2">
               <div class="text-sm leading-8 mr-3">状态</div>
               <el-select
-                v-model="value"
+                v-model="params.params.statue"
                 clearable
+                filterable
                 placeholder="请选择"
                 style="width: 150px"
+                @change="getQuotaPageListApi"
               >
                 <el-option
                   v-for="item in options"
@@ -223,9 +234,12 @@ const offShelf = row => {
             </div>
             <div class="flex mr-2">
               <el-input
+                v-model="params.params.param"
                 style="width: 300px"
                 :prefix-icon="Search"
+                clearable
                 placeholder="搜索指标名称、编码、口径、定义"
+                @change="getQuotaPageListApi"
               />
             </div>
           </div>
@@ -244,15 +258,19 @@ const offShelf = row => {
           <el-table-column prop="categoryName" label="指标分类" />
           <el-table-column prop="address" label="状态">
             <template #default="{ row }">
-              <el-tag type="primary" effect="dark">
-                {{ row.name }}
+              <el-tag :type="getStateType(row.statue)">
+                {{ getStateData(row.statue) }}
               </el-tag>
             </template>
           </el-table-column>
-          <el-table-column prop="address" label="指标定义" />
-          <el-table-column prop="address" label="指标口径" />
-          <el-table-column prop="address" label="数据来源" />
-          <el-table-column prop="address" label="更新时间" />
+          <el-table-column prop="define" label="指标定义" />
+          <el-table-column prop="caliber" label="指标口径" />
+          <el-table-column prop="source" label="数据来源" />
+          <el-table-column prop="createTime" label="更新时间">
+            <template #default="{ row }">
+              {{ dayjs(row.createTime).format("YYYY-MM-DD HH:mm:ss") }}
+            </template>
+          </el-table-column>
           <el-table-column label="操作">
             <template #default="{ row }">
               <!-- <el-button link :icon="Edit" /> -->