<template>
|
<a-form style="margin-top: 8px" :form="form">
|
<a-modal title="编辑-角色" destroyOnClose :visible="visible" @cancel="handleCancel">
|
<a-form-item key="name" v-bind="formLayout" label="名称" has-feedback>
|
<a-input placeholder="请输入" v-decorator="['name', {initialValue:saveData.name,rules: [{ required: true,message:'请输入名称'}]}]"/>
|
</a-form-item>
|
<a-form-item key="organizationId" v-bind="formLayout" label="组织" has-feedback>
|
<!-- <a-select default-value="1" style="width: 120px" @change="handleChange">
|
<a-select-option v-for="item in parentData" :value="item.id" :key="item.id">
|
{{item.name}}
|
</a-select-option>
|
</a-select> -->
|
<a-select
|
v-decorator="['organizationId', {initialValue:saveData.organizationId,rules: [{ required: true,message:'请选择组织'}]}]"
|
placeholder="选择组织(输入名称搜索)"
|
style="width: 240px;margin-top:4px"
|
allow-clear
|
show-search
|
>
|
<a-select-option v-for="(item,index) in parentData" :key="index" :value="item.id" >
|
{{ item.name }}
|
</a-select-option>
|
</a-select>
|
</a-form-item>
|
<a-form-item key="regionCode" v-bind="formLayout" label="省/市/区" has-feedback>
|
<a-cascader placeholder="请选择"
|
v-decorator="['regionCode', {initialValue:saveData.regionCode,rules: [{ required: true,message:'请选择组织'}]}]"
|
:options="region" @change="onChangeReginon" />
|
</a-form-item>
|
<a-form-item key="address" v-bind="formLayout" label="详细地址">
|
<a-input v-decorator="['address', {initialValue:saveData.address}]" placeholder="请输入" />
|
</a-form-item>
|
<a-form-item key="longitude" v-bind="formLayout" label="经度">
|
<a-input v-decorator="['longitude', {initialValue:saveData.longitude}]" placeholder="请输入" />
|
</a-form-item>
|
<a-form-item key="latitude" v-bind="formLayout" label="纬度">
|
<a-input v-decorator="['latitude', {initialValue:saveData.latitude}]" placeholder="请输入" />
|
</a-form-item>
|
<a-form-item key="desc" v-bind="formLayout" label="备注">
|
<a-input v-decorator="['desc', {initialValue:saveData.desc}]" placeholder="请输入" />
|
</a-form-item>
|
<template slot="footer">
|
<a-button key="cancel" @click="handleCancel">
|
取消
|
</a-button>
|
<a-button key="forward" type="primary" @click="handleOk">
|
完成
|
</a-button>
|
</template>
|
</a-modal>
|
</a-form>
|
</template>
|
|
<script lang="ts">
|
import {
|
Component,
|
Prop,
|
Vue,
|
Emit,
|
Model,
|
Watch,
|
} from 'vue-property-decorator';
|
import {
|
State,
|
Mutation,
|
namespace,
|
} from 'vuex-class';
|
|
import { get, post } from "@/util/request";
|
import org from '@/util/org'
|
|
@Component({
|
components: {},
|
})
|
export default class UpdateTaskForm extends Vue {
|
|
@Prop({
|
type: Boolean,
|
default: false,
|
})
|
private visible!: boolean;
|
|
@Prop({
|
type: Object,
|
default() {
|
return {};
|
},
|
})
|
private record!: any;
|
|
|
@Prop({
|
type: Object,
|
default() {
|
return {};
|
},
|
})
|
private selectedItems!: any;
|
|
private saveData:any={
|
name:'',
|
organizationId:'',
|
provinceCode:'',
|
cityCode:'',
|
areaCode:'',
|
longitude:'',
|
latitude:'',
|
address:'',
|
desc: '',
|
regionCode:[]
|
}
|
|
private form: any = null;
|
|
private formVals: any = {
|
target: '0',
|
template: '0',
|
type: '1',
|
time: '',
|
frequency: 'month',
|
};
|
|
// 城市选择数据
|
private options:any[] = [
|
{
|
value: 'zhejiang',
|
label: 'Zhejiang',
|
children: [
|
{
|
value: 'hangzhou',
|
label: 'Hangzhou',
|
children: [
|
{
|
value: 'xihu',
|
label: 'West Lake',
|
},
|
],
|
},
|
],
|
},
|
{
|
value: 'jiangsu',
|
label: 'Jiangsu',
|
children: [
|
{
|
value: 'nanjing',
|
label: 'Nanjing',
|
children: [
|
{
|
value: 'zhonghuamen',
|
label: 'Zhong Hua Men',
|
},
|
],
|
},
|
],
|
},
|
]
|
|
|
|
|
|
|
|
// 储存选择城市的值
|
private onChangeReginon(value:any){
|
this.regionCode = value
|
}
|
|
private currentStep: number = 0;
|
|
private formLayout = {
|
labelCol: {
|
span: 7,
|
},
|
wrapperCol: {
|
span: 13,
|
},
|
};
|
|
private handleBackward(): void {
|
this.currentStep--;
|
}
|
|
// 省市区地区码
|
private regionCode:number[] = []
|
|
private handleNext(): void {
|
this.form.validateFields((err: any, fieldsValue: any) => {
|
if (err) {
|
return;
|
}
|
this.formVals = { ...this.formVals, ...fieldsValue };
|
this.currentStep++;
|
});
|
}
|
|
private handleCancel(): void {
|
this.updateVisible(false);
|
}
|
|
private handleOk(): void {
|
// 清除表单存储的上次数据
|
this.formVals = {}
|
this.form.validateFields((err: any, fieldsValue: any) => {
|
if (err) {
|
return;
|
}
|
if(fieldsValue.name || fieldsValue.organizationId || fieldsValue.regionCode || fieldsValue.longitude || fieldsValue.latitude || fieldsValue.address || fieldsValue.desc){
|
if(fieldsValue.name !== this.saveData.name || fieldsValue.regionCode !== this.saveData.regionCode || fieldsValue.longitude !== this.saveData.longitude ||
|
fieldsValue.latitude !== this.saveData.latitude || fieldsValue.address !== this.saveData.address || fieldsValue.desc !== this.saveData.desc || fieldsValue.organizationId
|
!== this.saveData.organizationId){
|
post('monitorPoint/updateMonitorPoint',
|
{
|
name: fieldsValue.name == this.saveData.name ? null : fieldsValue.name,
|
longitude: fieldsValue.longitude == this.saveData.longitude ? null : fieldsValue.longitude,
|
latitude: fieldsValue.latitude == this.saveData.latitude ? null : fieldsValue.latitude,
|
provinceCode: this.regionCode[0] == this.saveData.regionCode[0] ? null : this.regionCode[0],
|
cityCode: this.regionCode[1] == this.saveData.regionCode[1] ? null : this.regionCode[1],
|
areaCode: this.regionCode[2] == this.saveData.regionCode[2] ? null : this.regionCode[2],
|
address: fieldsValue.address == this.saveData.address ? null : fieldsValue.address,
|
id: this.record.id,
|
organizationId: fieldsValue.organizationId == this.saveData.organizationId ? null : fieldsValue.organizationId,
|
desc: fieldsValue.desc == this.saveData.desc ? null : fieldsValue.desc
|
}).then((res) => {
|
if(res.data.code !== -1){
|
this.$message.success('修改成功')
|
this.updateVisible(false);
|
this.onOk();
|
} else{
|
this.$message.warning('修改失败')
|
}
|
})
|
.catch((err)=>{
|
console.log(err);
|
})
|
|
}else{
|
this.$message.warning('未修改')
|
}
|
}
|
// this.saveData.name = '',
|
// this.saveData.desc = ''
|
});
|
|
}
|
|
// 获得省市区数据
|
private region:any
|
|
private parentData:any = null
|
// 获得所有组织
|
private getAllOrg(){
|
get("organization/queryNames", {}).then(res => {
|
this.parentData = res.data.data.organizationVOs
|
})
|
}
|
|
private created(){
|
this.form = this.$form.createForm(this, {name: "UpdataTaskFormMonitor"});
|
this.getAllOrg()
|
this.region = org
|
}
|
|
@Emit('ok')
|
private onOk() {
|
|
}
|
|
private updateVisible(visible: boolean): void {
|
this.$emit('update:visible', visible);
|
}
|
|
private mounted(): void {
|
this.currentStep = 0;
|
}
|
|
@Watch('record', {
|
immediate: true,
|
deep: true,
|
})
|
private recordChange(value: any, oldValue: any): void {
|
this.regionCode = []
|
this.saveData.regionCode = []
|
this.formVals = {
|
...value,
|
...this.formVals,
|
};
|
|
this.currentStep = 0;
|
this.saveData.name = value.name
|
this.saveData.address = value.address
|
this.saveData.desc = value.desc
|
this.saveData.longitude = value.longitude
|
this.saveData.latitude = value.latitude
|
this.saveData.organizationId = parseInt(value.organizationId)
|
if(value.provinceCode || value.cityCode ||value.areaCode){
|
this.saveData.regionCode.push(parseInt(value.provinceCode[0]))
|
this.saveData.regionCode.push(parseInt(value.cityCode[0]))
|
this.saveData.regionCode.push(parseInt(value.areaCode[0]))
|
}
|
}
|
|
|
}
|
</script>
|
