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