机构管理、用户管理完成；火灾管理详情页显示，添加地图

guoshilong

2023-03-06 85cec9a000cae214496feaea25f71c66f5663c2a

 src/views/fire/fireManage.vue

@@ -1,48 +1,58 @@
<template>
  <basic-container>
    <avue-crud :option="option"
               :table-loading="loading"
               :data="data"
               :page.sync="page"
               :permission="permissionList"
               :before-open="beforeOpen"
               v-model="form"
               ref="crud"
               @row-update="rowUpdate"
               @row-save="rowSave"
               @row-del="rowDel"
               @search-change="searchChange"
               @search-reset="searchReset"
               @selection-change="selectionChange"
               @current-change="currentChange"
               @size-change="sizeChange"
               @refresh-change="refreshChange"
               @on-load="onLoad">
      <template slot="menuLeft">
        <el-button type="danger"
                   size="small"
                   icon="el-icon-delete"
                   plain
                   v-if="permission.fire_delete"
                   @click="handleDelete">删 除
        </el-button>
      </template>
      <template slot-scope="{type,size,row,index}" slot="menu">
        <el-button icon="el-icon-edit" :size="size" :type="type" @click="goToViewDetail">详 情</el-button>
        <el-button icon="el-icon-delete" :size="size" :type="type" @click="goToFireSupplement(row)">补 录</el-button>
      </template>
    </avue-crud>
  </basic-container>
  <div>
    <basic-container v-if="!isDetail">
      <avue-crud :option="option"
                 :table-loading="loading"
                 :data="data"
                 :page.sync="page"
                 :permission="permissionList"
                 :before-open="beforeOpen"
                 v-model="form"
                 ref="crud"
                 @row-update="rowUpdate"
                 @row-save="rowSave"
                 @row-del="rowDel"
                 @search-change="searchChange"
                 @search-reset="searchReset"
                 @selection-change="selectionChange"
                 @current-change="currentChange"
                 @size-change="sizeChange"
                 @refresh-change="refreshChange"
                 @on-load="onLoad">
        <template slot="menuLeft">
          <el-button type="danger"
                     size="small"
                     icon="el-icon-delete"
                     plain
                     v-if="permission.fire_delete"
                     @click="handleDelete">删 除
          </el-button>
        </template>

        <!--      <template slot-scope="{row}" slot="location">-->
        <!--        {{row.$location.split("|").join("")}}-->
        <!--      </template>-->

        <template slot-scope="{type,size,row,index}" slot="menu">
          <el-button icon="el-icon-edit" :size="size" :type="type" @click="goToViewDetail(row)">详 情</el-button>
          <el-button icon="el-icon-delete" :size="size" :type="type" @click="goToFireSupplement(row)">补 录</el-button>
        </template>
      </avue-crud>
    </basic-container>
    <FireSupplieMent ref="supplement" v-if="isDetail" :info="info" @goToList="goToList"></FireSupplieMent>
  </div>

</template>

<script>
import {getList, getDetail, add, update, remove} from "@/api/fire/fire";
import {getDetail as getSupplementDetail} from "@/api/fireSupplement/fireSupplement"
import {mapGetters} from "vuex";
import axios from "@/router/axios";
import FireSupplieMent from "@/views/fire/fireSupplement";

export default {
  components: {FireSupplieMent},
  data() {
    let baseUrl = '/api/blade-system/region/lazy-tree?parentCode='
    return {
      form: {},
      query: {},
@@ -87,48 +97,14 @@
          {
            label: "行政区域",
            prop: "location",
            search: true,
            searchSpan: 4,
            span: 24,
            type: "cascader",
            props: {
              label: 'title',
              value: 'key'
            },
            separator: '',
            lazy: true,
            lazyLoad(node, resolve) {
              let stop_level = 2;
              let level = node.level;
              let data = node.data || {}
              let code = data.key;
              let list = [];
              let callback = () => {
                resolve((list || []).map(ele => {
                  return Object.assign(ele, {
                    leaf: level >= stop_level
                  })
                }));
              }
              if (level == 0) {
                axios.get(`${baseUrl}00`).then(res => {
                  list = res.data.data;
                  callback()
                })
              } else if (level == 1) {
                axios.get(`${baseUrl}${code}`).then(res => {
                  list = res.data.data;
                  callback()
                })
              } else if (level == 2) {
                axios.get(`${baseUrl}${code}`).then(res => {
                  list = res.data.data;
                  callback()
                })
              } else {
                callback()
              }
            }
            dicUrl: 'api/blade-system/region/lazy-tree',
            slot: true
          },
          {
            label: "发现方式",
@@ -259,7 +235,9 @@
          },
        ]
      },
      data: []
      data: [],
      isDetail: false,
      info:{},
    };
  },
  computed: {
@@ -278,7 +256,7 @@
        ids.push(ele.id);
      });
      return ids.join(",");
    }
    },
  },
  methods: {
    rowSave(row, done, loading) {
@@ -393,16 +371,28 @@
        this.selectionClear();
      });
    },
    goToViewDetail(){

    goToViewDetail(data) {
      getSupplementDetail(data.id).then(res => {
        if (res.data.code == 200) {
          let formSupplementData = res.data.data
           this.info = {
            isDetail:true,
            formData:data,
            formSupplementData:formSupplementData,
          }
          this.isDetail = !this.isDetail
        }
      })
    },
    goToFireSupplement(data){
    goToFireSupplement(data) {
      //要使跳转页接收到值,必须用name
      this.$router.push({
        name: '火灾补录',
        params: data
      })

    },
    goToList(){
      this.isDetail = !this.isDetail
    }
  }
};