feat(基础数据): 新增油库信息/储罐信息页面(移植自新疆融邦环保分支)

- src/views/basicData/oilDepot/index.vue、src/views/basicData/tankInfo/index.vue
- src/api/basicData/oilDepot.js、src/api/basicData/tankInfo.js
- 对应菜单:基础数据 → 油库信息(oilDepot)、储罐信息(tankInfo)
已添加4个文件
893 ■■■■■ 文件已修改
src/api/basicData/oilDepot.js 53 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/api/basicData/tankInfo.js 53 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/basicData/oilDepot/index.vue 297 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/basicData/tankInfo/index.vue 490 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/api/basicData/oilDepot.js
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,53 @@
import request from '@/utils/request'
// åˆ†é¡µæŸ¥è¯¢æ²¹åº“信息列表
export function listOilDepot(query) {
  return request({
    url: '/basic/oilDepot/list',
    method: 'get',
    params: query
  })
}
// æŸ¥è¯¢å…¨éƒ¨æ²¹åº“信息(供下拉选择)
export function allOilDepot() {
  return request({
    url: '/basic/oilDepot/all',
    method: 'get'
  })
}
// æŸ¥è¯¢æ²¹åº“信息详情
export function getOilDepot(id) {
  return request({
    url: '/basic/oilDepot/' + id,
    method: 'get'
  })
}
// æ–°å¢žæ²¹åº“信息
export function addOilDepot(data) {
  return request({
    url: '/basic/oilDepot/add',
    method: 'post',
    data: data
  })
}
// ä¿®æ”¹æ²¹åº“信息
export function updateOilDepot(data) {
  return request({
    url: '/basic/oilDepot/update',
    method: 'post',
    data: data
  })
}
// åˆ é™¤æ²¹åº“信息
export function delOilDepot(ids) {
  return request({
    url: '/basic/oilDepot/del',
    method: 'delete',
    data: ids
  })
}
src/api/basicData/tankInfo.js
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,53 @@
import request from '@/utils/request'
// åˆ†é¡µæŸ¥è¯¢å‚¨ç½ä¿¡æ¯åˆ—表
export function listTankInfo(query) {
  return request({
    url: '/basic/tankInfo/list',
    method: 'get',
    params: query
  })
}
// æŸ¥è¯¢å…¨éƒ¨å‚¨ç½ä¿¡æ¯ï¼ˆä¾›ä¸‹æ‹‰é€‰æ‹©ï¼‰
export function allTankInfo() {
  return request({
    url: '/basic/tankInfo/all',
    method: 'get'
  })
}
// æŸ¥è¯¢å‚¨ç½ä¿¡æ¯è¯¦æƒ…
export function getTankInfo(id) {
  return request({
    url: '/basic/tankInfo/' + id,
    method: 'get'
  })
}
// æ–°å¢žå‚¨ç½ä¿¡æ¯
export function addTankInfo(data) {
  return request({
    url: '/basic/tankInfo/add',
    method: 'post',
    data: data
  })
}
// ä¿®æ”¹å‚¨ç½ä¿¡æ¯
export function updateTankInfo(data) {
  return request({
    url: '/basic/tankInfo/update',
    method: 'post',
    data: data
  })
}
// åˆ é™¤å‚¨ç½ä¿¡æ¯
export function delTankInfo(ids) {
  return request({
    url: '/basic/tankInfo/del',
    method: 'delete',
    data: ids
  })
}
src/views/basicData/oilDepot/index.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,297 @@
<template>
  <div class="app-container">
    <div class="search_form">
      <div>
        <el-form :model="searchForm"
                 :inline="true">
          <el-form-item label="油库名称:">
            <el-input v-model="searchForm.depotName"
                      placeholder="请输入"
                      clearable
                      prefix-icon="Search"
                      @change="handleQuery" />
          </el-form-item>
          <el-form-item label="所属公司:">
            <el-input v-model="searchForm.company"
                      placeholder="请输入"
                      clearable
                      prefix-icon="Search"
                      @change="handleQuery" />
          </el-form-item>
          <el-form-item>
            <el-button type="primary"
                       @click="handleQuery"> æœç´¢
            </el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
    <div class="table_list">
      <div style="display: flex;justify-content: flex-end;margin-bottom: 20px;">
        <el-button type="primary"
                   @click="openForm('add')">新增油库</el-button>
        <el-button type="danger"
                   plain
                   @click="handleDelete">删除
        </el-button>
      </div>
      <el-table :data="tableData"
                border
                v-loading="tableLoading"
                @selection-change="handleSelectionChange">
        <el-table-column align="center"
                         type="selection"
                         width="55" />
        <el-table-column align="center"
                         label="序号"
                         type="index"
                         width="60" />
        <el-table-column label="油库名称"
                         prop="depotName"
                         show-overflow-tooltip />
        <el-table-column label="负责人"
                         prop="chargePerson"
                         width="120"
                         show-overflow-tooltip />
        <el-table-column label="联系电话"
                         prop="phone"
                         width="140" />
        <el-table-column label="启用日期"
                         prop="enableDate"
                         width="120" />
        <el-table-column label="所属公司"
                         prop="company"
                         show-overflow-tooltip />
        <el-table-column label="创建时间"
                         prop="createTime"
                         width="180">
          <template #default="scope">
            {{ scope.row.createTime ? scope.row.createTime.replace('T', ' ').slice(0, 19) : '--' }}
          </template>
        </el-table-column>
        <el-table-column fixed="right"
                         label="操作"
                         width="120"
                         align="center">
          <template #default="scope">
            <el-button link
                       type="primary"
                       @click="openForm('edit', scope.row)">编辑
            </el-button>
            <el-button link
                       type="danger"
                       @click="handleDelete([scope.row])">删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination v-show="total > 0"
                  :total="total"
                  layout="total, sizes, prev, pager, next, jumper"
                  :page="page.current"
                  :limit="page.size"
                  @pagination="paginationChange" />
    </div>
    <FormDialog v-model="dialogFormVisible"
                :title="operationType === 'add' ? '新增油库' : '编辑油库'"
                :width="'40%'"
                :operation-type="operationType"
                @close="closeDia"
                @confirm="submitForm"
                @cancel="closeDia">
      <el-form :model="form"
               label-width="120px"
               label-position="top"
               :rules="rules"
               ref="formRef">
        <el-row :gutter="30">
          <el-col :span="24">
            <el-form-item label="油库名称:"
                          prop="depotName">
              <el-input v-model="form.depotName"
                        placeholder="请输入"
                        clearable />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="负责人:"
                          prop="chargePerson">
              <el-input v-model="form.chargePerson"
                        placeholder="请输入"
                        clearable />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系电话:"
                          prop="phone">
              <el-input v-model="form.phone"
                        placeholder="请输入"
                        clearable />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="启用日期:"
                          prop="enableDate">
              <el-date-picker style="width: 100%"
                              v-model="form.enableDate"
                              value-format="YYYY-MM-DD"
                              format="YYYY-MM-DD"
                              type="date"
                              placeholder="请选择"
                              clearable />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="所属公司:"
                          prop="company">
              <el-input v-model="form.company"
                        placeholder="请输入"
                        clearable />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </FormDialog>
  </div>
