Add common address page
This commit is contained in:
49
src/api/basic/common-address.js
Normal file
49
src/api/basic/common-address.js
Normal file
@@ -0,0 +1,49 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
export function fetchCommonAddressPage(params) {
|
||||
return request({
|
||||
url: '/api/basic/common-address/page',
|
||||
method: 'get',
|
||||
params,
|
||||
})
|
||||
}
|
||||
|
||||
export function fetchCommonAddressDetail(id) {
|
||||
return request({
|
||||
url: `/api/basic/common-address/${id}`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
export function createCommonAddress(data) {
|
||||
return request({
|
||||
url: '/api/basic/common-address/save',
|
||||
method: 'post',
|
||||
data,
|
||||
})
|
||||
}
|
||||
|
||||
export function updateCommonAddress(data) {
|
||||
return request({
|
||||
url: '/api/basic/common-address/update',
|
||||
method: 'post',
|
||||
data,
|
||||
})
|
||||
}
|
||||
|
||||
export function deleteCommonAddress(ids) {
|
||||
return request({
|
||||
url: '/api/basic/common-address/delete',
|
||||
method: 'post',
|
||||
data: ids,
|
||||
})
|
||||
}
|
||||
|
||||
export function exportCommonAddress(params) {
|
||||
return request({
|
||||
url: '/api/basic/common-address/export',
|
||||
method: 'get',
|
||||
params,
|
||||
responseType: 'blob',
|
||||
})
|
||||
}
|
||||
9
src/router/modules/basic/common-address.js
Normal file
9
src/router/modules/basic/common-address.js
Normal file
@@ -0,0 +1,9 @@
|
||||
export default {
|
||||
path: '/basic/common-address',
|
||||
name: 'CommonAddress',
|
||||
component: () => import('@/views/basic/address/index.vue'),
|
||||
meta: {
|
||||
title: '常用地址',
|
||||
icon: 'location',
|
||||
},
|
||||
}
|
||||
582
src/views/basic/address/index.vue
Normal file
582
src/views/basic/address/index.vue
Normal file
@@ -0,0 +1,582 @@
|
||||
<template>
|
||||
<div class="common-address-page">
|
||||
<el-card class="page-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="page-header">
|
||||
<span>常用地址</span>
|
||||
<div class="actions">
|
||||
<el-button type="primary" @click="handleAdd">新增常用地址</el-button>
|
||||
<el-button @click="handleExport">批量导出</el-button>
|
||||
<el-button type="danger" plain @click="handleBatchDelete">批量删除</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<el-form :inline="true" :model="query" class="search-form">
|
||||
<el-form-item label="地址名称">
|
||||
<el-input v-model="query.addressName" placeholder="请输入" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="类型">
|
||||
<el-select v-model="query.addressType" placeholder="全部" clearable style="width: 150px">
|
||||
<el-option label="常规地址" value="NORMAL" />
|
||||
<el-option label="港口/码头" value="PORT" />
|
||||
<el-option label="铁路车站" value="RAIL" />
|
||||
<el-option label="空港机场" value="AIRPORT" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="详细地址">
|
||||
<el-input v-model="query.detailAddress" placeholder="请输入" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="行政区划">
|
||||
<el-input v-model="query.regionName" placeholder="请输入" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="站点编码">
|
||||
<el-input v-model="query.stationCode" placeholder="请输入" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="组织">
|
||||
<el-select v-model="query.orgId" filterable clearable placeholder="默认当前组织" style="width: 180px">
|
||||
<el-option label="桂物物流" value="1" />
|
||||
<el-option label="运输事业部" value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系人">
|
||||
<el-input v-model="query.contactName" placeholder="请输入" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="联系方式">
|
||||
<el-input v-model="query.contactPhone" placeholder="请输入" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="fetchList">查询</el-button>
|
||||
<el-button @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-table
|
||||
:data="tableData"
|
||||
border
|
||||
stripe
|
||||
v-loading="loading"
|
||||
@selection-change="onSelectionChange"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column type="selection" width="44" />
|
||||
<el-table-column type="index" label="序号" width="60" />
|
||||
<el-table-column prop="addressName" label="地址名称" min-width="140" />
|
||||
<el-table-column prop="addressNo" label="地址编号" min-width="120" />
|
||||
<el-table-column prop="addressType" label="类型" min-width="120">
|
||||
<template #default="{ row }">
|
||||
{{ formatType(row.addressType) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="stationCode" label="站点编码" min-width="110" />
|
||||
<el-table-column prop="detailAddress" label="详细地址" min-width="220" />
|
||||
<el-table-column prop="longitude" label="经度" min-width="110" />
|
||||
<el-table-column prop="latitude" label="纬度" min-width="110" />
|
||||
<el-table-column prop="regionName" label="行政区划" min-width="180" />
|
||||
<el-table-column prop="contactName" label="联系人" min-width="110" />
|
||||
<el-table-column prop="contactPhone" label="联系方式" min-width="140" />
|
||||
<el-table-column prop="orgName" label="组织" min-width="120" />
|
||||
<el-table-column prop="remark" label="备注" min-width="140" />
|
||||
<el-table-column prop="updateTime" label="更新时间" min-width="170" />
|
||||
<el-table-column prop="createTime" label="创建时间" min-width="170" />
|
||||
<el-table-column fixed="right" label="操作" width="160">
|
||||
<template #default="{ row }">
|
||||
<el-button type="text" size="small" @click="openDetail(row)">查看</el-button>
|
||||
<el-button type="text" size="small" @click="openEdit(row)">编辑</el-button>
|
||||
<el-button type="text" size="small" class="danger-text" @click="removeRow(row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<div class="pager">
|
||||
<el-pagination
|
||||
:current-page="page.current"
|
||||
:page-size="page.size"
|
||||
:total="page.total"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@current-change="handleCurrentChange"
|
||||
@size-change="handleSizeChange"
|
||||
/>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<el-dialog :title="dialogTitle" v-model="dialogVisible" width="920px" destroy-on-close>
|
||||
<el-form ref="formRef" :model="form" :rules="rules" label-width="90px" :disabled="dialogMode === 'detail'">
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="类型" prop="addressType">
|
||||
<el-radio-group v-model="form.addressType" @change="handleTypeChange">
|
||||
<el-radio label="NORMAL">常规</el-radio>
|
||||
<el-radio label="PORT">港口/码头</el-radio>
|
||||
<el-radio label="RAIL">铁路车站</el-radio>
|
||||
<el-radio label="AIRPORT">空港机场</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="地址名称" prop="addressName">
|
||||
<el-input v-model="form.addressName" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="联系人" prop="contactName">
|
||||
<el-input v-model="form.contactName" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="联系方式" prop="contactPhone">
|
||||
<el-input v-model="form.contactPhone" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="详细地址" prop="detailAddress">
|
||||
<el-input v-model="form.detailAddress" placeholder="常规地址通过地图选择带出，其他类型从主数据带出" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="站点编码" prop="stationCode">
|
||||
<el-input v-model="form.stationCode" :disabled="form.addressType === 'NORMAL'" placeholder="常规地址显示 /" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="组织" prop="orgName">
|
||||
<el-select v-model="form.orgId" filterable placeholder="请选择">
|
||||
<el-option label="桂物物流" value="1" />
|
||||
<el-option label="运输事业部" value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" :rows="3" maxlength="500" show-word-limit />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<div v-if="form.addressType === 'NORMAL'" class="map-panel">
|
||||
<div class="map-panel__header">
|
||||
<span>地图选点</span>
|
||||
<el-input
|
||||
v-model="mapKeyword"
|
||||
placeholder="请输入地址关键字"
|
||||
style="width: 260px"
|
||||
clearable
|
||||
@keyup.enter="searchLocation"
|
||||
/>
|
||||
<el-button type="primary" @click="searchLocation">搜索</el-button>
|
||||
</div>
|
||||
<div class="map-panel__body">
|
||||
<div class="result-list">
|
||||
<div
|
||||
v-for="item in locationOptions"
|
||||
:key="item.key"
|
||||
:class="['result-item', { active: selectedLocationKey === item.key }]"
|
||||
@click="selectLocation(item)"
|
||||
>
|
||||
<div class="result-item__title">{{ item.title }}</div>
|
||||
<div class="result-item__sub">{{ item.address }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="map-placeholder">
|
||||
<div>地图区域</div>
|
||||
<div>这里对接真实地图 SDK 后可实现点击选点、拖拽定位、逆地址解析。</div>
|
||||
<div>当前示例同时回填经度、纬度、行政区划、详细地址。</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-row :gutter="16" class="coords-row">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="经度" prop="longitude">
|
||||
<el-input v-model="form.longitude" placeholder="自动回填" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="纬度" prop="latitude">
|
||||
<el-input v-model="form.latitude" placeholder="自动回填" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="行政区划" prop="regionName">
|
||||
<el-input v-model="form.regionName" placeholder="自动回填" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
|
||||
<div v-else class="library-panel">
|
||||
<el-alert type="info" :closable="false" title="其他类型地址请从主数据选择后回填站点编码、详细地址、行政区划及坐标。" />
|
||||
<div class="library-panel__actions">
|
||||
<el-button @click="chooseLibraryAddress('PORT')">选择港口/码头</el-button>
|
||||
<el-button @click="chooseLibraryAddress('RAIL')">选择铁路车站</el-button>
|
||||
<el-button @click="chooseLibraryAddress('AIRPORT')">选择空港机场</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-form>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">关闭</el-button>
|
||||
<el-button v-if="dialogMode !== 'detail'" type="primary" @click="submitForm">确认</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
createCommonAddress,
|
||||
deleteCommonAddress,
|
||||
exportCommonAddress,
|
||||
fetchCommonAddressDetail,
|
||||
fetchCommonAddressPage,
|
||||
updateCommonAddress,
|
||||
} from '@/api/basic/common-address'
|
||||
|
||||
const EMPTY_FORM = {
|
||||
id: null,
|
||||
addressType: 'NORMAL',
|
||||
addressName: '',
|
||||
contactName: '',
|
||||
contactPhone: '',
|
||||
detailAddress: '',
|
||||
stationCode: '/',
|
||||
regionName: '',
|
||||
longitude: '',
|
||||
latitude: '',
|
||||
orgId: '1',
|
||||
orgName: '桂物物流',
|
||||
remark: '',
|
||||
}
|
||||
|
||||
export default {
|
||||
name: 'CommonAddressPage',
|
||||
data() {
|
||||
return {
|
||||
query: {
|
||||
addressName: '',
|
||||
addressType: '',
|
||||
detailAddress: '',
|
||||
regionName: '',
|
||||
stationCode: '',
|
||||
orgId: '',
|
||||
contactName: '',
|
||||
contactPhone: '',
|
||||
current: 1,
|
||||
size: 10,
|
||||
},
|
||||
page: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
total: 0,
|
||||
},
|
||||
loading: false,
|
||||
tableData: [],
|
||||
selectionRows: [],
|
||||
dialogVisible: false,
|
||||
dialogMode: 'create',
|
||||
dialogTitle: '新建常用地址',
|
||||
form: { ...EMPTY_FORM },
|
||||
mapKeyword: '',
|
||||
locationOptions: [],
|
||||
selectedLocationKey: '',
|
||||
rules: {
|
||||
addressType: [{ required: true, message: '请选择类型', trigger: 'change' }],
|
||||
addressName: [{ required: true, message: '请输入地址名称', trigger: 'blur' }],
|
||||
detailAddress: [{ required: true, message: '请输入详细地址', trigger: 'blur' }],
|
||||
},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchList()
|
||||
},
|
||||
methods: {
|
||||
formatType(type) {
|
||||
const map = {
|
||||
NORMAL: '常规地址',
|
||||
PORT: '港口/码头',
|
||||
RAIL: '铁路车站',
|
||||
AIRPORT: '空港机场',
|
||||
}
|
||||
return map[type] || type || '-'
|
||||
},
|
||||
fetchList() {
|
||||
this.loading = true
|
||||
const params = {
|
||||
...this.query,
|
||||
current: this.page.current,
|
||||
size: this.page.size,
|
||||
}
|
||||
fetchCommonAddressPage(params)
|
||||
.then((res) => {
|
||||
const data = res?.data || res || {}
|
||||
this.tableData = data.records || []
|
||||
this.page.total = data.total || 0
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
resetQuery() {
|
||||
this.query = {
|
||||
addressName: '',
|
||||
addressType: '',
|
||||
detailAddress: '',
|
||||
regionName: '',
|
||||
stationCode: '',
|
||||
orgId: '',
|
||||
contactName: '',
|
||||
contactPhone: '',
|
||||
current: 1,
|
||||
size: 10,
|
||||
}
|
||||
this.page.current = 1
|
||||
this.fetchList()
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
this.page.current = val
|
||||
this.fetchList()
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
this.page.size = val
|
||||
this.page.current = 1
|
||||
this.fetchList()
|
||||
},
|
||||
onSelectionChange(rows) {
|
||||
this.selectionRows = rows
|
||||
},
|
||||
handleAdd() {
|
||||
this.dialogMode = 'create'
|
||||
this.dialogTitle = '新建常用地址'
|
||||
this.form = { ...EMPTY_FORM }
|
||||
this.locationOptions = []
|
||||
this.mapKeyword = ''
|
||||
this.selectedLocationKey = ''
|
||||
this.dialogVisible = true
|
||||
},
|
||||
openEdit(row) {
|
||||
this.dialogMode = 'edit'
|
||||
this.dialogTitle = '编辑常用地址'
|
||||
fetchCommonAddressDetail(row.id).then((res) => {
|
||||
this.form = { ...EMPTY_FORM, ...(res?.data || res || {}) }
|
||||
this.dialogVisible = true
|
||||
})
|
||||
},
|
||||
openDetail(row) {
|
||||
this.dialogMode = 'detail'
|
||||
this.dialogTitle = '常用地址详情'
|
||||
fetchCommonAddressDetail(row.id).then((res) => {
|
||||
this.form = { ...EMPTY_FORM, ...(res?.data || res || {}) }
|
||||
this.dialogVisible = true
|
||||
})
|
||||
},
|
||||
handleTypeChange(val) {
|
||||
if (val === 'NORMAL') {
|
||||
this.form.stationCode = '/'
|
||||
} else if (!this.form.stationCode || this.form.stationCode === '/') {
|
||||
this.form.stationCode = ''
|
||||
}
|
||||
},
|
||||
searchLocation() {
|
||||
const base = [
|
||||
{ key: 'a', title: `${this.mapKeyword || 'XX园区'}`, address: '广西南宁市江南区龙岗大道21号', lng: '108.348610', lat: '22.721864', regionName: '广西壮族自治区/南宁市/江南区' },
|
||||
{ key: 'b', title: `${this.mapKeyword || 'XX园区'}A门`, address: '广西南宁市江南区龙岗大道21号', lng: '108.349020', lat: '22.722012', regionName: '广西壮族自治区/南宁市/江南区' },
|
||||
{ key: 'c', title: `${this.mapKeyword || 'XX园区'}C门`, address: '广西南宁市江南区龙岗大道21号', lng: '108.347800', lat: '22.721400', regionName: '广西壮族自治区/南宁市/江南区' },
|
||||
]
|
||||
this.locationOptions = base
|
||||
this.selectLocation(base[0])
|
||||
},
|
||||
selectLocation(item) {
|
||||
this.selectedLocationKey = item.key
|
||||
this.form.addressName = this.form.addressType === 'NORMAL' ? item.title : this.form.addressName
|
||||
this.form.detailAddress = item.address
|
||||
this.form.longitude = item.lng
|
||||
this.form.latitude = item.lat
|
||||
this.form.regionName = item.regionName
|
||||
},
|
||||
chooseLibraryAddress(type) {
|
||||
const map = {
|
||||
PORT: {
|
||||
addressName: '舟山港',
|
||||
stationCode: 'CNNGB',
|
||||
detailAddress: '浙江省舟山市普陀区沈家门街道港口大道18号',
|
||||
regionName: '浙江省/舟山市/普陀区',
|
||||
longitude: '122.320000',
|
||||
latitude: '29.988000',
|
||||
},
|
||||
RAIL: {
|
||||
addressName: '柳州站',
|
||||
stationCode: 'LZZ',
|
||||
detailAddress: '广西柳州市柳北区站前路',
|
||||
regionName: '广西壮族自治区/柳州市/柳北区',
|
||||
longitude: '109.410000',
|
||||
latitude: '24.327000',
|
||||
},
|
||||
AIRPORT: {
|
||||
addressName: '成都双流机场',
|
||||
stationCode: 'CTU',
|
||||
detailAddress: '四川省成都市双流区机场路',
|
||||
regionName: '四川省/成都市/双流区',
|
||||
longitude: '103.956000',
|
||||
latitude: '30.578000',
|
||||
},
|
||||
}
|
||||
const picked = map[type]
|
||||
if (picked) {
|
||||
this.form.addressType = type
|
||||
this.form.addressName = picked.addressName
|
||||
this.form.stationCode = picked.stationCode
|
||||
this.form.detailAddress = picked.detailAddress
|
||||
this.form.regionName = picked.regionName
|
||||
this.form.longitude = picked.longitude
|
||||
this.form.latitude = picked.latitude
|
||||
}
|
||||
},
|
||||
submitForm() {
|
||||
this.$refs.formRef.validate((valid) => {
|
||||
if (!valid) return
|
||||
const action = this.form.id ? updateCommonAddress : createCommonAddress
|
||||
action(this.form).then(() => {
|
||||
this.dialogVisible = false
|
||||
this.fetchList()
|
||||
this.$message.success('保存成功')
|
||||
})
|
||||
})
|
||||
},
|
||||
removeRow(row) {
|
||||
this.$confirm('确认删除该常用地址吗？删除后不可恢复。', '提示', { type: 'warning' })
|
||||
.then(() => deleteCommonAddress([row.id]))
|
||||
.then(() => {
|
||||
this.$message.success('删除成功')
|
||||
this.fetchList()
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
handleBatchDelete() {
|
||||
const ids = this.selectionRows.map((item) => item.id)
|
||||
if (!ids.length) {
|
||||
this.$message.warning('请选择要删除的数据')
|
||||
return
|
||||
}
|
||||
this.$confirm('确认批量删除选中的常用地址吗？', '提示', { type: 'warning' })
|
||||
.then(() => deleteCommonAddress(ids))
|
||||
.then(() => {
|
||||
this.$message.success('删除成功')
|
||||
this.fetchList()
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
handleExport() {
|
||||
exportCommonAddress(this.query).then(() => {
|
||||
this.$message.success('已发起导出')
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.page-card {
|
||||
min-height: calc(100vh - 32px);
|
||||
}
|
||||
|
||||
.page-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.search-form {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.pager {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 16px 0 0;
|
||||
}
|
||||
|
||||
.danger-text {
|
||||
color: #f56c6c;
|
||||
}
|
||||
|
||||
.map-panel {
|
||||
margin-top: 8px;
|
||||
border: 1px solid #ebeef5;
|
||||
border-radius: 4px;
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
.map-panel__header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.map-panel__body {
|
||||
display: grid;
|
||||
grid-template-columns: 260px 1fr;
|
||||
gap: 12px;
|
||||
min-height: 260px;
|
||||
}
|
||||
|
||||
.result-list {
|
||||
border: 1px solid #ebeef5;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.result-item {
|
||||
padding: 10px 12px;
|
||||
border-bottom: 1px solid #f0f2f5;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.result-item.active {
|
||||
background: #ecf5ff;
|
||||
}
|
||||
|
||||
.result-item__title {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.result-item__sub {
|
||||
margin-top: 4px;
|
||||
color: #909399;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.map-placeholder {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 1px dashed #dcdfe6;
|
||||
border-radius: 4px;
|
||||
color: #606266;
|
||||
gap: 8px;
|
||||
background: #fafcff;
|
||||
}
|
||||
|
||||
.coords-row {
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.library-panel {
|
||||
margin-top: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.library-panel__actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user