From a4831debee63c7071a261c5f6ecfa62fd535b2ab Mon Sep 17 00:00:00 2001
From: quanyawei <401863037@qq.com>
Date: Thu, 25 Jan 2024 16:21:18 +0800
Subject: [PATCH] 分页修改

---
 src/views/list/devicesMonitorPoint.vue | 1023 +++++++++++++++++++++++++++++++-------------------------
 1 files changed, 562 insertions(+), 461 deletions(-)

diff --git a/src/views/list/devicesMonitorPoint.vue b/src/views/list/devicesMonitorPoint.vue
index 72a390a..94c2db9 100644
--- a/src/views/list/devicesMonitorPoint.vue
+++ b/src/views/list/devicesMonitorPoint.vue
@@ -1,543 +1,644 @@
 <template>
-    <div>
-        <a-card :bordered="false" style="margin-top:24px">
-            <div class="tableList">
-                <div class="tableListForm">
-                    <a-form @submit="handleSearch" layout="horizontal" :form="searchForm">
-                        <a-row :gutter="{ md: 8, lg: 24, xl: 48 }">
-                            <a-button icon="plus" type="primary" @click="() => this.handleModalVisible(true)" style="margin-left: 25px;">
-                                ������
-                            </a-button>
-                            <div style="float:right;display:flex">
-                                <span style="margin-top:10px;margin-right:10px;font-size:14px">������: </span>
-                                <a-select
-                                    placeholder="������������(������������������)"
-                                    :value="selectedItems"
-                                    style="width: 240px;margin-top:4px"
-                                    @change="handleChange"
-                                    :filter-option="filteredOptions"
-                                    allow-clear
-                                    show-search
-                                >
-                                    <a-select-option v-for="(item,index) in orgData" :key="index" :value="item.id">
-                                    {{ item.name }}
-                                    </a-select-option>
-                                </a-select>
-                                <a-form-item  v-bind="searchFormLayout" style="width: 240px">
-                                    <a-input v-model="serch.name"  placeholder="���������������������" allow-clear />
-                                </a-form-item>
-                            </div>
-                        </a-row>
-                    </a-form>
-                </div>
-            <av-standard-table :dataSource="dataSource"
-                     :selectedRows="selectedRows"
-                     :columns="columns"
-                     :loading="tableLoading"
-                     :paginationProps="pagination"
-                     @tableChange="handlerTableChange"
-                     @selectChange="handlerSelectChange">
-                <!-- <template slot="organizationId" >
+  <div>
+    <a-card :bordered="false" style="margin-top:24px">
+      <div class="tableList">
+        <div class="tableListForm">
+          <a-form @submit="handleSearch" layout="horizontal" :form="searchForm">
+            <a-row :gutter="{ md: 8, lg: 24, xl: 48 }">
+              <a-button
+                icon="plus"
+                type="primary"
+                @click="() => this.handleModalVisible(true)"
+                style="margin-left: 25px;"
+              >
+                ������
+              </a-button>
+              <div style="float:right;display:flex">
+                <span style="margin-top:10px;margin-right:10px;font-size:14px"
+                  >������:
+                </span>
+                <a-select
+                  placeholder="������������(������������������)"
+                  :value="selectedItems"
+                  style="width: 240px;margin-top:4px"
+                  @change="handleChange"
+                  :filter-option="filteredOptions"
+                  allow-clear
+                  show-search
+                >
+                  <a-select-option
+                    v-for="(item, index) in orgData"
+                    :key="index"
+                    :value="item.id"
+                  >
+                    {{ item.name }}
+                  </a-select-option>
+                </a-select>
+                <a-form-item v-bind="searchFormLayout" style="width: 240px">
+                  <a-input
+                    v-model="serch.name"
+                    placeholder="���������������������"
+                    allow-clear
+                  />
+                </a-form-item>
+              </div>
+            </a-row>
+          </a-form>
+        </div>
+        <av-standard-table
+          :dataSource="dataSource"
+          :selectedRows="selectedRows"
+          :columns="columns"
+          :loading="tableLoading"
+          :paginationProps="pagination"
+          @tableChange="handlerTableChange"
+          @selectChange="handlerSelectChange"
+        >
+          <!-- <template slot="organizationId" >
                     <div v-for="(item,index) in orgData" :key="index">{{item.name}}</div>
                 </template> -->