</template>
<script setup>
  import FormDialog from "@/components/Dialog/FormDialog.vue";
  import pagination from "@/components/PIMTable/Pagination.vue";
  import { ref, reactive, toRefs, getCurrentInstance } from "vue";
  import { Search } from "@element-plus/icons-vue";
  import { ElMessageBox } from "element-plus";
  import {
    listOilDepot,
    addOilDepot,
    updateOilDepot,
    delOilDepot,
  } from "@/api/basicData/oilDepot.js";
  const { proxy } = getCurrentInstance();
  const tableData = ref([]);
  const selectedRows = ref([]);
  const tableLoading = ref(false);
  const dialogFormVisible = ref(false);
  const operationType = ref("");
  const page = reactive({
    current: 1,
    size: 10,
  });
  const total = ref(0);
  const data = reactive({
    searchForm: {
      depotName: "",
      company: "",
    },
    form: {
      id: null,
      depotName: "",
      chargePerson: "",
      phone: "",
      enableDate: "",
      company: "",
    },
    rules: {
      depotName: [{ required: true, message: "请输入油库名称", trigger: "blur" }],
      company: [{ required: true, message: "请输入所属公司", trigger: "blur" }],
    },
  });
  const { searchForm, form, rules } = toRefs(data);
  const getList = () => {
    tableLoading.value = true;
    listOilDepot({ ...searchForm.value, ...page })
      .then(res => {
        tableLoading.value = false;
        tableData.value = res.data.records || [];
        total.value = res.data.total || 0;
      })
      .catch(() => {
        tableLoading.value = false;
      });
  };
  const handleQuery = () => {
    page.current = 1;
    getList();
  };
  const paginationChange = obj => {
    page.current = obj.page;
    page.size = obj.limit;
    getList();
  };
  const handleSelectionChange = selection => {
    selectedRows.value = selection;
  };
  const openForm = (type, row) => {
    operationType.value = type;
    form.value = {};
    proxy.resetForm("formRef");
    dialogFormVisible.value = true;
    if (type === "edit" && row) {
      const { id, depotName, chargePerson, phone, enableDate, company } = row;
      form.value = { id, depotName, chargePerson, phone, enableDate, company };
    }
  };
  const submitForm = () => {
    proxy.$refs["formRef"].validate(valid => {
      if (valid) {
        const api = form.value.id ? updateOilDepot : addOilDepot;
        api(form.value).then(() => {
          proxy.$modal.msgSuccess("操作成功");
          closeDia();
          getList();
        });
      }
    });
  };
  const closeDia = () => {
    proxy.resetForm("formRef");
    dialogFormVisible.value = false;
  };
  const handleDelete = rows => {
    let ids = [];
    if (rows) {
      ids = rows.map(item => item.id);
    } else if (selectedRows.value.length > 0) {
      ids = selectedRows.value.map(item => item.id);
    } else {
      proxy.$modal.msgWarning("请选择数据");
      return;
    }
    ElMessageBox.confirm("选中的内容将被删除,是否确认删除?", "删除", {
      confirmButtonText: "确认",
      cancelButtonText: "取消",
      type: "warning",
    })
      .then(() => {
        delOilDepot(ids).then(() => {
          proxy.$modal.msgSuccess("删除成功");
          getList();
        });
      })
      .catch(() => {
        proxy.$modal.msg("已取消");
      });
  };
  getList();
