指标管理

龚焕茏

2024-03-22 9ab96bc476c2c64f2bb8bcbf098e0073d1e5d38b

 src/views/sceneryInfo/index.vue

@@ -1,21 +1,14 @@
<template>
  <div class="p-2">
    <el-card shadow="never">
    <el-card shadow="never" style="width: 40%">
      <template #header>
        <el-row :gutter="10" class="mb8">
        <el-row :gutter="20" class="mb8">
          <el-col :span="1.5">
            <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['demo:sceneryInfo:add']">新增</el-button>
            景区配置
          </el-col>
          <el-col :span="1.5">
            <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['demo:sceneryInfo:edit']">修改</el-button>
            <el-button size="small" type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['demo:sceneryInfo:add']">新增</el-button>
          </el-col>
          <el-col :span="1.5">
            <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['demo:sceneryInfo:remove']">删除</el-button>
          </el-col>
          <el-col :span="1.5">
            <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['demo:sceneryInfo:export']">导出</el-button>
          </el-col>
          <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
        </el-row>
      </template>

@@ -44,6 +37,26 @@
          @pagination="getList"
      />
    </el-card>

    <el-card shadow="never" style="width: 40%;margin-top: 20px">
      <template #header>
        <el-row :gutter="10" class="mb8">
          指标配置
        </el-row>
      </template>
      <el-form ref="indicatorInfoFormRef" :model="form" :rules="rules" label-width="80px">
        <el-form-item :label="indicator.indicatorName" v-for="indicator in indicatorInfoList" :key="indicator.id">
          <el-radio-group v-model="indicator.status">
            <el-radio :label="2">接口取值</el-radio>
            <el-radio :label="1">自定义</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
      <div class="dialog-footer">
        <el-button :loading="buttonLoading" type="primary" @click="submitForm2">保 存</el-button>
      </div>
    </el-card>

    <!-- 添加或修改景区配置信息对话框 -->
    <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
      <el-form ref="sceneryInfoFormRef" :model="form" :rules="rules" label-width="80px">
@@ -67,7 +80,12 @@
<script setup name="SceneryInfo" lang="ts">
import { listSceneryInfo, getSceneryInfo, delSceneryInfo, addSceneryInfo, updateSceneryInfo } from '@/api/sceneryInfo';
import { SceneryInfoVO, SceneryInfoQuery, SceneryInfoForm } from '@/api/sceneryInfo/types';
import { listIndicatorInfo, updateIndicatorInfo } from '@/api/indicatorInfo';
import { IndicatorInfoVO } from '@/api/indicatorInfo/types';
import { ElButton, ElForm, ElFormItem, ElRadio, ElRadioGroup } from "element-plus";
import { ref } from "vue";

const indicatorInfoList = ref<IndicatorInfoVO[]>([]);
const { proxy } = getCurrentInstance() as ComponentInternalInstance;

const sceneryInfoList = ref<SceneryInfoVO[]>([]);
@@ -125,10 +143,12 @@

/** 查询景区配置信息列表 */
const getList = async () => {
  loading.value = true;
  const res = await listSceneryInfo(queryParams.value);
  sceneryInfoList.value = res.rows;
  total.value = res.total;

  const res2 = await listIndicatorInfo(queryParams.value);
  indicatorInfoList.value = res2.rows;
  loading.value = false;
}

@@ -213,6 +233,26 @@
  }, `sceneryInfo_${new Date().getTime()}.xlsx`)
}

/** 指标保存按钮 */
const submitForm2 = async () => {
  try {
    // 循环提交每个单独的对象
    for (const indicator of indicatorInfoList.value) {
      const object = {
        id: indicator.id,
        status: indicator.status
      };
      await updateIndicatorInfo(object);
    }
    await getList();
    proxy?.$modal.msgSuccess("修改成功");
  } catch (error) {
    console.error(error);
  } finally {
    buttonLoading.value = false;
  }
}

onMounted(() => {
  getList();
});