-                <!-- <template slot="region" >
+          <!-- <template slot="region" >
                     <div v-for="(item,index) in regionData" :key="index">
                         {{item}}
                     </div>
                 </template> -->
-            </av-standard-table>
-        </div>
+        </av-standard-table>
+      </div>
     </a-card>
 
-    <a-modal title="������-������" destroyOnClose :visible="visibleCreateModal" @ok="handleCreateModalOk" @cancel="handleCreateModalCancel">
-        <a-form style="margin-top: 8px" :form="createForm">
-            <a-form-item :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="������" has-feedback>
-                <a-input placeholder="���������" v-decorator="['name', { rules: [{ required: true, message: '������������������', min: 1 }] }]"/>
-            </a-form-item>
-            <a-form-item :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="������" has-feedback >
-                <a-select
-                    v-decorator="['organizationId', { rules: [{ required: true, message: '������������������' }] }]"
-                    placeholder="������������(������������������)"
-                    style="width: 240px;margin-top:4px"
-                    :filter-option="filteredOptions"
-                    allow-clear
-                    show-search
-                >
-                    <a-select-option v-for="(item,index) in orgData" :key="index" :value="item.id">
-                    {{ item.name }}
-                    </a-select-option>
-                </a-select>
-            </a-form-item>
-            <a-form-item :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="���/���/���" has-feedback >
-                <a-cascader v-decorator="['provinceCode', { rules: [{ required: true, message: '������������������'}] }]" :options="region" placeholder="������������"  @change="onChangeReginon" />
-            </a-form-item>
-            <a-form-item :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="������������">
-                <a-input v-decorator="['address']" placeholder="���������" />
-            </a-form-item>
-            <a-form-item :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="������">
-                <a-input v-decorator="['longitude']" placeholder="���������" />
-            </a-form-item>
-            <a-form-item :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="������">
-                <a-input v-decorator="['latitude']" placeholder="���������" />
-            </a-form-item>
-            <a-form-item :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="������">
-                <a-input v-decorator="['desc']" placeholder="���������" />
-            </a-form-item>
-        </a-form>
+    <a-modal
+      title="������-������"
+      destroyOnClose
+      :visible="visibleCreateModal"
+      @ok="handleCreateModalOk"
+      @cancel="handleCreateModalCancel"
+    >
+      <a-form style="margin-top: 8px" :form="createForm">
+        <a-form-item
+          :labelCol="{ span: 5 }"
+          :wrapperCol="{ span: 15 }"
+          label="������"
+          has-feedback
+        >
+          <a-input
+            placeholder="���������"
+            v-decorator="[
+              'name',
+              { rules: [{ required: true, message: '������������������', min: 1 }] },
+            ]"
+          />
+        </a-form-item>
+        <a-form-item
+          :labelCol="{ span: 5 }"
+          :wrapperCol="{ span: 15 }"
+          label="������"
+          has-feedback
+        >
+          <a-select
+            v-decorator="[
+              'organizationId',
+              { rules: [{ required: true, message: '������������������' }] },
+            ]"
+            placeholder="������������(������������������)"
+            style="width: 240px;margin-top:4px"
+            :filter-option="filteredOptions"
+            allow-clear
+            show-search
+          >
+            <a-select-option
+              v-for="(item, index) in orgData"
+              :key="index"
+              :value="item.id"
+            >
+              {{ item.name }}
+            </a-select-option>
+          </a-select>
+        </a-form-item>
+        <a-form-item
+          :labelCol="{ span: 5 }"
+          :wrapperCol="{ span: 15 }"
+          label="���/���/���"
+          has-feedback
+        >
+          <a-cascader
+            v-decorator="[
+              'provinceCode',
+              { rules: [{ required: true, message: '������������������' }] },
+            ]"
+            :options="region"
+            placeholder="������������"
+            @change="onChangeReginon"
+          />
+        </a-form-item>
+        <a-form-item
+          :labelCol="{ span: 5 }"
+          :wrapperCol="{ span: 15 }"
+          label="������������"
+        >
+          <a-input v-decorator="['address']" placeholder="���������" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="{ span: 5 }"
+          :wrapperCol="{ span: 15 }"
+          label="������"
+        >
+          <a-input v-decorator="['longitude']" placeholder="���������" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="{ span: 5 }"
+          :wrapperCol="{ span: 15 }"
+          label="������"
+        >
+          <a-input v-decorator="['latitude']" placeholder="���������" />
+        </a-form-item>
+        <a-form-item
+          :labelCol="{ span: 5 }"
+          :wrapperCol="{ span: 15 }"
+          label="������"
+        >
+          <a-input v-decorator="['desc']" placeholder="���������" />
+        </a-form-item>
+      </a-form>
     </a-modal>
 