</script>
<style scoped lang="scss">
  .search_form {
    margin-bottom: 16px;
  }
</style>
src/views/basicData/tankInfo/index.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,490 @@
<template>
  <div class="app-container">
    <div class="search_form">
      <div>
        <el-form :model="searchForm"
                 :inline="true">
          <el-form-item label="储罐号:">
            <el-input v-model="searchForm.tankNo"
                      placeholder="请输入"
                      clearable
                      prefix-icon="Search"
                      @change="handleQuery" />
          </el-form-item>
          <el-form-item label="大类:">
            <el-input v-model="searchForm.category"
                      placeholder="请输入"
                      clearable
                      prefix-icon="Search"
                      @change="handleQuery" />
          </el-form-item>
          <el-form-item label="是否启用:">
            <el-select v-model="searchForm.isEnabled"
                       placeholder="请选择"
                       clearable
                       style="width: 140px"
                       @change="handleQuery">
              <el-option label="启用"
                         :value="1" />
              <el-option label="未启用"
                         :value="0" />
            </el-select>
          </el-form-item>
          <el-form-item label="用途:">
            <el-select v-model="searchForm.usageType"
                       placeholder="请选择"
                       clearable
                       style="width: 140px"
                       @change="handleQuery">
              <el-option label="租赁"
                         :value="1" />
              <el-option label="自用"
                         :value="2" />
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary"
                       @click="handleQuery"> æœç´¢
            </el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
    <div class="table_list">
      <div style="display: flex;justify-content: flex-end;margin-bottom: 20px;">
        <el-button type="primary"
                   @click="openForm('add')">新增储罐</el-button>
        <el-button type="danger"
                   plain
                   @click="handleDelete()">删除
        </el-button>
      </div>
      <el-table :data="tableData"
                border
                v-loading="tableLoading"
                @selection-change="handleSelectionChange">
        <el-table-column align="center"
                         type="selection"
                         width="55" />
        <el-table-column align="center"
                         label="序号"
                         type="index"
                         width="60" />
        <el-table-column label="储罐号"
                         prop="tankNo"
                         min-width="140"
                         show-overflow-tooltip />
        <el-table-column label="大类"
                         prop="category"
                         min-width="120"
                         show-overflow-tooltip />
        <el-table-column label="油品"
                         prop="oilProduct"
                         min-width="120"
                         show-overflow-tooltip />
        <el-table-column label="罐容"
                         prop="capacity"
                         min-width="120" />
        <el-table-column label="库存余量"
                         prop="remaining"
                         min-width="140" />
        <el-table-column label="是否启用"
                         prop="isEnabled"
                         align="center"
                         width="100">
          <template #default="scope">
            <el-tag :type="scope.row.isEnabled === 1 ? 'success' : 'info'"
                    size="small">
              {{ scope.row.isEnabled === 1 ? "启用" : "未启用" }}
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column label="用途"
                         prop="usageType"
                         align="center"
                         width="90">
          <template #default="scope">
            {{ getUsageTypeText(scope.row.usageType) }}
          </template>
        </el-table-column>
        <el-table-column label="租客信息"
                         prop="tenantInfo"
                         min-width="160"
                         show-overflow-tooltip />
        <el-table-column label="创建时间"
                         prop="createTime"
                         min-width="180">
          <template #default="scope">
            {{ scope.row.createTime ? scope.row.createTime.replace('T', ' ').slice(0, 19) : '--' }}
          </template>
        </el-table-column>
        <el-table-column fixed="right"
                         label="操作"
                         width="120"
                         align="center">
          <template #default="scope">
            <el-button link
                       type="primary"
                       @click="openForm('edit', scope.row)">编辑
            </el-button>
            <el-button link
                       type="danger"
                       @click="handleDelete([scope.row])">删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination v-show="total > 0"
                  :total="total"
                  layout="total, sizes, prev, pager, next, jumper"
                  :page="page.current"
                  :limit="page.size"
                  @pagination="paginationChange" />
    </div>
    <FormDialog v-model="dialogFormVisible"
                :title="operationType === 'add' ? '新增储罐' : '编辑储罐'"
                :width="'40%'"
                :operation-type="operationType"
                @close="closeDia"
                @confirm="submitForm"
                @cancel="closeDia">
      <el-form :model="form"
               label-width="120px"
               label-position="top"
               :rules="rules"
               ref="formRef">
        <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="储罐号:"
                          prop="tankNo">
              <el-input v-model="form.tankNo"
                        placeholder="请输入"
                        clearable />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="大类:"
                          prop="category">
              <el-input v-model="form.category"
                        placeholder="请输入"
                        clearable />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="油品:"
                          prop="oilProduct">
              <el-select v-model="form.oilProduct"
                         placeholder="请选择"
                         clearable
                         style="width: 100%">
                <el-option label="æ±½#92"
                           value="æ±½#92" />
                <el-option label="æ±½#95"
                           value="æ±½#95" />
                <el-option label="柴#0"
                           value="柴#0" />
                <el-option label="柴#-35"
                           value="柴#-35" />
                <el-option label="原油"
                           value="原油" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="罐容:"
                          prop="capacity">
              <el-input-number v-model="form.capacity"
                               :precision="2"
                               :step="1"
                               :min="0"
                               style="width: 100%" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="库存余量:"
                          prop="remaining">
              <el-input-number v-model="form.remaining"
                               :precision="2"
                               :step="1"
                               :min="0"
                               style="width: 100%" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="是否启用:"
                          prop="isEnabled">
              <el-switch v-model="form.isEnabled"
                         :active-value="1"
                         :inactive-value="0"
                         active-text="启用"
                         inactive-text="未启用" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30"
                v-if="form.isEnabled === 1">
          <el-col :span="12">
            <el-form-item label="用途:"
                          prop="usageType">
              <el-radio-group v-model="form.usageType">
                <el-radio :value="1">租赁</el-radio>
                <el-radio :value="2">自用</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12"
                  v-if="form.usageType === 1">
            <el-form-item label="租客信息:"
                          prop="tenantInfo"
                          :rules="[
                {
                required: true,
                message: '租赁的储罐必须填写租客信息',
                trigger: 'blur',
              }
            ]">
              <el-select v-model="form.tenantInfo"
                         placeholder="请选择租客"
                         clearable
                         filterable
                         style="width: 100%">
                <el-option v-for="item in tenantSelectOptions"
                           :key="item.id"
                           :label="item.customerName"
                           :value="item.customerName" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </FormDialog>
  </div>
