update 允许打开窗口副标题

This commit is contained in:
2021-05-21 14:51:44 +08:00
parent ca90ed7d44
commit e4696f678e
7 changed files with 154 additions and 98 deletions

View File

@@ -194,6 +194,20 @@
} }
} }
} }
.yo-layout-tab-subtitle {
line-height: 1;
display: inline-block;
overflow: hidden;
max-width: 150px;
transform: translateY(1px);
white-space: nowrap;
text-overflow: ellipsis;
opacity: .75;
}
+.ant-tabs-tab { +.ant-tabs-tab {
margin-left: 0; margin-left: 0;
} }

View File

@@ -1,5 +1,6 @@
export default { export default {
houseCodeAdd: ['/houseCode/add', 'post'], houseCodeAdd: ['/houseCode/add', 'post'],
houseCodeEdit: ['/houseCode/edit', 'post'],
houseCodePage: ['/houseCode/page', 'post'], houseCodePage: ['/houseCode/page', 'post'],
houseCodeNo: '/houseCode/getNextNoByCode', houseCodeNo: '/houseCode/getNextNoByCode',
} }

View File

@@ -96,25 +96,47 @@ export default {
* 对表单提交进行处理 * 对表单提交进行处理
*/ */
this.saving = true; this.saving = true;
this.$api if (!this.param.record) {
.houseCodeAdd(formData) this.$api
.then(({ success }) => { .houseCodeAdd(formData)
if (success) { .then(({ success }) => {
this.$message.success('保存成功'); if (success) {
this.$confirm({ this.$message.success('保存成功');
content: '已添加成功,是否继续添加?', this.$confirm({
onOk: () => { content: '已添加成功,是否继续添加?',
this.$refs.forms[0].onProjectChange(); onOk: () => {
}, this.$refs.forms[0].onProjectChange();
onCancel: () => { },
this.closeContentWindow(); onCancel: () => {
}, this.closeContentWindow();
}); },
} });
}) }
.finally(() => { })
this.saving = false; .finally(() => {
}); this.saving = false;
});
} else {
this.$api
.houseCodeEdit(formData)
.then(({ success }) => {
if (success) {
this.$message.success('保存成功');
this.$confirm({
content: '编辑成功,是否继续保留当前页?',
onOk: () => {
this.$refs.forms[0].onProjectChange();
},
onCancel: () => {
this.closeContentWindow();
},
});
}
})
.finally(() => {
this.saving = false;
});
}
}, },
}, },
}; };

View File