-    <update-task-form :visible.sync="updateTaskFormVisible" :record="updateRecord" @ok="handleUpdateOk"></update-task-form>
+    <update-task-form
+      :visible.sync="updateTaskFormVisible"
+      :record="updateRecord"
+      @ok="handleUpdateOk"
+    ></update-task-form>
 
-    <distribution-monitor  :width="modelSize.width" :height="modelSize.height"  :visible.sync="distributionMenuVisible" :record="updateRecord1" @ok="handleUpdateOk"></distribution-monitor>
+    <distribution-monitor
+      :width="modelSize.width"
+      :height="modelSize.height"
+      :visible.sync="distributionMenuVisible"
+      :record="updateRecord1"
+      @ok="handleUpdateOk"
+    ></distribution-monitor>
 
-    <pick-coordinate :mapUrl="mapUrl" :mapRecord="mapRecord"  v-if="!mapFlag" @mapFlag="receiveFlag"/>
-
-</div>
+    <pick-coordinate
+      :mapUrl="mapUrl"
+      :mapRecord="mapRecord"
+      v-if="!mapFlag"
+      @mapFlag="receiveFlag"
+    />
+  </div>
 </template>
 
 <script lang="tsx">
-import {
-    Component,
-    Prop,
-    Vue,
-    Model,
-    Watch
-} from 'vue-property-decorator';
+import { Component, Prop, Vue, Model, Watch } from "vue-property-decorator";
 
-
-import moment from 'moment';
+import moment from "moment";
 import { get, post } from "@/util/request";
-import org from '@/util/org'
+import org from "@/util/org";
 
-import { Observable, Subscription, BehaviorSubject } from 'rxjs';
+import { Observable, Subscription, BehaviorSubject } from "rxjs";
 
-import UpdateTaskForm from './components/UpdateTaskFormMonitor.vue';
-import DistributionMonitor from './components/DistributionMonitor.vue'
+import UpdateTaskForm from "./components/UpdateTaskFormMonitor.vue";
+import DistributionMonitor from "./components/DistributionMonitor.vue";
 
-import TestModal from './components/TestModal.vue';
+import TestModal from "./components/TestModal.vue";
 import PickCoordinate from "@/components/map/pickCoordinate.vue";
 
