Merge branch 'master' into feature/bfi-api-rate
# Conflicts: # src/components/vehicle-attachment-table/main.vue # src/option/payment/paymentApplication.js # src/views/payment/payment-application.vue # src/views/payment/receipt-claim-record.vue # src/views/vehicle/customer-archive.vue
This commit is contained in:
@@ -16,7 +16,11 @@
|
||||
<div class="address-map-picker__info">{{ status }}</div>
|
||||
<template #footer>
|
||||
<el-button @click="visible = false">取消</el-button>
|
||||
<el-button type="primary" :disabled="!selected.longitude || resolving" @click="confirm">
|
||||
<el-button
|
||||
type="primary"
|
||||
:disabled="!hasCoordinateValue(selected.longitude) || !hasCoordinateValue(selected.latitude) || resolving"
|
||||
@click="confirm"
|
||||
>
|
||||
确定
|
||||
</el-button>
|
||||
</template>
|
||||
@@ -271,7 +275,12 @@ export default {
|
||||
this.runGeocode('address', lnglat)
|
||||
.then(result => {
|
||||
const detailAddress = result.regeocode?.formattedAddress || fallbackAddress;
|
||||
this.selected = { ...this.selected, address: detailAddress };
|
||||
const region = this.resolveRegionFromGeocode(result);
|
||||
this.selected = {
|
||||
...this.selected,
|
||||
address: detailAddress,
|
||||
...region,
|
||||
};
|
||||
this.keyword = detailAddress || this.keyword;
|
||||
this.status = detailAddress || '已选点,可确认回填';
|
||||
})
|
||||
@@ -285,6 +294,26 @@ export default {
|
||||
this.resolving = false;
|
||||
});
|
||||
},
|
||||
resolveRegionFromGeocode(result = {}) {
|
||||
const component = result.regeocode?.addressComponent || {};
|
||||
const city = Array.isArray(component.city) ? '' : String(component.city || '').trim();
|
||||
const province = String(component.province || '').trim();
|
||||
const district = String(component.district || '').trim();
|
||||
const country = String(component.country || '').trim();
|
||||
const adcode = String(component.adcode || '').trim();
|
||||
return {
|
||||
country,
|
||||
province,
|
||||
city: city || province,
|
||||
district,
|
||||
adcode,
|
||||
regionCode: adcode,
|
||||
provinceName: province,
|
||||
cityName: city || province,
|
||||
districtName: district,
|
||||
countryName: country,
|
||||
};
|
||||
},
|
||||
renderMarker(point) {
|
||||
this.clearMarker();
|
||||
this.marker = new window.AMap.Marker({ position: point });
|
||||
@@ -297,8 +326,31 @@ export default {
|
||||
this.marker = null;
|
||||
}
|
||||
},
|
||||
syncSelectedFromMarker() {
|
||||
// 确认时以当前标记点坐标为准,避免换地址后仍回填上一次经纬度
|
||||
if (!this.marker || typeof this.marker.getPosition !== 'function') {
|
||||
return;
|
||||
}
|
||||
const point = this.marker.getPosition();
|
||||
if (!point) {
|
||||
return;
|
||||
}
|
||||
const longitude =
|
||||
typeof point.getLng === 'function' ? point.getLng() : point.lng ?? point.longitude;
|
||||
const latitude =
|
||||
typeof point.getLat === 'function' ? point.getLat() : point.lat ?? point.latitude;
|
||||
if (!Number.isFinite(Number(longitude)) || !Number.isFinite(Number(latitude))) {
|
||||
return;
|
||||
}
|
||||
this.selected = {
|
||||
...this.selected,
|
||||
longitude: Number(longitude),
|
||||
latitude: Number(latitude),
|
||||
};
|
||||
},
|
||||
confirm() {
|
||||
if (!this.selected.longitude || !this.selected.latitude) {
|
||||
this.syncSelectedFromMarker();
|
||||
if (!this.hasCoordinateValue(this.selected.longitude) || !this.hasCoordinateValue(this.selected.latitude)) {
|
||||
this.$message.warning('请先搜索或点击地图完成选点');
|
||||
return;
|
||||
}
|
||||
@@ -308,8 +360,18 @@ export default {
|
||||
}
|
||||
this.$emit('confirm', {
|
||||
address: this.selected.address,
|
||||
longitude: this.selected.longitude,
|
||||
latitude: this.selected.latitude,
|
||||
longitude: Number(this.selected.longitude),
|
||||
latitude: Number(this.selected.latitude),
|
||||
country: this.selected.country || this.selected.countryName || '',
|
||||
province: this.selected.province || this.selected.provinceName || '',
|
||||
city: this.selected.city || this.selected.cityName || '',
|
||||
district: this.selected.district || this.selected.districtName || '',
|
||||
adcode: this.selected.adcode || this.selected.regionCode || '',
|
||||
regionCode: this.selected.regionCode || this.selected.adcode || '',
|
||||
countryName: this.selected.countryName || this.selected.country || '',
|
||||
provinceName: this.selected.provinceName || this.selected.province || '',
|
||||
cityName: this.selected.cityName || this.selected.city || '',
|
||||
districtName: this.selected.districtName || this.selected.district || '',
|
||||
});
|
||||
this.visible = false;
|
||||
},
|
||||
|
||||
@@ -576,7 +576,7 @@ export default {
|
||||
}
|
||||
|
||||
.mode-content :deep(.el-form-item) {
|
||||
margin-bottom: 14px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.mode-content :deep(.el-form-item:last-child) {
|
||||
|
||||
@@ -0,0 +1,117 @@
|
||||
<template>
|
||||
<div class="avue-crud__right table-header-tools">
|
||||
<el-button v-if="showRefresh" icon="el-icon-refresh" circle @click="$emit('refresh')" />
|
||||
<el-button
|
||||
v-if="showColumn"
|
||||
icon="el-icon-operation"
|
||||
circle
|
||||
@click="columnSettingVisible = true"
|
||||
/>
|
||||
<el-button
|
||||
v-if="showSearch"
|
||||
icon="el-icon-search"
|
||||
circle
|
||||
@click="$emit('update:searchVisible', !searchVisible)"
|
||||
/>
|
||||
<el-button v-if="showGrid" icon="el-icon-grid" circle @click="toggleTableSize" />
|
||||
|
||||
<el-dialog
|
||||
v-if="showColumn"
|
||||
v-model="columnSettingVisible"
|
||||
title="列设置"
|
||||
width="360px"
|
||||
append-to-body
|
||||
destroy-on-close
|
||||
>
|
||||
<el-checkbox-group
|
||||
class="table-header-tools__column-setting"
|
||||
:model-value="visibleColumnKeys"
|
||||
@update:model-value="$emit('update:visibleColumnKeys', $event)"
|
||||
>
|
||||
<el-checkbox v-for="item in columns" :key="item.prop" :label="item.prop">
|
||||
{{ item.label }}
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
<template #footer>
|
||||
<el-button @click="columnSettingVisible = false">关闭</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const TABLE_SIZE_OPTIONS = ['default', 'large', 'small'];
|
||||
|
||||
export default {
|
||||
name: 'TableHeaderTools',
|
||||
props: {
|
||||
columns: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
visibleColumnKeys: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
tableSize: {
|
||||
type: String,
|
||||
default: 'default',
|
||||
},
|
||||
searchVisible: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
showRefresh: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
showColumn: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
showSearch: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
showGrid: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
},
|
||||
emits: ['refresh', 'update:visibleColumnKeys', 'update:tableSize', 'update:searchVisible'],
|
||||
data() {
|
||||
return {
|
||||
columnSettingVisible: false,
|
||||
};
|
||||
},
|
||||
deactivated() {
|
||||
// keep-alive 缓存页面时关闭列设置弹窗,避免 Teleport 到 body 的弹窗切页后残留
|
||||
this.columnSettingVisible = false;
|
||||
},
|
||||
methods: {
|
||||
toggleTableSize() {
|
||||
const index = TABLE_SIZE_OPTIONS.indexOf(this.tableSize);
|
||||
const next = TABLE_SIZE_OPTIONS[(index + 1) % TABLE_SIZE_OPTIONS.length];
|
||||
this.$emit('update:tableSize', next);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.table-header-tools.avue-crud__right {
|
||||
width: auto;
|
||||
margin: 0 0 0 auto;
|
||||
flex: none;
|
||||
white-space: nowrap;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.table-header-tools__column-setting {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
max-height: 360px;
|
||||
overflow: auto;
|
||||
}
|
||||
</style>
|
||||
@@ -9,18 +9,21 @@
|
||||
<el-table :data="rows" border @selection-change="selectedRows = $event">
|
||||
<el-table-column v-if="!readonly" type="selection" width="55" align="center" />
|
||||
<el-table-column type="index" label="序号" width="70" align="center" />
|
||||
<el-table-column label="文件名" min-width="240" show-overflow-tooltip>
|
||||
<el-table-column
|
||||
label="文件名"
|
||||
min-width="240"
|
||||
show-overflow-tooltip
|
||||
class-name="is-ellipsis-link"
|
||||
>
|
||||
<template #default="{ row }">
|
||||
<span
|
||||
class="vehicle-attachment-table__file-name"
|
||||
class="attachment-file-name"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
@click="previewAttachment(row)"
|
||||
@keydown.enter="previewAttachment(row)"
|
||||
@keydown.space.prevent="previewAttachment(row)"
|
||||
>
|
||||
{{ attachmentName(row) }}
|
||||
</span>
|
||||
>{{ attachmentName(row) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="附件描述" min-width="220">
|
||||
|
||||
Reference in New Issue
Block a user