</template>
<script setup>
  import FormDialog from "@/components/Dialog/FormDialog.vue";
  import pagination from "@/components/PIMTable/Pagination.vue";
  import { ref, reactive, toRefs, watch, computed, getCurrentInstance } from "vue";
  import { Search } from "@element-plus/icons-vue";
  import { ElMessageBox } from "element-plus";
  import {
    listTankInfo,
    addTankInfo,
    updateTankInfo,
    delTankInfo,
  } from "@/api/basicData/tankInfo.js";
  import { listCustomer } from "@/api/basicData/customer.js";
  const { proxy } = getCurrentInstance();
  const { customer_type } = proxy.useDict("customer_type");
  const tableData = ref([]);
  const selectedRows = ref([]);
  const tableLoading = ref(false);
  const dialogFormVisible = ref(false);
  const operationType = ref("");
  const page = reactive({
    current: 1,
    size: 10,
  });
  const total = ref(0);
  const data = reactive({
    searchForm: {
      tankNo: "",
      category: "",
      isEnabled: "",
      usageType: "",
    },
    form: {
      id: null,
      tankNo: "",
      category: "",
      oilProduct: "",
      capacity: null,
      remaining: null,
      isEnabled: 1,
      usageType: null,
      tenantInfo: "",
    },
    rules: {
      tankNo: [{ required: true, message: "请输入储罐号", trigger: "blur" }],
      category: [{ required: true, message: "请输入大类", trigger: "blur" }],
    },
  });
  const { searchForm, form, rules } = toRefs(data);
  // ç”¨é€”文案:1 ç§Ÿèµ / 2 è‡ªç”¨
  const getUsageTypeText = value => ({ 1: "租赁", 2: "自用" })[value] || "--";
  // ç§Ÿå®¢åªèƒ½ä»Žã€Œä»£å‚¨å®¢æˆ·ã€åˆ†ç±»é‡Œé€‰ï¼›å­—典的 value æœªå¿…就是中文标签,按 label åæŸ¥çœŸå®žå–值
  const tenantOptions = ref([]);
  let loadedTenantType = null;
  const loadTenantOptions = () => {
    const hit = (customer_type.value || []).find(
      item => item.label === "代储客户"
    );
    const customerType = hit ? hit.value : "代储客户";
    if (customerType === loadedTenantType) return;
    loadedTenantType = customerType;
    listCustomer({ current: -1, size: -1, customerType }).then(res => {
      tenantOptions.value = res.data.records || [];
    });
  };
  // å­—典异步到达后再拉一次;字典命中缓存时 immediate è¿™ä¸€æ¬¡å°±å¤Ÿäº†
  watch(customer_type, loadTenantOptions, { immediate: true });
  // åŽ†å²æ•°æ®æ˜¯æ‰‹å·¥å¡«çš„ç§Ÿå®¢åï¼Œæœªå¿…è¿˜åœ¨ä»£å‚¨å®¢æˆ·åˆ—è¡¨é‡Œï¼Œè¡¥ä¸€ä¸ªä¸´æ—¶é€‰é¡¹ä¿è¯å›žæ˜¾
  const tenantSelectOptions = computed(() => {
    const list = tenantOptions.value;
    const current = form.value.tenantInfo;
    if (current && !list.some(item => item.customerName === current)) {
      return [...list, { id: `legacy-${current}`, customerName: current }];
    }
    return list;
  });
  // æœªå¯ç”¨æ—¶ç”¨é€”与租客信息一律清空;选自用时租客信息自动清空(租赁才需要租客)
  watch(
    () => [form.value.isEnabled, form.value.usageType],
    () => {
      if (form.value.isEnabled !== 1) {
        form.value.usageType = null;
        form.value.tenantInfo = "";
        return;
      }
      if (form.value.usageType !== 1) {
        form.value.tenantInfo = "";
      }
    }
  );
  const getList = () => {
    tableLoading.value = true;
    listTankInfo({ ...searchForm.value, ...page })
      .then(res => {
        tableLoading.value = false;
        tableData.value = res.data.records || [];
        total.value = res.data.total || 0;
      })
      .catch(() => {
        tableLoading.value = false;
      });
  };
  const handleQuery = () => {
    page.current = 1;
    getList();
  };
  const paginationChange = obj => {
    page.current = obj.page;
    page.size = obj.limit;
    getList();
  };
  const handleSelectionChange = selection => {
    selectedRows.value = selection;
  };
  const buildEmptyForm = () => ({
    id: null,
    tankNo: "",
    category: "",
    oilProduct: "",
    capacity: null,
    remaining: null,
    isEnabled: 1,
    usageType: null,
    tenantInfo: "",
  });
  const openForm = (type, row) => {
    operationType.value = type;
    // å…ˆé‡ç½®å†èµ‹å€¼ï¼šresetFields ä¼šæŠŠå­—段打回挂载时的初值,放后面会把刚填好的值清掉
    proxy.resetForm("formRef");
    form.value = buildEmptyForm();
    dialogFormVisible.value = true;
    if (type === "edit" && row) {
      const {
        id,
        tankNo,
        category,
        oilProduct,
        capacity,
        remaining,
        isEnabled,
        usageType,
        tenantInfo,
      } = row;
      form.value = {
        ...buildEmptyForm(),
        id,
        tankNo,
        category,
        oilProduct,
        capacity,
        remaining,
        // åŽ†å²æ•°æ®æ²¡æœ‰è¯¥å­—æ®µï¼Œç¼ºå¤±æ—¶æŒ‰ã€Œå¯ç”¨ã€å¤„ç†ï¼Œé¿å…ä¿å­˜æ—¶è¢«è¯¯ç½®ä¸ºæœªå¯ç”¨
        isEnabled: isEnabled ?? 1,
        usageType: usageType ?? null,
        tenantInfo: tenantInfo ?? "",
      };
    }
  };
  const submitForm = () => {
    proxy.$refs["formRef"].validate(valid => {
      if (valid) {
        const api = form.value.id ? updateTankInfo : addTankInfo;
        api(form.value).then(() => {
          proxy.$modal.msgSuccess("操作成功");
          closeDia();
          getList();
        });
      }
    });
  };
  const closeDia = () => {
    proxy.resetForm("formRef");
    dialogFormVisible.value = false;
  };
  const handleDelete = rows => {
    let ids = [];
    if (rows) {
      ids = rows.map(item => item.id);
    } else if (selectedRows.value.length > 0) {
      ids = selectedRows.value.map(item => item.id);
    } else {
      proxy.$modal.msgWarning("请选择数据");
      return;
    }
    ElMessageBox.confirm("选中的内容将被删除,是否确认删除?", "删除", {
      confirmButtonText: "确认",
      cancelButtonText: "取消",
      type: "warning",
    })
      .then(() => {
        delTankInfo(ids).then(() => {
          proxy.$modal.msgSuccess("删除成功");
          getList();
        });
      })
      .catch(() => {
        proxy.$modal.msg("已取消");
      });
  };
  getList();
</script>
<style scoped lang="scss">
  .search_form {
    margin-bottom: 16px;
  }
</style>