@@ -251,10 +251,6 @@ export default {
this.onFillData(); this.onFillData();
}, },
mounted() {
this.onMapInit();
},
beforeDestroy() { beforeDestroy() {
if (this.map) this.map.destroy(); if (this.map) this.map.destroy();
}, },
@@ -289,6 +285,14 @@ export default {
if (this.form.id) { if (this.form.id) {
this.onAreaCodeChange(true); this.onAreaCodeChange(true);
} }
this.$nextTick(async () => {
await this.onMapInit();
if (this.form.lng && this.form.lat) {
this.setMarker([this.form.lng, this.form.lat]);
this.map.setCenter([this.form.lng, this.form.lat]);
}
});
}, },
/** /**
@@ -362,95 +366,102 @@ export default {
}, },
onMapInit() { onMapInit() {
const city = '宁波市'; return new Promise((resolve) => {
const city = '宁波市';
const district = new AMap.DistrictSearch({ const district = new AMap.DistrictSearch({
subdistrict: 0, subdistrict: 0,
extensions: 'all', extensions: 'all',
level: 'city', level: 'city',
});
district.search(city, (status, result) => {
const bounds = result.districtList[0].boundaries;
const mask = [];
for (let i = 0; i < bounds.length; i += 1) {
mask.push([bounds[i]]);
}
// 挂载map到this,但不监听
this.map = new AMap.Map(this.$refs.map, {
city,
viewMode: '3D',
mask,
zoom: 12,
}); });
const geocoder = new AMap.Geocoder({ city }); district.search(city, (status, result) => {
const bounds = result.districtList[0].boundaries;
let marker; const mask = [];
const setMarker = (position) => { for (let i = 0; i < bounds.length; i += 1) {
if (marker) { mask.push([bounds[i]]);
marker.setPosition(position);
} else {
marker = new AMap.Marker({
map: this.map,
icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
position,
offset: new AMap.Pixel(-13, -30),
});
} }
geocoder.getAddress(position, (status, result) => { // 挂载map到this,但不监听
if (status === 'complete' && result.regeocode) { this.map = new AMap.Map(this.$refs.map, {
this.onSetPosition(result.regeocode.formattedAddress, position); city,
} else { viewMode: '3D',
console.error('根据经纬度查询地址失败'); mask,
} zoom: 12,
}); });
};
this.map.on('click', (e) => { const geocoder = new AMap.Geocoder({ city });
setMarker(e.lnglat);
});
const auto = new AMap.AutoComplete({ this.map.on('click', (e) => {
input: this.$refs['map-search'].$el.querySelector('input'), this.setMarker(e.lnglat, geocoder);
city, });
citylimit: true,
});
const placeSearch = new AMap.PlaceSearch({ this.map.on('complete', () => {
city, resolve();
citylimit: true, });
pageSize: 1,
});
auto.on('select', ({ poi: { name: keywords, adcode } }) => { const auto = new AMap.AutoComplete({
this.map.clearMap(); input: this.$refs['map-search'].$el.querySelector('input'),
marker = null; city,
placeSearch.search(keywords, (status, result) => { citylimit: true,
const { });
poiList: { pois },
} = result; const placeSearch = new AMap.PlaceSearch({
pois.forEach((p) => { city,
setMarker(p.location); citylimit: true,
pageSize: 1,
});
auto.on('select', ({ poi: { name: keywords, adcode } }) => {
this.map.clearMap();
marker = null;
placeSearch.search(keywords, (status, result) => {
const {
poiList: { pois },
} = result;
pois.forEach((p) => {
this.setMarker(p.location, geocoder);
});
this.map.setFitView();
}); });
this.map.setFitView();
}); });
for (let i = 0; i < bounds.length; i += 1) {
new AMap.Polyline({
path: bounds[i],
strokeColor: '#ccc',
strokeWeight: 4,
map: this.map,
});
}
}); });
for (let i = 0; i < bounds.length; i += 1) {
new AMap.Polyline({
path: bounds[i],
strokeColor: '#ccc',
strokeWeight: 4,
map: this.map,
});
}
}); });
}, },
setMarker(position, geocoder) {
if (this.marker) {
this.marker.setPosition(position);
} else {
this.marker = new AMap.Marker({
map: this.map,
icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
position,
offset: new AMap.Pixel(-13, -30),
});
}
if (geocoder) {
geocoder.getAddress(position, (status, result) => {
if (status === 'complete' && result.regeocode) {
this.onSetPosition(result.regeocode.formattedAddress, position);
} else {
console.error('根据经纬度查询地址失败');
}
});
}
},
onSetPosition(address, { lng, lat }) { onSetPosition(address, { lng, lat }) {
this.$set(this.form, 'address', address); this.$set(this.form, 'address', address);
this.$set(this.form, 'lng', lng); this.$set(this.form, 'lng', lng);

View File

@@ -64,7 +64,7 @@
</a-form-model-item> </a-form-model-item>
</Auth> </Auth>
<Auth auth="authCode:add" slot="operator"> <Auth auth="authCode:add" slot="operator">
<a-button @click="onOpen()" icon="plus">新增编码</a-button> <a-button @click="onOpen()" icon="plus">新增房屋编码</a-button>
</Auth> </Auth>
<!-- 格式化字段内容 --> <!-- 格式化字段内容 -->
<!-- ... --> <!-- ... -->
@@ -254,7 +254,11 @@ export default {
*/ */
onOpen(record) { onOpen(record) {
this.openContentWindow({ this.openContentWindow({
title: '房屋编码', key: record ? record.id : 'business/house/houseCode/form',
title: record ? '修改房屋编码' : '新增房屋编码',
subTitle:
record &&
`${record.areaName}-${record.roadName}-${record.commName}-${record.note}-${`000${record.no}`.slice(-3)}`,
path: 'business/house/houseCode/form', path: 'business/house/houseCode/form',
param: { param: {
record, record,

View File

@@ -12,6 +12,9 @@
<div @click.middle="() => pane.closable && $emit('close', pane.key)"> <div @click.middle="() => pane.closable && $emit('close', pane.key)">
<a-icon :type="pane.icon" v-if="pane.icon" /> <a-icon :type="pane.icon" v-if="pane.icon" />
{{ pane.title }} {{ pane.title }}
<a-tooltip :title="pane.subTitle" placement="bottom" v-if="pane.subTitle">
<span class="yo-layout-tab-subtitle">{{`- ${pane.subTitle}`}}</span>
</a-tooltip>
</div> </div>
<a-menu slot="overlay"> <a-menu slot="overlay">
<template v-if="mode === 'development'"> <template v-if="mode === 'development'">

View File

@@ -119,6 +119,7 @@ export default {
closable: settings.closable === undefined ? true : settings.closable, closable: settings.closable === undefined ? true : settings.closable,
icon: settings.icon, icon: settings.icon,
title: settings.title || '新建窗口', title: settings.title || '新建窗口',
subTitle: settings.subTitle,
component: null, component: null,
path, path,
param: settings.param, param: settings.param,