|
|
@@ -188,6 +188,73 @@ const changeSort = ({ column, prop, order }) => {
|
|
|
getQuotaPageListApi();
|
|
|
}
|
|
|
};
|
|
|
+
|
|
|
+// 新增-编辑-删除分类
|
|
|
+const typeDialogTitle = ref("新增");
|
|
|
+const typeDialogVisible = ref(false);
|
|
|
+const typeForm = reactive({
|
|
|
+ typeName: ""
|
|
|
+});
|
|
|
+const typeRules = reactive({
|
|
|
+ typeName: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请输入分类名称",
|
|
|
+ trigger: "blur"
|
|
|
+ }
|
|
|
+ ]
|
|
|
+});
|
|
|
+const typeList = ref([
|
|
|
+ {
|
|
|
+ name: "全部分类",
|
|
|
+ value: 115
|
|
|
+ }
|
|
|
+]);
|
|
|
+const openTypeDialog = (type = "", row: any = {}) => {
|
|
|
+ typeDialogVisible.value = true;
|
|
|
+ if (type === "add") {
|
|
|
+ typeDialogTitle.value = "新增";
|
|
|
+ } else if (type === "edit") {
|
|
|
+ typeDialogTitle.value = "编辑";
|
|
|
+ typeForm.typeName = row.name;
|
|
|
+ }
|
|
|
+};
|
|
|
+const deleteType = () => {
|
|
|
+ ElMessageBox.confirm(
|
|
|
+ "请先解除分类下的指标后再删除",
|
|
|
+ "确定要删除这项分类吗？",
|
|
|
+ {
|
|
|
+ confirmButtonText: "确认",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning"
|
|
|
+ }
|
|
|
+ )
|
|
|
+ .then(() => {
|
|
|
+ ElMessage({
|
|
|
+ type: "success",
|
|
|
+ message: "删除成功"
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ ElMessage({
|
|
|
+ type: "info",
|
|
|
+ message: "删除失败"
|
|
|
+ });
|
|
|
+ });
|
|
|
+};
|
|
|
+const closeTypeDialog = () => {
|
|
|
+ typeDialogVisible.value = false;
|
|
|
+ typeDialogTitle.value = "";
|
|
|
+ typeForm.typeName = "";
|
|
|
+};
|
|
|
+const typeFormRef = ref();
|
|
|
+const confirmTypeDialog = () => {
|
|
|
+ typeFormRef.value.validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ closeTypeDialog();
|
|
|
+ }
|
|
|
+ });
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
@@ -209,179 +276,272 @@ const changeSort = ({ column, prop, order }) => {
|
|
|
/>
|
|
|
<!-- 日志 -->
|
|
|
<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">
|
|
|
- <div class="flex mr-2">
|
|
|
- <div class="text-sm leading-8 mr-3">指标分类</div>
|
|
|
- <el-select
|
|
|
- v-model="params.params.categoryName"
|
|
|
- clearable
|
|
|
- filterable
|
|
|
- placeholder="请选择"
|
|
|
- style="width: 150px"
|
|
|
- @change="getQuotaPageListApi"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- 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="params.params.statue"
|
|
|
- clearable
|
|
|
- filterable
|
|
|
- placeholder="请选择"
|
|
|
- style="width: 150px"
|
|
|
- @change="getQuotaPageListApi"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="item in options"
|
|
|
- :key="item.value"
|
|
|
- :label="item.label"
|
|
|
- :value="item.value"
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </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>
|
|
|
- <div class="flex pt-2 mr-6">
|
|
|
- <Auth :value="['批量导入']">
|
|
|
- <el-button class="mr-2" @click="GoSizeImport">批量导入</el-button>
|
|
|
- </Auth>
|
|
|
- <Auth :value="['创建指标']">
|
|
|
- <el-button type="primary" class="mr-2" @click="newAddIndex"
|
|
|
- >创建指标</el-button
|
|
|
- >
|
|
|
- </Auth>
|
|
|
+ <div class="content-right-box">
|
|
|
+ <div class="item-left">
|
|
|
+ <div class="item-left-title-box">
|
|
|
+ <p class="item-left-title">分类</p>
|
|
|
+ <el-icon style="cursor: pointer" @click="openTypeDialog('add')">
|
|
|
+ <Plus />
|
|
|
+ </el-icon>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="mt-8">
|
|
|
- <el-table
|
|
|
- :data="params.records"
|
|
|
- style="z-index: 0; width: 100%"
|
|
|
- @sort-change="changeSort"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- prop="id"
|
|
|
- label="指标编号"
|
|
|
- width="100"
|
|
|
- show-overflow-tooltip
|
|
|
- />
|
|
|
- <el-table-column prop="name" label="指标名称" show-overflow-tooltip />
|
|
|
- <el-table-column
|
|
|
- prop="categoryName"
|
|
|
- label="指标分类"
|
|
|
- show-overflow-tooltip
|
|
|
- />
|
|
|
- <el-table-column prop="address" label="状态">
|
|
|
- <template #default="{ row }">
|
|
|
- <el-tag :type="getStateType(row.statue)">
|
|
|
- {{ getStateData(row.statue) }}
|
|
|
- </el-tag>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="define"
|
|
|
- label="指标定义"
|
|
|
- show-overflow-tooltip
|
|
|
- />
|
|
|
- <el-table-column
|
|
|
- prop="caliber"
|
|
|
- label="指标口径"
|
|
|
- show-overflow-tooltip
|
|
|
- />
|
|
|
- <el-table-column
|
|
|
- prop="source"
|
|
|
- label="数据来源"
|
|
|
- show-overflow-tooltip
|
|
|
- />
|
|
|
- <el-table-column prop="updateTime" label="更新时间" sortable="custom">
|
|
|
- <template #default="{ row }">
|
|
|
- {{ formattedTime(row.updateTime) }}
|
|
|
- <!-- {{ dayjs(row.updateTime).format("YYYY-MM-DD HH:mm:ss") }} -->
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="操作">
|
|
|
- <template #default="{ row }">
|
|
|
- <!-- <el-button link :icon="Edit" /> -->
|
|
|
- <Auth :value="['编辑']">
|
|
|
- <el-dropdown trigger="click">
|
|
|
- <span
|
|
|
- class="el-dropdown-link navbar-bg-hover select-none pt-1"
|
|
|
- >
|
|
|
- <!-- <el-text type="primary" @click="setEdit(row)">编辑</el-text>-->
|
|
|
- <el-icon @click="setEdit(row)">
|
|
|
- <Edit />
|
|
|
- </el-icon>
|
|
|
- </span>
|
|
|
- </el-dropdown>
|
|
|
- </Auth>
|
|
|
+ <div class="item-left-list">
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in typeList"
|
|
|
+ :key="index"
|
|
|
+ class="item-left-list-item"
|
|
|
+ >
|
|
|
+ <span>{{ item.name }}</span>
|
|
|
<el-dropdown class="ml-2" trigger="click">
|
|
|
- <span class="el-dropdown-link navbar-bg-hover select-none pt-1">
|
|
|
- <!--<el-text type="primary">更多</el-text>-->
|
|
|
- <el-icon>
|
|
|
- <More />
|
|
|
- </el-icon>
|
|
|
- </span>
|
|
|
+ <span class="type-number">{{ item.value }}</span>
|
|
|
<template #dropdown>
|
|
|
<el-dropdown-menu class="setting">
|
|
|
- <Auth :value="['删除']">
|
|
|
- <el-dropdown-item @click="setDelete(row)">
|
|
|
- <el-text type="danger">删除</el-text>
|
|
|
- </el-dropdown-item>
|
|
|
- </Auth>
|
|
|
- <el-dropdown-item
|
|
|
- v-if="row.statue != 1"
|
|
|
- @click="release(row)"
|
|
|
- >
|
|
|
- 发布
|
|
|
+ <el-dropdown-item>
|
|
|
+ <el-text
|
|
|
+ type="primary"
|
|
|
+ @click="openTypeDialog('edit', item)"
|
|
|
+ >
|
|
|
+ <el-icon>
|
|
|
+ <Edit />
|
|
|
+ </el-icon>
|
|
|
+ 编辑
|
|
|
+ </el-text>
|
|
|
</el-dropdown-item>
|
|
|
- <el-dropdown-item
|
|
|
- v-if="row.statue != 2"
|
|
|
- @click="offShelf(row)"
|
|
|
- >
|
|
|
- 下架
|
|
|
- </el-dropdown-item>
|
|
|
- <el-dropdown-item @click="logs(row)">
|
|
|
- 日志
|
|
|
+ <el-dropdown-item>
|
|
|
+ <el-text type="danger" @click="deleteType">
|
|
|
+ <el-icon>
|
|
|
+ <Delete />
|
|
|
+ </el-icon>
|
|
|
+ 删除
|
|
|
+ </el-text>
|
|
|
</el-dropdown-item>
|
|
|
</el-dropdown-menu>
|
|
|
</template>
|
|
|
</el-dropdown>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
- <div class="flex justify-between item-center">
|
|
|
- <div class="float-left mt-5 ml-2 total">共{{ params.total }}条数据</div>
|
|
|
- <div class="float-right mt-5 mr-8">
|
|
|
- <el-pagination
|
|
|
- v-model:current-page="params.params.pageNumber"
|
|
|
- v-model:page-size="params.params.pageSize"
|
|
|
- background
|
|
|
- layout="prev, pager, next"
|
|
|
- :total="params.total"
|
|
|
- @size-change="handleSizeChange"
|
|
|
- @current-change="handleCurrentChange"
|
|
|
- />
|
|
|
+ </div>
|
|
|
+ <div class="item-left-list-item">
|
|
|
+ <span>未分类</span>
|
|
|
+ <span class="type-number no-type">0</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="item-right">
|
|
|
+ <div class="w-[100%]">
|
|
|
+ <div class="mb-2 flex gap-2 justify-between flex-wrap">
|
|
|
+ <div class="flex mt-2">
|
|
|
+ <div class="flex mr-2">
|
|
|
+ <div class="text-sm leading-8 mr-3">指标分类</div>
|
|
|
+ <el-select
|
|
|
+ v-model="params.params.categoryName"
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 150px"
|
|
|
+ @change="getQuotaPageListApi"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ 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="params.params.statue"
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 150px"
|
|
|
+ @change="getQuotaPageListApi"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in options"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </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>
|
|
|
+ <div class="flex pt-2 mr-6">
|
|
|
+ <Auth :value="['批量导入']">
|
|
|
+ <el-button class="mr-2" @click="GoSizeImport"
|
|
|
+ >批量导入</el-button
|
|
|
+ >
|
|
|
+ </Auth>
|
|
|
+ <Auth :value="['创建指标']">
|
|
|
+ <el-button type="primary" class="mr-2" @click="newAddIndex"
|
|
|
+ >创建指标</el-button
|
|
|
+ >
|
|
|
+ </Auth>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="mt-8">
|
|
|
+ <el-table
|
|
|
+ :data="params.records"
|
|
|
+ style="z-index: 0; width: 100%"
|
|
|
+ @sort-change="changeSort"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ prop="id"
|
|
|
+ label="指标编号"
|
|
|
+ width="100"
|
|
|
+ show-overflow-tooltip
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ prop="name"
|
|
|
+ label="指标名称"
|
|
|
+ show-overflow-tooltip
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ prop="categoryName"
|
|
|
+ label="指标分类"
|
|
|
+ show-overflow-tooltip
|
|
|
+ />
|
|
|
+ <el-table-column prop="address" label="状态">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <el-tag :type="getStateType(row.statue)">
|
|
|
+ {{ getStateData(row.statue) }}
|
|
|
+ </el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="define"
|
|
|
+ label="指标定义"
|
|
|
+ show-overflow-tooltip
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ prop="caliber"
|
|
|
+ label="指标口径"
|
|
|
+ show-overflow-tooltip
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ prop="source"
|
|
|
+ label="数据来源"
|
|
|
+ show-overflow-tooltip
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ prop="updateTime"
|
|
|
+ label="更新时间"
|
|
|
+ sortable="custom"
|
|
|
+ >
|
|
|
+ <template #default="{ row }">
|
|
|
+ {{ formattedTime(row.updateTime) }}
|
|
|
+ <!-- {{ dayjs(row.updateTime).format("YYYY-MM-DD HH:mm:ss") }} -->
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <!-- <el-button link :icon="Edit" /> -->
|
|
|
+ <Auth :value="['编辑']">
|
|
|
+ <el-dropdown trigger="click">
|
|
|
+ <span
|
|
|
+ class="el-dropdown-link navbar-bg-hover select-none pt-1"
|
|
|
+ >
|
|
|
+ <!-- <el-text type="primary" @click="setEdit(row)">编辑</el-text>-->
|
|
|
+ <el-icon @click="setEdit(row)">
|
|
|
+ <Edit />
|
|
|
+ </el-icon>
|
|
|
+ </span>
|
|
|
+ </el-dropdown>
|
|
|
+ </Auth>
|
|
|
+ <el-dropdown class="ml-2" trigger="click">
|
|
|
+ <span
|
|
|
+ class="el-dropdown-link navbar-bg-hover select-none pt-1"
|
|
|
+ >
|
|
|
+ <!--<el-text type="primary">更多</el-text>-->
|
|
|
+ <el-icon>
|
|
|
+ <More />
|
|
|
+ </el-icon>
|
|
|
+ </span>
|
|
|
+ <template #dropdown>
|
|
|
+ <el-dropdown-menu class="setting">
|
|
|
+ <Auth :value="['删除']">
|
|
|
+ <el-dropdown-item @click="setDelete(row)">
|
|
|
+ <el-text type="danger">删除</el-text>
|
|
|
+ </el-dropdown-item>
|
|
|
+ </Auth>
|
|
|
+ <el-dropdown-item
|
|
|
+ v-if="row.statue != 1"
|
|
|
+ @click="release(row)"
|
|
|
+ >
|
|
|
+ 发布
|
|
|
+ </el-dropdown-item>
|
|
|
+ <el-dropdown-item
|
|
|
+ v-if="row.statue != 2"
|
|
|
+ @click="offShelf(row)"
|
|
|
+ >
|
|
|
+ 下架
|
|
|
+ </el-dropdown-item>
|
|
|
+ <el-dropdown-item @click="logs(row)">
|
|
|
+ 日志
|
|
|
+ </el-dropdown-item>
|
|
|
+ </el-dropdown-menu>
|
|
|
+ </template>
|
|
|
+ </el-dropdown>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ <div class="flex justify-between item-center">
|
|
|
+ <div class="float-left mt-5 ml-2 total">
|
|
|
+ 共{{ params.total }}条数据
|
|
|
+ </div>
|
|
|
+ <div class="float-right mt-5 mr-8">
|
|
|
+ <el-pagination
|
|
|
+ v-model:current-page="params.params.pageNumber"
|
|
|
+ v-model:page-size="params.params.pageSize"
|
|
|
+ background
|
|
|
+ layout="prev, pager, next"
|
|
|
+ :total="params.total"
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <!--新增/编辑分类-->
|
|
|
+ <el-dialog
|
|
|
+ v-model="typeDialogVisible"
|
|
|
+ :title="`${typeDialogTitle}分类`"
|
|
|
+ width="30%"
|
|
|
+ >
|
|
|
+ <el-form
|
|
|
+ ref="typeFormRef"
|
|
|
+ :model="typeForm"
|
|
|
+ label-width="auto"
|
|
|
+ :rules="typeRules"
|
|
|
+ >
|
|
|
+ <el-form-item prop="typeName" label="分类名称">
|
|
|
+ <el-input
|
|
|
+ v-model="typeForm.typeName"
|
|
|
+ placeholder="请输入分类名称"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button @click="closeTypeDialog">取消</el-button>
|
|
|
+ <el-button type="primary" @click="confirmTypeDialog">
|
|
|
+ 确认
|
|
|
+ </el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -417,4 +577,52 @@ const changeSort = ({ column, prop, order }) => {
|
|
|
.setting {
|
|
|
font-size: 12px;
|
|
|
}
|
|
|
+
|
|
|
+.content-right-box {
|
|
|
+ display: flex;
|
|
|
+ padding: 20px 0;
|
|
|
+
|
|
|
+ .item-left {
|
|
|
+ flex-shrink: 0;
|
|
|
+ width: 200px;
|
|
|
+ margin-right: 20px;
|
|
|
+
|
|
|
+ .item-left-title-box {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-bottom: 30px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item-left-title {
|
|
|
+ font-size: 26px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item-left-list {
|
|
|
+ .item-left-list-item {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-bottom: 10px;
|
|
|
+
|
|
|
+ .type-number {
|
|
|
+ margin-left: 10px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #0052d9;
|
|
|
+ }
|
|
|
+
|
|
|
+ .no-type {
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .item-right {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