-const statusMap = ['default', 'processing', 'success', 'error'];
-const status = ['������', '���������', '���������', '������'];
-const OPTIONS = ['Apples', 'Nails', 'Bananas', 'Helicopters'];
+const statusMap = ["default", "processing", "success", "error"];
+const status = ["������", "���������", "���������", "������"];
+const OPTIONS = ["Apples", "Nails", "Bananas", "Helicopters"];
 @Component({
-    components: {
-        UpdateTaskForm,
-        DistributionMonitor,
-        PickCoordinate
-    },
+  components: {
+    UpdateTaskForm,
+    DistributionMonitor,
+    PickCoordinate,
+  },
 })
 export default class QueryList extends Vue {
-    private region:any
+  private region: any;
 
-    private searchForm: any;
+  private searchForm: any;
 
   private pagination: any = {
     total: 0,
     current: 1,
-    pageSize: 8,
-    showSizeChanger: false,
-    showQuickJumper: false
+    pageSize: 10,
+    showSizeChanger: true,
+    showQuickJumper: true,
+    pageSizeOptions: ["10", "30", "60", "100"],
+    showTotal: (total: number) => `������ ${this.pagination.total} ���������`, //���������������������������
   };
-    private serch:any = {
-        name:''
-    }
-    // ������������������
-    private regionCode:number[] = []
-    private searchFormLayout: any = {
-        labelCol: {
-            span: 5,
-        },
-        wrapperCol: {
-            span: 18,
-            offset: 1,
-        },
-    };
+  private serch: any = {
+    name: "",
+  };
+  // ������������������
+  private regionCode: number[] = [];
+  private searchFormLayout: any = {
+    labelCol: {
+      span: 5,
+    },
+    wrapperCol: {
+      span: 18,
+      offset: 1,
+    },
+  };
 
-    private modelSize:any={
-        width:500,
-        height:500
-    }
+  private modelSize: any = {
+    width: 500,
+    height: 500,
+  };
 
-    private saveData:any={
-        name:'',
-        organizationId:'',
-        provinceCode:'',
-        cityCode:'',
-        areaCode:'',
-        longitude:'',
-        latitude:'',
-        address:'',
-        desc: '',
-    }
+  private saveData: any = {
+    name: "",
+    organizationId: "",
+    provinceCode: "",
+    cityCode: "",
+    areaCode: "",
+    longitude: "",
+    latitude: "",
+    address: "",
+    desc: "",
+  };
 
-    private mapRecord: any = {}
+  private mapRecord: any = {};
 
-    private mapUrl:string = 'monitorPoint/updateMonitorPoint'
+  private mapUrl: string = "monitorPoint/updateMonitorPoint";
 
-    // ������������������������
-    private onChangeReginon(value: any){
-      this.regionCode = value
-    }
+  // ������������������������
+  private onChangeReginon(value: any) {
+    this.regionCode = value;
+  }
 
-    // ���������������������
-    private selectedItems:any[]=[]
+  // ���������������������
+  private selectedItems: any[] = [];
 
-    // ���������������
-    private filteredOptions(input:any,option:any) {
-      return (
-        option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
-        );
-    }
+  // ���������������
+  private filteredOptions(input: any, option: any) {
+    return (
+      option.componentOptions.children[0].text
+        .toLowerCase()
+        .indexOf(input.toLowerCase()) >= 0
+    );
+  }
 
-    //���������������������
-    private handleChange(selectedItems:any) {
-      this.selectedItems = selectedItems;
-      this.handleSearch()
-    }
+  //���������������������
+  private handleChange(selectedItems: any) {
+    this.selectedItems = selectedItems;
+    this.handleSearch();
+  }
 
-    // ������������
-    private orgData:any = {}
+  // ������������
+  private orgData: any = {};
 
-    // ������������������
-    private getAllOrg(){
-        get("organization/queryNames", {}
-        ).then(res => {
-          this.orgData = res.data.data.organizationVOs.reverse()
-        })
-    }
+  // ������������������
+  private getAllOrg() {
+    get("organization/queryNames", {}).then((res) => {
+      this.orgData = res.data.data.organizationVOs.reverse();
+    });
+  }
 
-    @Watch('serch.name')
-    private watchsearchInform(newVal:string,oldval:string){
-      this.pagination.current = 1
-            this.handleSearch()
-    }
+  @Watch("serch.name")
+  private watchsearchInform(newVal: string, oldval: string) {
+    this.pagination.current = 1;
+    this.handleSearch();
+  }
 
-    private created() {
-        this.createForm = this.$form.createForm(this, {name: "devicesMonitorPoint"});
-        this.searchForm = this.$form.createForm(this, {name: "devicesMonitorPoint"});
-        this.getAllOrg()
-        this.region = org
-    }
-    private expandForm: boolean = false;
+  private created() {
+    this.createForm = this.$form.createForm(this, {
+      name: "devicesMonitorPoint",
+    });
+    this.searchForm = this.$form.createForm(this, {
+      name: "devicesMonitorPoint",
+    });
+    this.getAllOrg();
+    this.region = org;
+  }
+  private expandForm: boolean = false;
 
-    private selectedRowKeys: any[] = [];
+  private selectedRowKeys: any[] = [];
 
-    private selectedRows: any[] = [];
+  private selectedRows: any[] = [];
 
-    private tableLoading: boolean = false;
+  private tableLoading: boolean = false;
 
-    private moment: any = moment;
+  private moment: any = moment;
 
-    private dataSource: any[] = [];
+  private dataSource: any[] = [];
 
-    private regionData:number[]=[]
+  private regionData: number[] = [];
 
-    private visibleCreateModal: boolean = false;
+  private visibleCreateModal: boolean = false;
 
-    private updateTaskFormVisible: boolean = false;
+  private updateTaskFormVisible: boolean = false;
 
-    private distributionMenuVisible: boolean = false;
+  private distributionMenuVisible: boolean = false;
 
-    private createForm: any = null;
+  private createForm: any = null;
 
-    private updateRecord: any = {};
+  private updateRecord: any = {};
 
-    private updateRecord1: any = {};
-    // ���������������������
-    private monitorPoints:any = {}
+  private updateRecord1: any = {};
+  // ���������������������
+  private monitorPoints: any = {};
 
-    private columns: any[] = [{
-            title: '������',
-            dataIndex: 'name',
-        },
-        {
-            title: '������',
-            dataIndex: 'organizationName',
-            width: '10%',
-            // scopedSlots: { customRender: 'organizationId' },
-        },
-        {
-            title: '���������',
-            dataIndex: 'tempRegionData',
-            // scopedSlots: { customRender: 'region' },
-        },
-        {
-            title: '������',
-            dataIndex: 'address',
-        },
-        {
-            title: '������',
-            dataIndex: 'longitude',
-        },
-        {
-            title: '������',
-            dataIndex: 'latitude',
-        },
-        {
-            title: '������',
-            dataIndex: 'desc',
-        },
-        {
-            title: '������',
-            customRender: this.opRender,
-        },
+  private columns: any[] = [
+    {
+      title: "������",
+      dataIndex: "key",
+      key: "key",
+      align: "center",
+      customRender: (text: any, record: any, index: any) => `${index + 1}`,
+      width: 60,
+    },
+    {
+      title: "������",
+      dataIndex: "name",
+    },
+    {
+      title: "������",
+      dataIndex: "organizationName",
+      width: "10%",
+      // scopedSlots: { customRender: 'organizationId' },
+    },
+    {
+      title: "���������",
+      dataIndex: "tempRegionData",
+      // scopedSlots: { customRender: 'region' },
+    },
+    {
+      title: "������",
+      dataIndex: "address",
+    },
+    {
+      title: "������",
+      dataIndex: "longitude",
+    },
+    {
+      title: "������",
+      dataIndex: "latitude",
+    },
+    {
+      title: "������",
+      dataIndex: "desc",
+    },
+    {
+      title: "������",
+      customRender: this.opRender,
+    },
+  ];
+
+  constructor() {
+    super();
+  }
+
+  get status() {
+    return status;
+  }
+
+  get statusMap() {
+    return statusMap;
+  }
+
+  get statuFilters() {
+    return [
+      {
+        text: status[0],
+        value: 0,
+      },
+      {
+        text: status[1],
+        value: 1,
+      },
+      {
+        text: status[2],
+        value: 2,
+      },
+      {
+        text: status[3],
+        value: 3,
+      },
     ];
+  }
 
-    constructor() {
-        super();
-    }
+  private regionFilters(value: any) {
+    if (!value) return "";
+    return org[value];
+  }
 
-    get status() {
-        return status;
-    }
+  private handleModalVisible(isVisible: boolean): void {
+    this.visibleCreateModal = isVisible;
+  }
 
-    get statusMap() {
-        return statusMap;
-    }
+  private handleSearch(): void {
+    get("monitorPoint/getMonitorPointByFuzzy", {
+      name: this.serch.name,
+      organization_id: this.selectedItems,
+      current: this.pagination.current,
+      size: this.pagination.pageSize,
+      orderType: 1,
+    })
+      .then((res) => {
+        this.dataSource = res.data.data.monitorPoints;
+        let tempMonitor = res.data.data.monitorPoints;
+        this.pagination.total = res.data.data.totalNumber;
+        this.pagination.current = res.data.data.current;
+        for (let i = 0; i < tempMonitor.length; i++) {
+          tempMonitor[i].tempRegionData =
+            tempMonitor[i].provinceCode[1] +
+            tempMonitor[i].cityCode[1] +
+            tempMonitor[i].areaCode[1];
+          tempMonitor[i].organizationName = tempMonitor[i].organizationId[1];
+          tempMonitor[i].organizationId = tempMonitor[i].organizationId[0];
+        }
+      })
+      .catch((err) => {
+        console.log(err);
+      });
+  }
 
-    get statuFilters() {
-        return [{
-                text: status[0],
-                value: 0,
-            },
-            {
-                text: status[1],
-                value: 1,
-            },
-            {
-                text: status[2],
-                value: 2,
-            },
-            {
-                text: status[3],
-                value: 3,
-            },
-        ];
-    }
+  private handlerTableChange(pagination: any, filter: any, sorter: any): void {
+    this.pagination.current = pagination.current;
+    this.pagination.pageSize = pagination.pageSize;
+    this.pagination.total = pagination.total;
+    this.loadRuleData();
+  }
 
+  private testCallback(param: any) {}
 
+  private handleUpdateModalVisible(visible: boolean, record: any): void {
+    this.updateTaskFormVisible = true;
+    this.updateRecord = record;
+  }
 
-    private regionFilters(value:any) {
-      if (!value) return ''
-      return org[value]
-    }
+  private handleUpdateModalVisible1(visible: boolean, record: any): void {
+    this.updateRecord1 = record;
+    setTimeout(() => {
+      this.distributionMenuVisible = true;
+    }, 500);
+  }
 
-    private handleModalVisible(isVisible: boolean): void {
-        this.visibleCreateModal = isVisible;
-    }
-
-    private handleSearch(): void {
-        get("monitorPoint/getMonitorPointByFuzzy",{
-            name: this.serch.name,
-            organization_id:this.selectedItems,
-            current: this.pagination.current,
-            size: this.pagination.pageSize,
-            orderType:1
+  private handleCreateModalOk() {
+    this.createForm.validateFields((err: any, fieldsValue: any) => {
+      if (err) {
+        return;
+      }
+      const name = this.createForm.getFieldValue("name");
+      // const organizationId = this.selectedItems[0].id
+      const organizationId = this.createForm.getFieldValue("organizationId");
+      const provinceCode = this.regionCode[0] ? this.regionCode[0] : "";
+      const cityCode = this.regionCode[1] ? this.regionCode[1] : "";
+      const areaCode = this.regionCode[2] ? this.regionCode[2] : "";
+      const longitude = this.createForm.getFieldValue("longitude");
+      const latitude = this.createForm.getFieldValue("latitude");
+      const address = this.createForm.getFieldValue("address");
+      const desc = this.createForm.getFieldValue("desc");
+      post("monitorPoint/insertOneMonitorPoint", {
+        name: name,
+        organizationId: organizationId,
+        provinceCode: provinceCode,
+        cityCode: cityCode,
+        areaCode: areaCode,
+        longitude: longitude,
+        latitude: latitude,
+        address: address,
+        desc: desc,
+      })
+        .then((res: any) => {
+          if (res.data.code !== 0) {
+            this.$message.warning(res.data.message, 2);
+            return;
+          }
+          this.createForm.resetFields();
+          this.visibleCreateModal = false;
+          this.$message.success(res.data.message, 2);
+          this.loadRuleData();
         })
-        .then(res=>{
-            this.dataSource = res.data.data.monitorPoints;
-          let tempMonitor = res.data.data.monitorPoints
-          this.pagination.total = res.data.data.totalNumber
+        .catch((err) => {
+          console.log(err);
+        });
+    });
+  }
+
+  private handleUpdateOk() {
+    this.loadRuleData();
+  }
+
+  private handleCreateModalCancel(): any {
+    this.visibleCreateModal = false;
+  }
+
+  private handlerSelectChange(arr1: any, arr2: any) {
+    this.selectedRows = arr2;
+  }
+
+  private handleMenuClick(e: any) {}
+
+  private mounted() {
+    this.loadRuleData();
+    // this.menuData()
+  }
+
+  // ������������
+  private showMap(flag: boolean, record: any) {
+    this.mapFlag = flag;
+    this.mapRecord = record;
+  }
+
+  private mapFlag: boolean = true;
+
+  private receiveFlag(flag: boolean) {
+    this.mapFlag = true;
+  }
+
+  @Watch("mapFlag")
+  private monitorMapFlag(newVal: boolean, oldVal: boolean) {
+    this.mapFlag = newVal;
+  }
+
+  private loadRuleData() {
+    this.tableLoading = true;
+    get("monitorPoint/getAllMonitorPoint", {
+      current: this.pagination.current,
+      size: this.pagination.pageSize,
+      orderType: 1,
+    })
+      .then((res) => {
+        if (res.data.code === 0) {
+          this.dataSource = res.data.data.monitorPoints;
+          let tempMonitor = res.data.data.monitorPoints;
+          this.pagination.total = res.data.data.totalNumber;
           this.pagination.current = res.data.data.current;
-            for (let i = 0; i < tempMonitor.length; i++) {
-                tempMonitor[i].tempRegionData = tempMonitor[i].provinceCode[1] + tempMonitor[i].cityCode[1] + tempMonitor[i].areaCode[1]
-                tempMonitor[i].organizationName = tempMonitor[i].organizationId[1]
-                tempMonitor[i].organizationId = tempMonitor[i].organizationId[0]
-            }
-        })
-        .catch(err=>{
-            console.log(err);
-        })
-    }
-
-    private handlerTableChange(pagination: any, filter: any, sorter: any): void {
-      this.pagination.current = pagination.current
-      this.loadRuleData()
-    }
-
-    private testCallback(param: any) {
-    }
-
-    private handleUpdateModalVisible(visible: boolean, record: any): void {
-        this.updateTaskFormVisible = true;
-        this.updateRecord = record;
-    }
-
-    private handleUpdateModalVisible1(visible: boolean, record: any): void {
-        this.updateRecord1 = record;
-        setTimeout(()=>{
-            this.distributionMenuVisible = true;
-        },500)
-    }
-
-    private handleCreateModalOk() {
-        this.createForm.validateFields((err: any, fieldsValue: any) => {
-            if (err) {
-                return;
-            }
-            const name = this.createForm.getFieldValue('name');
-            // const organizationId = this.selectedItems[0].id
-            const organizationId = this.createForm.getFieldValue('organizationId')
-            const provinceCode = this.regionCode[0]?this.regionCode[0]:''
-            const cityCode = this.regionCode[1]?this.regionCode[1]:''
-            const areaCode = this.regionCode[2]?this.regionCode[2]:''
-            const longitude = this.createForm.getFieldValue('longitude');
-            const latitude = this.createForm.getFieldValue('latitude');
-            const address = this.createForm.getFieldValue('address');
-            const desc = this.createForm.getFieldValue('desc');
-            post('monitorPoint/insertOneMonitorPoint', {
-                name:name,
-                organizationId:organizationId,
-                provinceCode:provinceCode,
-                cityCode:cityCode,
-                areaCode:areaCode,
-                longitude:longitude,
-                latitude:latitude,
-                address:address,
-                desc: desc,
-            }).then((res: any) => {
-                if(res.data.code !== 0){
-                    this.$message.warning(res.data.message,2)
-                  return;;
-                }
-                this.createForm.resetFields();
-                this.visibleCreateModal = false;
-                this.$message.success(res.data.message, 2);
-                this.loadRuleData();
-            }).catch((err)=>{
-                console.log(err);
-            })
-        });
-    }
-
-    private handleUpdateOk() {
-        this.loadRuleData();
-    }
-
-    private handleCreateModalCancel(): any {
-        this.visibleCreateModal = false;
-    }
-
-    private handlerSelectChange(arr1: any, arr2: any) {
-        this.selectedRows = arr2;
-    }
-
-    private handleMenuClick(e: any) {
-    }
-
-    private mounted() {
-        this.loadRuleData();
-        // this.menuData()
-    }
-
-    // ������������
-    private showMap(flag: boolean, record: any) {
-        this.mapFlag = flag
-        this.mapRecord = record
-    }
-
-
-    private mapFlag: boolean = true
-
-    private receiveFlag(flag: boolean) {
-    this.mapFlag = true
-    }
-
-    @Watch('mapFlag')
-    private monitorMapFlag(newVal: boolean, oldVal: boolean) {
-        this.mapFlag = newVal
-    }
-
-    private loadRuleData() {
-        this.tableLoading = true;
-        get('monitorPoint/getAllMonitorPoint',{
-                current: this.pagination.current,
-                size: this.pagination.pageSize,
-                orderType:1
-        })
-        .then((res) => {
-          if (res.data.code === 0) {
-            this.dataSource = res.data.data.monitorPoints;
-            let tempMonitor = res.data.data.monitorPoints
-            this.pagination.total = res.data.data.totalNumber
-            this.pagination.current = res.data.data.current;
-            let tempRegionData
-            for (let i = 0; i < tempMonitor.length; i++) {
-              tempMonitor[i].tempRegionData = tempMonitor[i].provinceCode[1] + tempMonitor[i].cityCode[1] + tempMonitor[i].areaCode[1]
-              tempMonitor[i].organizationName = tempMonitor[i].organizationId[1]
-              tempMonitor[i].organizationId = tempMonitor[i].organizationId[0]
-            }
+          let tempRegionData;
+          for (let i = 0; i < tempMonitor.length; i++) {
+            tempMonitor[i].tempRegionData =
+              tempMonitor[i].provinceCode[1] +
+              tempMonitor[i].cityCode[1] +
+              tempMonitor[i].areaCode[1];
+            tempMonitor[i].organizationName = tempMonitor[i].organizationId[1];
+            tempMonitor[i].organizationId = tempMonitor[i].organizationId[0];
           }
-
-        })
-        .finally(() => {
-            this.tableLoading = false;
-        });
-    }
-
-
-
-    private rightRender(text: string) {
-        return `${text} ���`;
-    }
-
-    private statusRender(text: any, record: any, index: number) {
-        return <a-badge status = {
-          statusMap[text]
         }
-        text = {
-            status[text]
+      })
+      .finally(() => {
+        this.tableLoading = false;
+      });
+  }
+
+  private rightRender(text: string) {
+    return `${text} ���`;
+  }
+
+  private statusRender(text: any, record: any, index: number) {
+    return <a-badge status={statusMap[text]} text={status[text]} />;
+  }
+
+  private updatedAtRender(text: string) {
+    return <span> {moment(text).format("YYYY-MM-DD HH:mm:ss")} </span>;
+  }
+
+  private deleteManageRole(record: any) {
+    post("monitorPoint/deleteMonitorPoint", { id: record.id })
+      .then((res) => {
+        if (res.data.code === 0) {
+          this.$message.success("������������");
+          this.loadRuleData();
+        } else {
+          this.$message.warning(res.data.message);
         }
-        />;
-    }
+      })
+      .catch((error) => {
+        this.$message.warning(error);
+      });
+  }
 
-    private updatedAtRender(text: string) {
-        return <span> {
-            moment(text).format('YYYY-MM-DD HH:mm:ss')
-        } </span>;
-    }
-
-    private deleteManageRole(record: any){
-        post('monitorPoint/deleteMonitorPoint',{id:record.id}
-        ).then((res)=>{
-          if (res.data.code === 0) {
-            this.$message.success('������������')
-            this.loadRuleData()
-          } else {
-            this.$message.warning(res.data.message)
-          }
-        })
-        .catch((error)=> {
-            this.$message.warning(error)
-        })
-    }
-
-    private opRender(text: string, record: any, index: number) {
-        return <div>
-            <a onClick = {
-                () => this.handleUpdateModalVisible(true, record)
-            } > ������ </a>
-            <a-divider type = 'vertical' />
-            <a-popconfirm title="������������������" ok-text="������" cancel-text="������" onConfirm={()=>this.deleteManageRole(record)}>
-                <a href="#">������</a>
-            </a-popconfirm>
-            <a-divider type = 'vertical' />
-            <a onClick={() => this.showMap(false, record)}>������������</a>
-            </div>;
-    }
+  private opRender(text: string, record: any, index: number) {
+    return (
+      <div>
+        <a onClick={() => this.handleUpdateModalVisible(true, record)}>
+          {" "}
+          ������{" "}
+        </a>
+        <a-divider type="vertical" />
+        <a-popconfirm
+          title="������������������"
+          ok-text="������"
+          cancel-text="������"
+          onConfirm={() => this.deleteManageRole(record)}
+        >
+          <a href="#">������</a>
+        </a-popconfirm>
+        <a-divider type="vertical" />
+        <a onClick={() => this.showMap(false, record)}>������������</a>
+      </div>
+    );
+  }
 }
 </script>
 
 <style lang="less">
 .tableList {
-    .tableListOperator {
-        margin-bottom: 16px;
+  .tableListOperator {
+    margin-bottom: 16px;
 
-        button {
-            margin-right: 8px;
-        }
+    button {
+      margin-right: 8px;
     }
+  }
 }
 .mapShow {
   display: none;

--
Gitblit v1.8.0