github/niucloud-admin
1
0
Fork 0
mirror of https://gitee.com/niucloud-team/niucloud-admin.git synced 2026-04-04 11:40:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

同步admin

Browse Source
This commit is contained in:
CQ 2026-04-03 11:16:45 +08:00
parent 3433dd6cdb
commit 691f4804f1
26 changed files with 2644 additions and 950 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
admin/components.d.ts vendored
View File

@ -81,6 +81,7 @@ declare module '@vue/runtime-core' {
ExportSure: typeof import('./src/components/export-sure/index.vue')['default']
HeatMap: typeof import('./src/components/heat-map/index.vue')['default']
Icon: typeof import('./src/components/icon/index.vue')['default']
MapSelector: typeof import('./src/components/map-selector/index.vue')['default']
Markdown: typeof import('./src/components/markdown/index.vue')['default']
PopoverInput: typeof import('./src/components/popover-input/index.vue')['default']
RangeInput: typeof import('./src/components/range-input/index.vue')['default']

26
admin/package-lock.json generated
View File

@ -174,7 +174,6 @@
"resolved": "https://registry.npmmirror.com/@babel/core/-/core-7.23.6.tgz",
"integrity": "sha512-FxpRyGjrMJXh7X3wGLGhNDCRiwpWEF74sKjTLDJSG5Kyvow3QZaG0Adbqzi9ZrVjTWpsX+2cxWXD71NMg93kdw==",
"dev": true,
"peer": true,
"dependencies": {
"@ampproject/remapping": "^2.2.0",
"@babel/code-frame": "^7.23.5",
@ -975,7 +974,6 @@
"version": "6.1.19",
"resolved": "https://registry.npmmirror.com/@fullcalendar/core/-/core-6.1.19.tgz",
"integrity": "sha512-z0aVlO5e4Wah6p6mouM0UEqtRf1MZZPt4mwzEyU6kusaNL+dlWQgAasF2cK23hwT4cmxkEmr4inULXgpyeExdQ==",
"peer": true,
"dependencies": {
"preact": "~10.12.1"
}
@ -1461,7 +1459,6 @@
"version": "4.17.6",
"resolved": "https://registry.npmmirror.com/@types/lodash-es/-/lodash-es-4.17.6.tgz",
"integrity": "sha512-R+zTeVUKDdfoRxpAryaQNRKk3105Rrgx2CFRClIgRGaqDTdjsm8h6IYA8ir584W3ePzkZfst5xIgDwYrlh9HLg==",
"peer": true,
"dependencies": {
"@types/lodash": "*"
}
@ -1506,7 +1503,6 @@
"resolved": "https://registry.npmmirror.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.53.0.tgz",
"integrity": "sha512-alFpFWNucPLdUOySmXCJpzr6HKC3bu7XooShWM+3w/EL6J2HIoB2PFxpLnq4JauWVk6DiVeNKzQlFEaE+X9sGw==",
"dev": true,
"peer": true,
"dependencies": {
"@typescript-eslint/scope-manager": "5.53.0",
"@typescript-eslint/type-utils": "5.53.0",
@ -1537,7 +1533,6 @@
"resolved": "https://registry.npmmirror.com/@typescript-eslint/parser/-/parser-5.62.0.tgz",
"integrity": "sha512-VlJEV0fOQ7BExOsHYAGrgbEiZoi8D+Bl2+f6V2RrXerRSylnp+ZBHmPvaIa8cz0Ajx7WO7Z5RqfgYg7ED1nRhA==",
"dev": true,
"peer": true,
"dependencies": {
"@typescript-eslint/scope-manager": "5.62.0",
"@typescript-eslint/types": "5.62.0",
@ -2071,7 +2066,6 @@
"resolved": "https://registry.npmmirror.com/acorn/-/acorn-8.11.2.tgz",
"integrity": "sha512-nc0Axzp/0FILLEVsm4fNwLCwMttvhEI263QtVPQcbpfZZ3ts0hLsZGOpE6czNlid7CJ9MlyH8reXkpsf3YUY4w==",
"dev": true,
"peer": true,
"bin": {
"acorn": "bin/acorn"
},
@ -2389,7 +2383,6 @@
"resolved": "https://registry.npmmirror.com/browserslist/-/browserslist-4.24.2.tgz",
"integrity": "sha512-ZIc+Q62revdMcqC6aChtW4jz3My3klmCO1fEmINZY/8J3EpBg5/A/D0AKmBveUh6pgoeycoMkVMko84tuYS+Gg==",
"dev": true,
"peer": true,
"dependencies": {
"caniuse-lite": "^1.0.30001669",
"electron-to-chromium": "^1.5.41",
@ -3097,7 +3090,6 @@
"resolved": "https://registry.npmmirror.com/eslint/-/eslint-8.34.0.tgz",
"integrity": "sha512-1Z8iFsucw+7kSqXNZVslXS8Ioa4u2KM7GPwuKtkTFAqZ/cHMcEaR+1+Br0wLlot49cNxIiZk5wp8EAbPcYZxTg==",
"dev": true,
"peer": true,
"dependencies": {
"@eslint/eslintrc": "^1.4.1",
"@humanwhocodes/config-array": "^0.11.8",
@ -3264,7 +3256,6 @@
"resolved": "https://registry.npmmirror.com/eslint-plugin-import/-/eslint-plugin-import-2.27.5.tgz",
"integrity": "sha512-LmEt3GVofgiGuiE+ORpnvP+kAm3h6MLZJ4Q5HCyHADofsb4VzXFsRiWj3c0OFiV+3DWFh0qg3v9gcPlfc3zRow==",
"dev": true,
"peer": true,
"dependencies": {
"array-includes": "^3.1.6",
"array.prototype.flat": "^1.3.1",
@ -3324,7 +3315,6 @@
"resolved": "https://registry.npmmirror.com/eslint-plugin-n/-/eslint-plugin-n-15.6.1.tgz",
"integrity": "sha512-R9xw9OtCRxxaxaszTQmQAlPgM+RdGjaL1akWuY/Fv9fRAi8Wj4CUKc6iYVG8QNRjRuo8/BqVYIpfqberJUEacA==",
"dev": true,
"peer": true,
"dependencies": {
"builtins": "^5.0.1",
"eslint-plugin-es": "^4.1.0",
@ -3347,7 +3337,6 @@
"resolved": "https://registry.npmmirror.com/eslint-plugin-promise/-/eslint-plugin-promise-6.1.1.tgz",
"integrity": "sha512-tjqWDwVZQo7UIPMeDReOpUgHCmCiH+ePnVT+5zVapL0uuHnegBUs2smM13CzOs2Xb5+MHMRFTs9v24yjba4Oig==",
"dev": true,
"peer": true,
"engines": {
"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
},
@ -4004,7 +3993,6 @@
"version": "11.0.1",
"resolved": "https://registry.npmmirror.com/highlight.js/-/highlight.js-11.0.1.tgz",
"integrity": "sha512-EqYpWyTF2s8nMfttfBA2yLKPNoZCO33pLS4MnbXQ4hECf1TKujCt1Kq7QAdrio7roL4+CqsfjqwYj4tYgq0pJQ==",
"peer": true,
"engines": {
"node": ">=12.0.0"
}
@ -4459,14 +4447,12 @@
"node_modules/lodash": {
"version": "4.17.21",
"resolved": "https://registry.npmmirror.com/lodash/-/lodash-4.17.21.tgz",
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
"peer": true
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
},
"node_modules/lodash-es": {
"version": "4.17.21",
"resolved": "https://registry.npmmirror.com/lodash-es/-/lodash-es-4.17.21.tgz",
"integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==",
"peer": true
"integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
},
"node_modules/lodash-unified": {
"version": "1.0.3",
@ -4992,7 +4978,6 @@
"version": "8.4.21",
"resolved": "https://registry.npmmirror.com/postcss/-/postcss-8.4.21.tgz",
"integrity": "sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg==",
"peer": true,
"dependencies": {
"nanoid": "^3.3.4",
"picocolors": "^1.0.0",
@ -5287,7 +5272,6 @@
"resolved": "https://registry.npmmirror.com/rollup/-/rollup-3.29.4.tgz",
"integrity": "sha512-oWzmBZwvYrU0iJHtDmhsm662rC15FRXmcjCk1xD771dFDx5jJ02ufAQQTn0etB2emNk4J9EZg/yWKpsn9BWGRw==",
"dev": true,
"peer": true,
"bin": {
"rollup": "dist/bin/rollup"
},
@ -5338,7 +5322,6 @@
"version": "1.58.0",
"resolved": "https://registry.npmmirror.com/sass/-/sass-1.58.0.tgz",
"integrity": "sha512-PiMJcP33DdKtZ/1jSjjqVIKihoDc6yWmYr9K/4r3fVVIEDAluD0q7XZiRKrNJcPK3qkLRF/79DND1H5q1LBjgg==",
"peer": true,
"dependencies": {
"chokidar": ">=3.0.0 <4.0.0",
"immutable": "^4.0.0",
@ -5598,7 +5581,6 @@
"resolved": "https://registry.npmmirror.com/tailwindcss/-/tailwindcss-3.2.4.tgz",
"integrity": "sha512-AhwtHCKMtR71JgeYDaswmZXhPcW9iuI9Sp2LvZPo9upDZ7231ZJ7eA9RaURbhpXGVlrjX4cFNlB4ieTetEb7hQ==",
"dev": true,
"peer": true,
"dependencies": {
"arg": "^5.0.2",
"chokidar": "^3.5.3",
@ -5817,7 +5799,6 @@
"resolved": "https://registry.npmmirror.com/typescript/-/typescript-4.9.5.tgz",
"integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==",
"devOptional": true,
"peer": true,
"bin": {
"tsc": "bin/tsc",
"tsserver": "bin/tsserver"
@ -6080,7 +6061,6 @@
"resolved": "https://registry.npmmirror.com/vite/-/vite-4.1.0.tgz",
"integrity": "sha512-YoUKE/9bbK4C8ZeSYMDDEF8H5aypmWUq4WisftDhntR1gkI2zt2SGT/5Wd2xu6ZoVXkCyO3U4844KWG9e4nFoQ==",
"dev": true,
"peer": true,
"dependencies": {
"esbuild": "^0.16.14",
"postcss": "^8.4.21",
@ -6129,7 +6109,6 @@
"version": "3.2.45",
"resolved": "https://registry.npmmirror.com/vue/-/vue-3.2.45.tgz",
"integrity": "sha512-9Nx/Mg2b2xWlXykmCwiTUCWHbWIj53bnkizBxKai1g61f2Xit700A1ljowpTIM11e3uipOeiPcSqnmBg6gyiaA==",
"peer": true,
"dependencies": {
"@vue/compiler-dom": "3.2.45",
"@vue/compiler-sfc": "3.2.45",
@ -6406,7 +6385,6 @@
"version": "3.3.13",
"resolved": "https://registry.npmmirror.com/vue/-/vue-3.3.13.tgz",
"integrity": "sha512-LDnUpQvDgsfc0u/YgtAgTMXJlJQqjkxW1PVcOnJA5cshPleULDjHi7U45pl2VJYazSSvLH8UKcid/kzH8I0a0Q==",
"peer": true,
"dependencies": {
"@vue/compiler-dom": "3.3.13",
"@vue/compiler-sfc": "3.3.13",

2
admin/package.json
View File

@ -5,7 +5,7 @@
"type": "module",
"scripts": {
"dev": "vite",
"build": "cross-env NODE_OPTIONS=--max-old-space-size=4096 && vite build && node publish.cjs",
"build": "vite build && node publish.cjs",
"preview": "vite preview"
},
"dependencies": {

60
admin/src/app/api/notice.ts
View File

@ -11,7 +11,7 @@ export function getNoticeList(params: any) {
}
/**
* 消息发送记录
* 消发送记录
* @param params
* @returns
*/
@ -19,6 +19,58 @@ export function getNoticeLog(params: any) {
return request.get(`notice/log`, { params })
}
/**
* 获取消息发送记录
* @param params
* @returns
*/
export function getBindInfo() {
return request.get(`notice/bind/info`)
}
/**
* 取消绑定
* @param params
* @returns
*/
export function cancelBind(params: any) {
return request.post(`notice/bind/cancel`, params)
}
/**
* 获取微信配置
* @returns
*/
export function getWechatAuthUrl() {
return request.get('notice/bind/wechat')
}
/**
* 获取微信配置
* @returns
*/
export function getWeappAuthUrl() {
return request.get('notice/bind/weapp')
}
/**
* 获取微信配置
* @returns
*/
export function sendSms(params: Record<string, any>) {
return request.post('notice/bind/sms/send',params, { showSuccessMessage: true })
}
/**
* 获取微信配置
* @returns
*/
export function bindSms(params: Record<string, any>) {
return request.post('notice/bind/sms/bind',params, { showSuccessMessage: true })
}
/**
* 消息详情
* @param key
@ -186,6 +238,12 @@ export function getSmsCaptcha() {
return request.get(`notice/niusms/captcha`)
}
/**
* 获取图像验证码
*/
export function getsiteCaptcha() {
return request.get(`site/captcha/create`)
}
/**
* 发送验证码
* @param params

4
admin/src/app/api/sys.ts
View File

@ -611,8 +611,8 @@ export function setMap(params: Record<string, any>) {
/**
* 获取地图配置
*/
export function getMap() {
return request.get(`sys/config/map`)
export function getMap(params: Record<string, any>) {
return request.get(`sys/config/map`, { params })
}
/**

8
admin/src/app/api/weapp.ts
View File

@ -8,6 +8,14 @@ export function getWeappConfig() {
return request.get('weapp/config')
}
/**
* 获取微信小程序配置
* @returns
*/
export function getWeappAuthUrl() {
return request.get('weapp/auth_url')
}
/**
* 编辑微信小程序配置
* @param params

6
admin/src/app/views/channel/weapp/template.vue
View File

@ -33,6 +33,12 @@
</template>
</el-table-column>
<el-table-column :label="t('消息类型')" min-width="100" align="center">
<template #default="{ row }">
<span class="text-[#fff] rounded-[3px] px-[8px] py-[2px]" :class="{'bg-[#008000]': row.receiver_type == 1, 'bg-[#0000ff]': row.receiver_type == 0}">{{ row.receiver_type == 1 ? t('buyerNews') : t('sellerMessage') }}</span>
</template>
</el-table-column>
<el-table-column :label="t('response')" min-width="180">
<template #default="{ row }">
<div v-for="(item, index) in row.weapp.content" :key="'a' + index" class="text-left">{{ item.join(":") }}</div>

79
admin/src/app/views/channel/wechat/template.vue
View File

@ -15,50 +15,53 @@
<el-tab-pane :label="t('reply')" name="/channel/wechat/reply" />
</el-tabs>
<el-table :data="cronTableData.data" :span-method="templateSpan" size="large" v-loading="cronTableData.loading">
<template #empty>
<span>{{ !cronTableData.loading ? t('emptyData') : '' }}</span>
</template>
<el-table-column prop="addon_name" :label="t('addon')" min-width="120" />
<el-table-column prop="name" :show-overflow-tooltip="true" :label="t('name')" min-width="150" >
<template #default="{ row }">
<div class="flex items-center">
<span class="mr-[5px]">{{row.name }}</span>
<el-tooltip :content="row.wechat.tips" v-if="row.wechat.tips" placement="top">
<icon name="element WarningFilled" />
</el-tooltip>
</div>
<el-alert :title="t('微信平台最多支持25个消息模板获取时请注意微信平台剩余模板数量是否充足')" type="info" show-icon />
<div class="mt-[20px]">
<el-table :data="cronTableData.data" :span-method="templateSpan" size="large" v-loading="cronTableData.loading">
<template #empty>
<span>{{ !cronTableData.loading ? t('emptyData') : '' }}</span>
</template>
</el-table-column>
<el-table-column :label="t('messageType')" min-width="100" align="center">
<template #default="{ row }">
<span>{{ row.message_type == 1 ? t('buyerNews') : t('sellerMessage') }}</span>
</template>
</el-table-column>
<el-table-column prop="addon_name" :label="t('addon')" min-width="120" />
<el-table-column prop="name" :show-overflow-tooltip="true" :label="t('name')" min-width="150" >
<template #default="{ row }">
<div class="flex items-center">
<span class="mr-[5px]">{{row.name }}</span>
<el-tooltip :content="row.wechat.tips" v-if="row.wechat.tips" placement="top">
<icon name="element WarningFilled" />
</el-tooltip>
</div>
</template>
</el-table-column>
<el-table-column :label="t('isStart')" min-width="100" align="center">
<template #default="{ row }">
{{ row.is_wechat == 1 ? t('startUsing') : t('statusDeactivate') }}
</template>
</el-table-column>
<el-table-column :label="t('messageType')" min-width="100" align="center">
<template #default="{ row }">
<span class="text-[#fff] rounded-[3px] px-[8px] py-[2px]" :class="{'bg-[#008000]': row.receiver_type == 1, 'bg-[#0000ff]': row.receiver_type == 0}">{{ row.receiver_type == 1 ? t('buyerNews') : t('sellerMessage') }}</span>
</template>
</el-table-column>
<el-table-column :label="t('response')" min-width="180">
<template #default="{ row }">
<div v-for="(item, index) in row.wechat.content" :key="'a' + index" class="text-left">{{ item.join("：") }}</div>
</template>
</el-table-column>
<el-table-column :label="t('isStart')" min-width="100" align="center">
<template #default="{ row }">
{{ row.is_wechat == 1 ? t('startUsing') : t('statusDeactivate') }}
</template>
</el-table-column>
<el-table-column prop="wechat_template_id" :label="t('serialNumber')" min-width="140" />
<el-table-column :label="t('response')" min-width="180">
<template #default="{ row }">
<div v-for="(item, index) in row.wechat.content" :key="'a' + index" class="text-left">{{ item.join("：") }}</div>
</template>
</el-table-column>
<el-table-column :label="t('operation')" fixed="right" align="right" width="200">
<template #default="{ row }">
<el-button type="primary" link @click="infoSwitch(row)">{{ row.is_wechat == 1 ? t('close') : t('open') }}</el-button>
<el-button type="primary" link @click="batchAcquisitionFn(row)">{{ t('regain') }}</el-button>
</template>
</el-table-column>
</el-table>
<el-table-column prop="wechat_template_id" :label="t('serialNumber')" min-width="140" />
<el-table-column :label="t('operation')" fixed="right" align="right" width="200">
<template #default="{ row }">
<el-button type="primary" link @click="infoSwitch(row)">{{ row.is_wechat == 1 ? t('close') : t('open') }}</el-button>
<el-button type="primary" link @click="batchAcquisitionFn(row)">{{ t('regain') }}</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
</div>
</template>

4
admin/src/app/views/index/store.vue
View File

@ -220,9 +220,9 @@
<el-table-column :label="t('appName')" align="left" width="300">
<template #default="{ row }">
<div class="flex items-center cursor-pointer relative left-[-10px]" @click="openDetail(row)">
<el-image class="w-[54px] h-[54px]" :src="row.icon" fit="contain">
<el-image class="w-[54px] h-[54px] rounded-[5px]" :src="row.icon" fit="contain">
<template #error>
<div class="flex items-center w-full h-full">
<div class="flex items-center w-full h-full rounded-[5px]">
<img class="max-w-full max-h-full" src="@/app/assets/images/icon-addon-one.png" alt="" />
</div>
</template>

173
admin/src/app/views/setting/components/notice-sms.vue
View File

@ -1,38 +1,68 @@
<template>
<el-dialog v-model="showDialog" :title="t('noticeSetting')" width="550px" :destroy-on-close="true">
<el-form :model="formData" label-width="110px" ref="formRef" :rules="formRules" class="page-form" v-loading="loading">
<el-form-item :label="t('status')">
<el-radio-group v-model="formData.is_sms">
<el-radio :label="1">{{ t('startUsing') }}</el-radio>
<el-radio :label="0">{{ t('statusDeactivate') }}</el-radio>
</el-radio-group>
</el-form-item>
<el-dialog
v-model="showDialog"
:title="t('noticeSetting')"
width="550px"
:destroy-on-close="true"
>
<el-alert
v-if="!formData.bind_sms && formData.is_need_bind_merchant"
title="未绑定接收者手机号"
type="error"
:closable="false"
/>
<el-form
:model="formData"
label-width="110px"
ref="formRef"
:rules="formRules"
class="page-form"
v-loading="loading"
>
<el-form-item :label="t('status')">
<el-radio-group v-model="formData.is_sms">
<el-radio :label="1">{{ t('startUsing') }}</el-radio>
<el-radio :label="0">{{ t('statusDeactivate') }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item :label="t('name')">
<div class="input-width"> {{ formData.name }} </div>
</el-form-item>
<el-form-item :label="t('name')">
<div class="input-width">{{ formData.name }}</div>
</el-form-item>
<el-form-item :label="t('title')">
<div class="input-width"> {{ formData.title }} </div>
</el-form-item>
<el-form-item :label="t('title')">
<div class="input-width">{{ formData.title }}</div>
</el-form-item>
<el-form-item :label="t('smsId')" prop="sms_id">
<el-input v-model.trim="formData.sms_id" :placeholder="t('smsIdPlaceholder')" class="input-width" show-word-limit clearable />
</el-form-item>
<el-form-item :label="t('smsId')" prop="sms_id">
<el-input
v-model.trim="formData.sms_id"
:placeholder="t('smsIdPlaceholder')"
class="input-width"
show-word-limit
clearable
/>
</el-form-item>
<el-form-item :label="t('smsContent')">
<div class="input-width"> {{ formData.content }} </div>
</el-form-item>
<el-form-item :label="t('smsContent')">
<div class="input-width">{{ formData.content }}</div>
</el-form-item>
</el-form>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="showDialog = false">{{ t('cancel') }}</el-button>
<el-button type="primary" :loading="loading" @click="confirm(formRef)">{{t('confirm')}}</el-button>
</span>
</template>
</el-dialog>
<template #footer>
<span class="dialog-footer">
<el-button @click="showDialog = false">{{
t('cancel')
}}</el-button>
<el-button
type="primary"
:loading="loading"
@click="confirm(formRef)"
>{{ t('confirm') }}</el-button
>
</span>
</template>
</el-dialog>
</template>
<script lang="ts" setup>
@ -48,14 +78,16 @@ const loading = ref(true)
* 表单数据
*/
const initialFormData = {
is_sms: 0,
key: '',
name: '',
sms_default_content: '',
title: '',
type: '',
sms_id: '',
content: ''
is_sms: 0,
key: '',
name: '',
sms_default_content: '',
title: '',
type: '',
sms_id: '',
content: '',
bind_sms: '',
is_need_bind_merchant: '',
}
const formData: Record<string, any> = reactive({ ...initialFormData })
@ -63,11 +95,11 @@ const formRef = ref<FormInstance>()
// 表单验证规则
const formRules = computed(() => {
return {
sms_id: [
{ required: true, message: t('smsIdPlaceholder'), trigger: 'blur' }
]
}
return {
sms_id: [
{ required: true, message: t('smsIdPlaceholder'), trigger: 'blur' },
],
}
})
const emit = defineEmits(['complete'])
@ -77,44 +109,47 @@ const emit = defineEmits(['complete'])
* @param formEl
*/
const confirm = async (formEl: FormInstance | undefined) => {
if (loading.value || !formEl) return
if (loading.value || !formEl) return
await formEl.validate(async (valid) => {
if (valid) {
loading.value = true
await formEl.validate(async (valid) => {
if (valid) {
loading.value = true
const data = formData
data.status = data.is_sms
const data = formData
data.status = data.is_sms
editNotice(data).then(res => {
loading.value = false
showDialog.value = false
emit('complete')
}).catch(() => {
loading.value = false
// showDialog.value = false
})
}
})
editNotice(data)
.then((res) => {
loading.value = false
showDialog.value = false
emit('complete')
})
.catch(() => {
loading.value = false
// showDialog.value = false
})
}
})
}
const setFormData = async (row: any = null) => {
loading.value = true
Object.assign(formData, initialFormData)
loading.value = true
Object.assign(formData, initialFormData)
if (row) {
Object.keys(formData).forEach((key: string) => {
if (row[key] != undefined) formData[key] = row[key]
if (row.sms && row.sms[key] != undefined) formData[key] = row.sms[key]
})
}
if (row) {
Object.keys(formData).forEach((key: string) => {
if (row[key] != undefined) formData[key] = row[key]
if (row.sms && row.sms[key] != undefined)
formData[key] = row.sms[key]
})
}
loading.value = false
loading.value = false
}
defineExpose({
showDialog,
setFormData
showDialog,
setFormData,
})
</script>

162
admin/src/app/views/setting/components/notice-weapp.vue
View File

@ -1,36 +1,62 @@
<template>
<el-dialog v-model="showDialog" :title="t('noticeSetting')" width="550px" :destroy-on-close="true">
<el-form :model="formData" label-width="110px" ref="formRef" :rules="formRules" class="page-form" v-loading="loading">
<el-form-item :label="t('status')">
<el-radio-group v-model="formData.is_weapp">
<el-radio :label="1">{{ t('startUsing') }}</el-radio>
<el-radio :label="0">{{ t('statusDeactivate') }}</el-radio>
</el-radio-group>
</el-form-item>
<el-dialog
v-model="showDialog"
:title="t('noticeSetting')"
width="550px"
:destroy-on-close="true"
>
<el-alert
v-if="!formData.bind_weapp && formData.is_need_bind_merchant"
title="未绑定接收者小程序"
type="error"
:closable="false"
/>
<el-form
:model="formData"
label-width="110px"
ref="formRef"
:rules="formRules"
class="page-form"
v-loading="loading"
>
<el-form-item :label="t('status')">
<el-radio-group v-model="formData.is_weapp">
<el-radio :label="1">{{ t('startUsing') }}</el-radio>
<el-radio :label="0">{{ t('statusDeactivate') }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item :label="t('name')">
<div class="input-width"> {{ formData.name }} </div>
</el-form-item>
<el-form-item :label="t('name')">
<div class="input-width">{{ formData.name }}</div>
</el-form-item>
<el-form-item :label="t('weappTempKey')">
<div class="input-width"> {{ formData.tid }} </div>
</el-form-item>
<el-form-item :label="t('weappTempKey')">
<div class="input-width">{{ formData.tid }}</div>
</el-form-item>
<el-form-item :label="t('content')">
<div class="input-width">
<div v-for="(item, index) in formData.content" :key="index">{{ item[0] }}：{{ item[1] }} </div>
</div>
</el-form-item>
<el-form-item :label="t('content')">
<div class="input-width">
<div v-for="(item, index) in formData.content" :key="index">
{{ item[0] }}：{{ item[1] }}
</div>
</div>
</el-form-item>
</el-form>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="showDialog = false">{{ t('cancel') }}</el-button>
<el-button type="primary" :loading="loading" @click="confirm(formRef)">{{t('confirm')}}</el-button>
</span>
</template>
</el-dialog>
<template #footer>
<span class="dialog-footer">
<el-button @click="showDialog = false">{{
t('cancel')
}}</el-button>
<el-button
type="primary"
:loading="loading"
@click="confirm(formRef)"
>{{ t('confirm') }}</el-button
>
</span>
</template>
</el-dialog>
</template>
<script lang="ts" setup>
@ -46,15 +72,17 @@ const loading = ref(true)
* 表单数据
*/
const initialFormData = {
is_weapp: 0,
key: '',
name: '',
title: '',
type: '',
content: [],
first: '',
remark: '',
tid: ''
is_weapp: 0,
key: '',
name: '',
title: '',
type: '',
content: [],
first: '',
remark: '',
tid: '',
bind_weapp: '',
is_need_bind_merchant: '',
}
const formData: Record<string, any> = reactive({ ...initialFormData })
@ -62,9 +90,7 @@ const formRef = ref<FormInstance>()
// 表单验证规则
const formRules = computed(() => {
return {
}
return {}
})
const emit = defineEmits(['complete'])
@ -74,43 +100,45 @@ const emit = defineEmits(['complete'])
* @param formEl
*/
const confirm = async (formEl: FormInstance | undefined) => {
if (loading.value || !formEl) return
if (loading.value || !formEl) return
await formEl.validate(async (valid) => {
if (valid) {
loading.value = true
await formEl.validate(async (valid) => {
if (valid) {
loading.value = true
const data = formData
data.status = data.is_weapp
const data = formData
data.status = data.is_weapp
editNoticeStatus(data).then(res => {
loading.value = false
showDialog.value = false
emit('complete')
}).catch(() => {
loading.value = false
})
}
})
editNoticeStatus(data)
.then((res) => {
loading.value = false
showDialog.value = false
emit('complete')
})
.catch(() => {
loading.value = false
})
}
})
}
const setFormData = async (row: any = null) => {
loading.value = true
Object.assign(formData, initialFormData)
loading.value = true
Object.assign(formData, initialFormData)
if (row) {
Object.keys(formData).forEach((key: string) => {
if (row[key] != undefined) formData[key] = row[key]
if (row.weapp && row.weapp[key] != undefined) formData[key] = row.weapp[key]
})
}
loading.value = false
if (row) {
Object.keys(formData).forEach((key: string) => {
if (row[key] != undefined) formData[key] = row[key]
if (row.weapp && row.weapp[key] != undefined)
formData[key] = row.weapp[key]
})
}
loading.value = false
}
defineExpose({
showDialog,
setFormData
showDialog,
setFormData,
})
</script>

195
admin/src/app/views/setting/components/notice-wechat.vue
View File

@ -1,48 +1,80 @@
<template>
<el-dialog v-model="showDialog" :title="t('noticeSetting')" width="550px" :destroy-on-close="true">
<el-form :model="formData" label-width="110px" ref="formRef" :rules="formRules" class="page-form" v-loading="loading">
<el-form-item :label="t('status')">
<el-radio-group v-model="formData.is_wechat">
<el-radio :label="1">{{ t('startUsing') }}</el-radio>
<el-radio :label="0">{{ t('statusDeactivate') }}</el-radio>
</el-radio-group>
</el-form-item>
<el-dialog
v-model="showDialog"
:title="t('noticeSetting')"
width="550px"
:destroy-on-close="true"
>
<el-alert
v-if="!formData.bind_wechat && formData.is_need_bind_merchant"
title="未绑定接收者微信"
type="error"
:closable="false"
/>
<el-form
:model="formData"
label-width="110px"
ref="formRef"
:rules="formRules"
class="page-form"
v-loading="loading"
>
<el-form-item :label="t('status')">
<el-radio-group v-model="formData.is_wechat">
<el-radio :label="1">{{ t('startUsing') }}</el-radio>
<el-radio :label="0">{{ t('statusDeactivate') }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item :label="t('name')">
<div class="input-width">{{ formData.name }} </div>
</el-form-item>
<el-form-item :label="t('name')">
<div class="input-width">{{ formData.name }}</div>
</el-form-item>
<el-form-item :label="t('tempKey')">
<div class="input-width">{{ formData.temp_key }} </div>
</el-form-item>
<el-form-item :label="t('tempKey')">
<div class="input-width">{{ formData.temp_key }}</div>
</el-form-item>
<el-form-item :label="t('keywordNameList')">
<div class="input-width">{{ formData.keyword_name_list ? formData.keyword_name_list.join('，') : '' }} </div>
</el-form-item>
<el-form-item :label="t('keywordNameList')">
<div class="input-width">
{{
formData.keyword_name_list
? formData.keyword_name_list.join('，')
: ''
}}
</div>
</el-form-item>
<!-- <el-form-item :label="t('first')" prop="first">-->
<!-- <el-input v-model.trim="formData.wechat_first" :placeholder="t('firstPlaceholder')" class="input-width" show-word-limit clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item :label="t('first')" prop="first">-->
<!-- <el-input v-model.trim="formData.wechat_first" :placeholder="t('firstPlaceholder')" class="input-width" show-word-limit clearable />-->
<!-- </el-form-item>-->
<el-form-item :label="t('content')">
<div class="input-width">
<div v-for="(item, index) in formData.content" :key="index">{{ item[0] }}：{{ item[1] }} </div>
</div>
</el-form-item>
<el-form-item :label="t('content')">
<div class="input-width">
<div v-for="(item, index) in formData.content" :key="index">
{{ item[0] }}：{{ item[1] }}
</div>
</div>
</el-form-item>
<!-- <el-form-item :label="t('remark')" prop="remark">-->
<!-- <el-input v-model.trim="formData.wechat_remark" :placeholder="t('remarkPlaceholder')" class="input-width" show-word-limit clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item :label="t('remark')" prop="remark">-->
<!-- <el-input v-model.trim="formData.wechat_remark" :placeholder="t('remarkPlaceholder')" class="input-width" show-word-limit clearable />-->
<!-- </el-form-item>-->
</el-form>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="showDialog = false">{{ t('cancel') }}</el-button>
<el-button type="primary" :loading="loading" @click="confirm(formRef)">{{t('confirm')}}</el-button>
</span>
</template>
</el-dialog>
<template #footer>
<span class="dialog-footer">
<el-button @click="showDialog = false">{{
t('cancel')
}}</el-button>
<el-button
type="primary"
:loading="loading"
@click="confirm(formRef)"
>{{ t('confirm') }}</el-button
>
</span>
</template>
</el-dialog>
</template>
<script lang="ts" setup>
@ -58,18 +90,20 @@ const loading = ref(true)
* 表单数据
*/
const initialFormData = {
is_wechat: 0,
key: '',
name: '',
title: '',
type: '',
content: [],
// first: '',
// remark: '',
temp_key: '',
keyword_name_list: ''
// wechat_first: '',
// wechat_remark: ''
is_wechat: 0,
key: '',
name: '',
title: '',
type: '',
content: [],
// first: '',
// remark: '',
temp_key: '',
keyword_name_list: '',
// wechat_first: '',
// wechat_remark: ''
bind_wechat: '',
is_need_bind_merchant: '',
}
const formData: Record<string, any> = reactive({ ...initialFormData })
@ -78,9 +112,7 @@ const formRef = ref<FormInstance>()
// 表单验证规则
const formRules = computed(() => {
return {
}
return {}
})
const emit = defineEmits(['complete'])
@ -90,42 +122,45 @@ const emit = defineEmits(['complete'])
* @param formEl
*/
const confirm = async (formEl: FormInstance | undefined) => {
if (loading.value || !formEl) return
if (loading.value || !formEl) return
await formEl.validate(async (valid) => {
if (valid) {
loading.value = true
await formEl.validate(async (valid) => {
if (valid) {
loading.value = true
const data = formData
data.status = data.is_wechat
editNotice(data).then(res => {
loading.value = false
showDialog.value = false
emit('complete')
}).catch(() => {
loading.value = false
})
}
})
const data = formData
data.status = data.is_wechat
editNotice(data)
.then((res) => {
loading.value = false
showDialog.value = false
emit('complete')
})
.catch(() => {
loading.value = false
})
}
})
}
const setFormData = async (row: any = null) => {
loading.value = true
Object.assign(formData, initialFormData)
if (row) {
Object.keys(formData).forEach((key: string) => {
if (row[key] != undefined) formData[key] = row[key]
if (row.wechat && row.wechat[key] != undefined) formData[key] = row.wechat[key]
})
// if (!row.wechat_first) formData['wechat_first'] = row['first']
// if (!row.wechat_remark) formData['wechat_remark'] = row['remark']
}
loading.value = false
loading.value = true
Object.assign(formData, initialFormData)
if (row) {
Object.keys(formData).forEach((key: string) => {
if (row[key] != undefined) formData[key] = row[key]
if (row.wechat && row.wechat[key] != undefined)
formData[key] = row.wechat[key]
})
// if (!row.wechat_first) formData['wechat_first'] = row['first']
// if (!row.wechat_remark) formData['wechat_remark'] = row['remark']
}
loading.value = false
}
defineExpose({
showDialog,
setFormData
showDialog,
setFormData,
})
</script>

55
admin/src/app/views/setting/map.vue
View File

@ -7,15 +7,50 @@
</div>
<el-form class="page-form mt-[20px]" :model="formData" :rules="formRules" label-width="150px" ref="formRef" v-loading="loading">
<el-form-item :label="t('mapKey')" prop="key">
<el-input v-model.trim="formData.key" class="input-width" clearable />
<span class="ml-2 cursor-pointer tutorial-btn" @click="tutorialFn">{{ t('clickTutorial') }}</span>
<span class="ml-2 cursor-pointer secret-btn" @click="secretFn('https://lbs.qq.com/dev/console/key/manage')">{{ t('clickSecretKey') }}</span>
</el-form-item>
<el-form-item :label="t('aMapKey')" prop="key">
<el-input v-model.trim="formData.amap_key" class="input-width" clearable />
<span class="ml-2 cursor-pointer secret-btn" @click="secretFn('https://lbs.amap.com/')">{{ t('clickSecretKey') }}</span>
<el-form-item label="地图类型" prop="map_type">
<div>
<el-radio-group v-model="formData.map_type">
<el-radio label="tianditu">天地图</el-radio>
<el-radio label="tencent">腾讯地图</el-radio>
</el-radio-group>
<div class="text-sm text-gray-400 mt-[10px] leading-none">选择地图服务提供商</div>
</div>
</el-form-item>
<template v-if="formData.map_type === 'tencent'">
<el-form-item :label="t('mapKey')" prop="key">
<div>
<div class="flex items-center">
<el-input v-model.trim="formData.key" class="input-width" clearable />
<span class="ml-2 cursor-pointer tutorial-btn" @click="tutorialFn">{{ t('clickTutorial') }}</span>
<span class="ml-2 cursor-pointer secret-btn" @click="secretFn('https://lbs.qq.com/dev/console/key/manage')">{{ t('clickSecretKey') }}</span>
</div>
</div>
</el-form-item>
</template>
<template v-if="formData.map_type === 'tianditu'">
<el-form-item label="天地图服务端KEY" prop="tianditu_map_key">
<div>
<div class="flex items-center">
<el-input v-model.trim="formData.tianditu_map_key" class="input-width" clearable />
<span class="ml-2 cursor-pointer secret-btn" @click="secretFn('https://cloudcenter.tianditu.gov.cn/center/development/myApp')">获取密钥</span>
</div>
<div class="text-sm text-gray-400 mt-[10px] leading-none">天地图服务器端API密钥，用于后端地理编码等服务，请求从业务服务器发起，不支持前端地图瓦片加载与 JS API 渲染。</div>
<div class="text-sm text-gray-400 mt-[10px] leading-none">使用场景：如地理编码、逆地理编码、坐标转换、批量 POI 查询等。</div>
</div>
</el-form-item>
<el-form-item label="天地图浏览器端KEY" prop="tianditu_map_web_key">
<div>
<div class="flex items-center">
<el-input v-model.trim="formData.tianditu_map_web_key" class="input-width" clearable />
<span class="ml-2 cursor-pointer secret-btn" @click="secretFn('https://cloudcenter.tianditu.gov.cn/center/development/myApp')">获取密钥</span>
</div>
<div class="text-sm text-gray-400 mt-[10px] leading-none">天地图浏览器端API密钥，用于前端加载地图，不可用于后端接口鉴权。</div>
<div class="text-sm text-gray-400 mt-[10px] leading-none">使用场景：展示地图瓦片、实现地图交互（缩放、拖拽、图层切换、标注、可视化展示、地图选位置等）。</div>
</div>
</el-form-item>
</template>
<el-form-item :label="t('isOpen')" prop="is_open">
<el-switch v-model="formData.is_open" :active-value="1" :inactive-value="0" />
</el-form-item>
@ -45,8 +80,10 @@ import { FormInstance } from 'element-plus'
const loading = ref(true)
const formRef = ref<FormInstance>()
const formData = reactive({
map_type: 'tencent',
key: '',
amap_key: '',
tianditu_map_key: '',
tianditu_map_web_key: '',
is_open: 0,
valid_time: 0
})

828
admin/src/app/views/setting/notice.vue
View File

@ -1,176 +1,716 @@
<template>
<!--消息模板-->
<div class="main-container" v-loading="noticeTableData.loading">
<el-card class="box-card !border-none" shadow="never">
<h3 class="panel-title !text-sm">{{ t('buyerNotice') }}</h3>
<!--消息模板-->
<div class="main-container" v-loading="noticeTableData.loading">
<el-card class="box-card !border-none" shadow="never">
<h3 class="panel-title !text-sm">{{ t('buyerNotice') }}</h3>
<div class="flex flex-row flex-wrap">
<el-table
:data="noticeTableData.buyer"
size="large"
:span-method="buyerSpan"
>
<el-table-column
prop="addon_name"
:label="t('addon')"
min-width="120"
/>
<el-table-column
prop="name"
:label="t('noticeType')"
min-width="120"
/>
<el-table-column
:label="t('operation')"
align="right"
fixed="right"
min-width="300"
>
<template #default="{ row }">
<div class="flex">
<div
class="text-sm mr-1 flex items-center cursor-pointer"
v-if="row.support_type.indexOf('sms') != -1"
@click="setNotice(row, 'sms')"
>
<el-icon
class="text-[15px] mr-[3px]"
:class="row.is_sms ? 'open' : ''"
>
<SuccessFilled />
</el-icon>
<span class="ml-0.5">{{ t('sms') }}</span>
</div>
<div
class="text-sm flex items-center cursor-pointer ml-[20px]"
v-if="
row.support_type.indexOf('wechat') != -1
"
@click="setNotice(row, 'wechat')"
>
<el-icon
class="text-[15px] mr-[3px]"
:class="row.is_wechat ? 'open' : ''"
>
<SuccessFilled />
</el-icon>
<span class="ml-0.5">{{
t('wechat')
}}</span>
</div>
<div
class="text-sm flex items-center cursor-pointer ml-[20px]"
v-if="
row.support_type.indexOf('weapp') != -1
"
@click="setNotice(row, 'weapp')"
>
<el-icon
class="text-[15px] mr-[3px]"
:class="row.is_weapp ? 'open' : ''"
>
<SuccessFilled />
</el-icon>
<span class="ml-0.5">{{ t('weapp') }}</span>
</div>
</div>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
<div class="flex flex-row flex-wrap">
<el-table :data="noticeTableData.buyer" size="large" :span-method="buyerSpan">
<el-table-column prop="addon_name" :label="t('addon')" min-width="120" />
<el-table-column prop="name" :label="t('noticeType')" min-width="120" />
<el-table-column :label="t('operation')" align="right" fixed="right" min-width="300">
<template #default="{ row }">
<div class="flex">
<div class="text-sm mr-1 flex items-center cursor-pointer" v-if="row.support_type.indexOf('sms') != -1" @click="setNotice(row, 'sms')">
<el-icon class="text-[15px] mr-[3px]" :class="row.is_sms ? 'open' : ''">
<SuccessFilled />
</el-icon>
<span class="ml-0.5">{{ t('sms') }}</span>
</div>
<div class="text-sm flex items-center cursor-pointer ml-[20px]" v-if="row.support_type.indexOf('wechat') != -1" @click="setNotice(row, 'wechat')">
<el-icon class="text-[15px] mr-[3px]" :class="row.is_wechat ? 'open' : ''">
<SuccessFilled />
</el-icon>
<span class="ml-0.5">{{ t('wechat') }}</span>
</div>
<div class="text-sm flex items-center cursor-pointer ml-[20px]" v-if="row.support_type.indexOf('weapp') != -1" @click="setNotice(row, 'weapp')">
<el-icon class="text-[15px] mr-[3px]" :class="row.is_weapp ? 'open' : ''">
<SuccessFilled />
</el-icon>
<span class="ml-0.5">{{ t('weapp') }}</span>
</div>
</div>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
<el-card class="box-card mt-[15px] !border-none" shadow="never">
<div class="flex items-center mb-[20px] gap-[10px]">
<h3 class="panel-title !text-sm !mb-[0]">
{{ t('sellerNotice') }}
</h3>
<el-button
type="primary"
@click="openBindAccountDialog"
class="!text-[12px]"
>绑定接收信息账号</el-button
>
</div>
<el-card class="box-card mt-[15px] !border-none" shadow="never">
<h3 class="panel-title !text-sm">{{ t('sellerNotice') }}</h3>
<div class="flex flex-row flex-wrap">
<el-table
:data="noticeTableData.seller"
size="large"
:span-method="buyerSpan"
>
<el-table-column
prop="addon_name"
:label="t('addon')"
min-width="120"
/>
<el-table-column
prop="name"
:label="t('noticeType')"
min-width="120"
/>
<el-table-column
:label="t('operation')"
align="right"
fixed="right"
min-width="300"
>
<template #default="{ row }">
<div class="flex">
<div
class="text-sm mr-1 flex items-center cursor-pointer"
v-if="row.support_type.indexOf('sms') != -1"
@click="setNotice(row, 'sms')"
>
<el-icon
class="text-[15px] mr-[3px]"
:class="row.is_sms ? 'open' : ''"
>
<SuccessFilled />
</el-icon>
<span class="ml-0.5">{{ t('sms') }}</span>
</div>
<div
class="text-sm flex items-center cursor-pointer ml-[20px]"
v-if="
row.support_type.indexOf('wechat') != -1
"
@click="setNotice(row, 'wechat')"
>
<el-icon
class="text-[15px] mr-[3px]"
:class="row.is_wechat ? 'open' : ''"
>
<SuccessFilled />
</el-icon>
<span class="ml-0.5">{{
t('wechat')
}}</span>
</div>
<div
class="text-sm flex items-center cursor-pointer ml-[20px]"
v-if="
row.support_type.indexOf('weapp') != -1
"
@click="setNotice(row, 'weapp')"
>
<el-icon
class="text-[15px] mr-[3px]"
:class="row.is_weapp ? 'open' : ''"
>
<SuccessFilled />
</el-icon>
<span class="ml-0.5">{{ t('weapp') }}</span>
</div>
</div>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
<div class="flex flex-row flex-wrap">
<el-table :data="noticeTableData.seller" size="large" :span-method="buyerSpan">
<el-table-column prop="addon_name" :label="t('addon')" min-width="120" />
<el-table-column prop="name" :label="t('noticeType')" min-width="120" />
<el-table-column :label="t('operation')" align="right" fixed="right" min-width="300">
<template #default="{ row }">
<div class="flex">
<div class="text-sm mr-1 flex items-center cursor-pointer" v-if="row.support_type.indexOf('sms') != -1" @click="setNotice(row, 'sms')">
<el-icon class="text-[15px] mr-[3px]" :class="row.is_sms ? 'open' : ''">
<SuccessFilled />
</el-icon>
<span class="ml-0.5">{{ t('sms') }}</span>
</div>
<div class="text-sm flex items-center cursor-pointer ml-[20px]" v-if="row.support_type.indexOf('wechat') != -1" @click="setNotice(row, 'wechat')">
<el-icon class="text-[15px] mr-[3px]" :class="row.is_wechat ? 'open' : ''">
<SuccessFilled />
</el-icon>
<span class="ml-0.5">{{ t('wechat') }}</span>
</div>
<div class="text-sm flex items-center cursor-pointer ml-[20px]" v-if="row.support_type.indexOf('weapp') != -1" @click="setNotice(row, 'weapp')">
<el-icon class="text-[15px] mr-[3px]" :class="row.is_weapp ? 'open' : ''">
<SuccessFilled />
</el-icon>
<span class="ml-0.5">{{ t('weapp') }}</span>
</div>
</div>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
<sms ref="smsDialog" @complete="loadNoticeList()" />
<wechat ref="wechatDialog" @complete="loadNoticeList()" />
<weapp ref="weappDialog" @complete="loadNoticeList()" />
<el-dialog
v-model="bindDialogVisible"
@close="bindDialogClose"
width="300"
>
<view class="flex flex-col justify-center items-center">
<span class="mb-[15px]">{{ isBind.title }}</span>
<el-image
v-if="isBind.key == 'weapp'"
class="w-[120px] h-[120px]"
:src="isBind.weapp_qrcode"
:fit="contain"
/>
<el-image
v-else
class="w-[120px] h-[120px]"
:src="isBind.wechat_qrcode"
:fit="contain"
/>
</view>
</el-dialog>
<sms ref="smsDialog" @complete="loadNoticeList()" />
<wechat ref="wechatDialog" @complete="loadNoticeList()" />
<weapp ref="weappDialog" @complete="loadNoticeList()" />
<!-- 绑定接收信息账号弹窗 -->
<el-dialog
v-model="bindAccountDialogVisible"
title="绑定接收信息账号"
width="500px"
@close="bindAccountDialogClose"
>
<div class="account-bind-options">
<div class="option-item">
<div class="flex flex-col">
<span class="title" v-if="!isBind.bind_sms_info"
>手机号</span
>
<span class="info" v-else
>手机号：{{ isBind.bind_sms_info }}</span
>
</div>
<template v-if="!Number(isBind.bind_sms)">
<el-button
type="primary"
@click="bindSmsFn"
class="!text-[12px]"
>绑定</el-button
>
</template>
<template v-else>
<el-button
type="danger"
@click="cancelBindFn('sms')"
class="!text-[12px]"
>解绑</el-button
>
</template>
</div>
<div class="option-item">
<div class="flex flex-col">
<span class="title" v-if="!isBind.bind_wechat_info"
>微信账号</span
>
<span class="info" v-else
>微信openId：{{ isBind.bind_wechat_info }}</span
>
</div>
<template v-if="!Number(isBind.bind_wechat)">
<el-button
type="primary"
@click="bindWeChatFn"
class="!text-[12px]"
>绑定</el-button
>
</template>
<template v-else>
<el-button
type="danger"
@click="cancelBindFn('wechat')"
class="!text-[12px]"
>解绑</el-button
>
</template>
</div>
<!-- <div class="option-item">-->
<!-- <div class="flex flex-col">-->
<!-- <span class="title" v-if="!isBind.bind_weapp_info"-->
<!-- >小程序账号</span-->
<!-- >-->
<!-- <span class="info" v-else-->
<!-- >小程序openId：{{ isBind.bind_weapp_info }}</span-->
<!-- >-->
<!-- </div>-->
<!-- <template v-if="!Number(isBind.bind_weapp)">-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- @click="bindWeappFn"-->
<!-- class="!text-[12px]"-->
<!-- >绑定</el-button-->
<!-- >-->
<!-- </template>-->
<!-- <template v-else>-->
<!-- <el-button-->
<!-- type="danger"-->
<!-- @click="cancelBindFn('weapp')"-->
<!-- class="!text-[12px]"-->
<!-- >解绑</el-button-->
<!-- >-->
<!-- </template>-->
<!-- </div>-->
</div>
</el-dialog>
</div>
<!-- 新增：短信绑定弹窗 -->
<el-dialog
v-model="smsBindDialogVisible"
title="绑定接收信息手机号"
width="400px"
@close="resetSmsBindForm"
>
<el-form
:model="smsBindForm"
:rules="smsBindRules"
ref="smsBindFormRef"
label-width="80px"
>
<el-form-item label="手机号" prop="mobile">
<el-input
v-model="smsBindForm.mobile"
placeholder="请输入手机号"
maxlength="11"
@input="handleMobileInput"
/>
</el-form-item>
<el-form-item label="验证码" prop="code">
<el-input
v-model="smsBindForm.code"
placeholder="请输入验证码"
maxlength="6"
style="width: 50%"
/>
<el-button
class="ml-2"
type="primary"
:disabled="
!canSendCode ||
sendingCode ||
smsBindForm.mobile.length !== 11
"
@click="sendSmsCode"
>
{{ codeBtnText }}
</el-button>
</el-form-item>
</el-form>
<template #footer>
<el-button @click="smsBindDialogVisible = false"
>取消</el-button
>
<el-button
type="primary"
:loading="bindingSms"
@click="submitSmsBind"
>
确认绑定
</el-button>
</template>
</el-dialog>
</div>
</template>
<script lang="ts" setup>
import { reactive, ref } from 'vue'
import { t } from '@/lang'
import { getNoticeList } from '@/app/api/notice'
import {
getNoticeList,
cancelBind,
getBindInfo,
getWechatAuthUrl,
getWeappAuthUrl,
sendSms,
bindSms
} from '@/app/api/notice'
import Sms from '@/app/views/setting/components/notice-sms.vue'
import Wechat from '@/app/views/setting/components/notice-wechat.vue'
import Weapp from '@/app/views/setting/components/notice-weapp.vue'
import QRCode from 'qrcode'
import { img } from '@/utils/common'
import { SuccessFilled } from '@element-plus/icons-vue'
import type { FormInstance, FormRules } from 'element-plus'
import { ElMessage, ElMessageBox } from 'element-plus'
const smsDialog : Record<string, any> | null = ref(null)
const wechatDialog : Record<string, any> | null = ref(null)
const weappDialog : Record<string, any> | null = ref(null)
const smsDialog: Record<string, any> | null = ref(null)
const wechatDialog: Record<string, any> | null = ref(null)
const weappDialog: Record<string, any> | null = ref(null)
const noticeTableData = reactive({
loading: true,
buyer: [],
seller: []
})
// 新增：绑定接收信息账号弹窗显示状态
const bindAccountDialogVisible = ref(false)
// 打开绑定接收信息账号弹窗
const openBindAccountDialog = () => {
bindAccountDialogVisible.value = true
}
// 关闭绑定接收信息账号弹窗
const bindAccountDialogClose = () => {
bindAccountDialogVisible.value = false
}
const noticeTableData = reactive({ loading: true, buyer: [], seller: [] })
/**
* 获取配置信息
*/
const loadNoticeList = () => {
noticeTableData.loading = true
getNoticeList({}).then(res => {
noticeTableData.buyer = []
noticeTableData.seller = []
res.data.forEach(item => {
if (item.notice.length) {
const buyer = []; const seller = []
Object.keys(item.notice).forEach((key, index) => {
const notice = item.notice[key]
notice.addon_name = item.title
notice.receiver_type == 1 ? buyer.push(notice) : seller.push(notice)
})
if (buyer.length) {
buyer[0].rowspan = buyer.length
noticeTableData.buyer = noticeTableData.buyer.concat(buyer)
}
if (seller.length) {
seller[0].rowspan = seller.length
noticeTableData.seller = noticeTableData.seller.concat(seller)
}
}
})
noticeTableData.loading = false
}).catch((e) => {
noticeTableData.loading = false
})
noticeTableData.loading = true
getNoticeList({})
.then((res) => {
noticeTableData.buyer = []
noticeTableData.seller = []
res.data.forEach((item) => {
if (item.notice.length) {
const buyer = []
const seller = []
Object.keys(item.notice).forEach((key, index) => {
const notice = item.notice[key]
notice.addon_name = item.title
notice.receiver_type == 1
? buyer.push(notice)
: seller.push(notice)
})
if (buyer.length) {
buyer[0].rowspan = buyer.length
noticeTableData.buyer =
noticeTableData.buyer.concat(buyer)
}
if (seller.length) {
seller[0].rowspan = seller.length
noticeTableData.seller =
noticeTableData.seller.concat(seller)
}
}
})
noticeTableData.loading = false
})
.catch((e) => {
noticeTableData.loading = false
})
}
const buyerSpan = (row : any) => {
if (row.columnIndex === 0) {
if (row.row.rowspan) {
return {
rowspan: row.row.rowspan,
colspan: 1
}
} else {
return {
rowspan: 0,
colspan: 0
}
}
}
const isBind = ref({
bind_sms: 0, // 新增：短信绑定状态
bind_wechat: 0,
bind_weapp: 0,
bind_sms_info: '',
bind_wechat_info: '',
bind_weapp_info: '',
wechat_qrcode: '',
weapp_qrcode: '',
title: '',
key: 'wechat',
})
// 查看是否绑定
const getBindInfoFn = (isFirstQuery = false) => {
getBindInfo().then((res) => {
if (Object.keys(res.data).length > 0) {
isBind.value.bind_sms = res.data.mobile ? 1 : 0 // 新增：更新短信绑定状态
isBind.value.bind_wechat = res.data.wechat_openid ? 1 : 0 // 新增：更新微信绑定状态
isBind.value.bind_weapp = res.data.weapp_openid ? 1 : 0 // 新增：更新小程序绑定状态
isBind.value.bind_sms_info = res.data.mobile
isBind.value.bind_wechat_info = res.data.wechat_openid
isBind.value.bind_weapp_info = res.data.weapp_openid
if (!isFirstQuery && isBind.value[`bind_${isBind.value.key}`]) {
bindDialogClose()
}
}
})
}
getBindInfoFn(true)
// --------------------- 绑定微信 ---------------------
let isBindRepeat = false
const bindDialogVisible = ref(false)
const requestTimer = ref()
const bindWeChatFn = () => {
if (isBindRepeat) return
isBindRepeat = true
getWechatAuthUrl()
.then((res) => {
isBindRepeat = false
if (res?.data?.url) generateQRCode(res.data.url, 'wechat_qrcode')
bindDialogVisible.value = true
isBind.value.title = '微信扫一扫，绑定接收信息微信'
isBind.value.key = 'wechat'
requestTimer.value = setInterval(getBindInfoFn, 1000)
})
.catch((e) => {
isBindRepeat = false
})
}
const bindWeappFn = () => {
if (isBindRepeat) return
isBindRepeat = true
getWeappAuthUrl()
.then((res) => {
isBindRepeat = false
if (res?.data?.url) isBind.value.weapp_qrcode = img(res.data.url)
bindDialogVisible.value = true
isBind.value.title = '微信扫一扫，绑定接收信息小程序'
isBind.value.key = 'weapp'
requestTimer.value = setInterval(getBindInfoFn, 1000)
})
.catch((e) => {
isBindRepeat = false
})
}
const generateQRCode = async (url, type) => {
try {
// 生成二维码
isBind.value[type] = await QRCode.toDataURL(url, {
errorCorrectionLevel: 'L',
margin: 0,
width: 120,
})
} catch (e) {
isBind.value[type] = ''
console.error('生成二维码失败', e)
}
}
// --------------------- 取消绑定 ---------------------
const isUnbindRepeat = ref(false)
const cancelBindFn = (key: any) => {
ElMessageBox.confirm('确定取消绑定吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
}).then(() => {
if (isUnbindRepeat.value) return
isUnbindRepeat.value = true
cancelBind({ unbind_type: [key] })
.then((res) => {
ElMessage({ message: '取消绑定成功', type: 'success' })
getBindInfoFn()
isUnbindRepeat.value = false
})
.catch((e) => {
isUnbindRepeat.value = false
})
})
}
const bindDialogClose = () => {
clearInterval(requestTimer.value)
bindDialogVisible.value = false
}
// --------------------- 新增：短信绑定相关逻辑 ---------------------
// 短信绑定弹窗显示状态
const smsBindDialogVisible = ref(false)
// 表单ref
const smsBindFormRef = ref<FormInstance>()
// 绑定中状态
const bindingSms = ref(false)
// 是否可以发送验证码
const canSendCode = ref(true)
// 发送验证码中
const sendingCode = ref(false)
// 验证码按钮文字
const codeBtnText = ref('发送验证码')
// 倒计时秒数
const countdown = ref(60)
// 短信绑定表单
const smsBindForm = reactive({
mobile: '', // 手机号
code: '', // 验证码
mobile_key: '', // 发送验证码返回的key
})
// 短信绑定表单验证规则
const smsBindRules = reactive<FormRules>({
mobile: [
{ required: true, message: '请输入手机号', trigger: 'blur' },
{
pattern: /^1[3-9]\d{9}$/,
message: '请输入正确的手机号',
trigger: 'blur',
},
],
code: [
{ required: true, message: '请输入验证码', trigger: 'blur' },
{ pattern: /^\d{4}$/, message: '请输入6位数字验证码', trigger: 'blur' },
],
})
// 手机号输入处理（只保留数字）
const handleMobileInput = (val: string) => {
smsBindForm.mobile = val.replace(/\D/g, '')
}
// 发送验证码
const sendSmsCode = async () => {
try {
sendingCode.value = true
// 发送验证码请求
const res = await sendSms({ mobile: smsBindForm.mobile })
if (res.data) {
// 保存返回的mobile_key
smsBindForm.mobile_key = res.data.key || ''
// 开始倒计时
canSendCode.value = false
codeBtnText.value = `${countdown.value}秒后重新发送`
const timer = setInterval(() => {
countdown.value--
codeBtnText.value = `${countdown.value}秒后重新发送`
if (countdown.value <= 0) {
clearInterval(timer)
canSendCode.value = true
codeBtnText.value = '发送验证码'
countdown.value = 60
}
}, 1000)
}
} catch (error) {
} finally {
sendingCode.value = false
}
}
// 提交短信绑定
const submitSmsBind = async () => {
if (!smsBindFormRef.value) return
// 表单验证
try {
await smsBindFormRef.value.validate()
bindingSms.value = true
// 调用绑定接口
const res = await bindSms({
mobile: smsBindForm.mobile,
mobile_key: smsBindForm.mobile_key,
mobile_code: smsBindForm.code,
})
if (res) {
smsBindDialogVisible.value = false
getBindInfoFn() // 更新绑定状态
}
} catch (error) {
} finally {
bindingSms.value = false
}
}
// 重置短信绑定表单
const resetSmsBindForm = () => {
smsBindForm.mobile = ''
smsBindForm.code = ''
smsBindForm.mobile_key = ''
canSendCode.value = true
codeBtnText.value = '发送验证码'
countdown.value = 60
if (smsBindFormRef.value) {
smsBindFormRef.value.clearValidate()
}
}
// 实现bindSmsFn方法
const bindSmsFn = () => {
// 打开短信绑定弹窗
smsBindDialogVisible.value = true
// 重置表单
resetSmsBindForm()
}
// --------------------- 短信绑定逻辑结束 ---------------------
const buyerSpan = (row: any) => {
if (row.columnIndex === 0) {
if (row.row.rowspan) {
return { rowspan: row.row.rowspan, colspan: 1 }
} else {
return { rowspan: 0, colspan: 0 }
}
}
}
loadNoticeList()
const setNotice = (data : any, type : string) => {
data.type = type
data.status = data['is_' + type]
if (type === 'sms') {
smsDialog.value.setFormData(data)
smsDialog.value.showDialog = true
} else if (type === 'wechat') {
wechatDialog.value.setFormData(data)
wechatDialog.value.showDialog = true
} else if (type === 'weapp') {
weappDialog.value.setFormData(data)
weappDialog.value.showDialog = true
}
const setNotice = (data: any, type: string) => {
data.type = type
data.status = data['is_' + type]
if (type === 'sms') {
data.bind_sms = isBind.value.bind_sms
smsDialog.value.setFormData(data)
smsDialog.value.showDialog = true
} else if (type === 'wechat') {
data.bind_wechat = isBind.value.bind_wechat
wechatDialog.value.setFormData(data)
wechatDialog.value.showDialog = true
} else if (type === 'weapp') {
data.bind_weapp = isBind.value.bind_weapp
weappDialog.value.setFormData(data)
weappDialog.value.showDialog = true
}
}
</script>
<style lang="scss" scoped>
.open {
color: var(--el-color-primary);
}
.open {
color: var(--el-color-primary);
}
.notice-type {
>div:nth-last-child(1):first-child {
width: 100%;
}
}
</style>
.notice-type {
> div:nth-last-child(1):first-child {
width: 100%;
}
}
.account-bind-options {
.option-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 0;
border-bottom: 1px solid var(--el-border-color-lighter);
&:last-child {
border-bottom: none;
}
.title {
font-size: 14px;
color: var(--el-text-color-regular);
}
.info {
color: #333;
}
}
}
</style>

9
admin/src/app/views/setting/transfer_scene.vue
View File

@ -6,7 +6,7 @@
<div class="flex items-center">
<span class="text-[14px] mr-[10px]">{{ t('transferSceneId') }}：</span>
<div class="flex items-center">
<el-input v-model.trim="item.scene_id" maxlength="5" class="!w-[60px]" :disabled="item.disabled" @blur="handleInput($event,key,item)" :ref="(el: any) =>{ if(el) inputRefs[key] = el }" v-show="!item.disabled"/>
<el-input v-model.trim="item.scene_id" maxlength="5" minlength="4" class="!w-[60px]" :disabled="item.disabled" @blur="handleInput($event,key,item)" :ref="(el: any) =>{ if(el) inputRefs[key] = el }" v-show="!item.disabled"/>
<div v-show="item.disabled">{{item.scene_id ? item.scene_id : '--'}}</div>
<div @click="handleDisabled(item, key)" class="w-[40xp] flex items-center ml-[8px]"><el-icon size="20" color="var(--el-color-primary)"><Edit /></el-icon></div>
</div>
@ -80,7 +80,8 @@ getTransferSceneFn()
// 更改场景值
const handleInput = (e: any, key: any, data: any) => {
if (e.target.value) {
const originalValue = originalValues.value[key]
if (e.target.value && e.target.value.length >= 4) {
setSceneId({
scene: key,
scene_id: e.target.value
@ -89,11 +90,15 @@ const handleInput = (e: any, key: any, data: any) => {
getTransferSceneFn()
})
} else {
data.scene_id = originalValue
data.disabled = true
}
}
const inputRefs = ref<any>({})
const originalValues = ref<any>({})
const handleDisabled = (data: any, key: any) => {
// 保存原始值
originalValues.value[key] = data.scene_id
data.disabled = false
nextTick(() => {
inputRefs.value[key].focus()

512
admin/src/components/map-selector/index.vue Normal file
View File

@ -0,0 +1,512 @@
<template>
<div :id="containerId" :class="containerClass" :style="containerStyle" v-loading="loading"></div>
</template>
<script lang="ts" setup>
import { ref, onMounted, watch, nextTick, onBeforeUnmount } from 'vue'
import { ElMessage } from 'element-plus'
import { t } from '@/lang'
import { getMap } from '@/app/api/sys'
import {
createMarker,
createCircle,
createPolygon,
deleteGeometry,
selectGeometry,
latLngToAddress
} from '@/utils/qqmap'
// 天地图工具
import {
createCircle as tdCreateCircle,
createPolygon as tdCreatePolygon,
deleteGeometry as tdDeleteGeometry,
selectGeometry as tdSelectGeometry,
clearAllGeometry,
latLngToAddress as tiandituLatLngToAddress
} from '@/utils/tianditu'
const MAP_INIT_DELAY = 500
const MAP_SEARCH_TIMEOUT = 5000
const MAP_SEARCH_INTERVAL = 100
const MAP_SEARCH_MAX_ATTEMPTS = 50
interface MapInstance {
destroy?: () => void
clearOverLays?: () => void
on?: (event: string, callback: Function) => void
addControl?: (control: any) => void
addOverLay?: (overlay: any) => void
removeOverLay?: (overlay: any) => void
centerAndZoom?: (center: any, zoom: number) => void
setZoom?: (zoom: number) => void
setCenter?: (center: any) => void
addEventListener?: (event: string, callback: Function) => void
}
interface Props {
containerId?: string
containerClass?: string
containerStyle?: string
longitude?: string | number
latitude?: string | number
zoom?: number
selectedKey?: string
disabledClickMarker?: any // 是否禁止点击事件添加标注
}
interface Emits {
(e: 'update:longitude', value: string): void
(e: 'update:latitude', value: string): void
(e: 'locationChange', data: { lat: number, lng: number, address: any }): void
(e: 'areaChange', data: { key: string, type: 'circle' | 'polygon', path: any }): void
(e: 'selectChange', key: string): void
}
const props = withDefaults(defineProps<Props>(), {
containerId: 'map-container',
containerClass: 'w-[800px] h-[500px] relative border border-gray-300',
containerStyle: '',
longitude: 116.397463,
latitude: 39.909187,
zoom: 14,
selectedKey: '',
disabledClickMarker: false
})
const emit = defineEmits<Emits>()
const loading = ref(true)
const mapKey = ref('')
const mapType = ref<'tencent' | 'tianditu'>('tianditu')
let map: MapInstance | null = null
let marker: any = null
const overlays = ref<any[]>([])
// 获取地图配置
const getMapConfigData = () => {
return getMap({
need_encrypt: false
}).then((res: any) => {
mapType.value = res.data.map_type || 'tianditu'
mapKey.value = mapType.value === 'tianditu' ? res.data.tianditu_map_web_key : res.data.key
}).catch((error) => {
loading.value = false
ElMessage.error(t('获取地图配置失败'))
})
}
// 初始化腾讯地图
const initTencentMap = () => {
const mapScript = document.createElement('script')
mapScript.src = 'https://map.qq.com/api/gljs?libraries=tools,service&v=1.exp&key=' + mapKey.value
document.body.appendChild(mapScript)
mapScript.onload = () => {
setTimeout(() => {
const TMap = (window as any).TMap
if (TMap) {
const lng = props.longitude ? Number(props.longitude) : 116.397463
const lat = props.latitude ? Number(props.latitude) : 39.909187
const center = new TMap.LatLng(lat, lng)
map = new TMap.Map(props.containerId, { center, zoom: props.zoom })
map.on('tilesloaded', () => loading.value = false)
marker = createMarker(map)
if(!props.disabledClickMarker) {
map.on('click', (evt: any) => {
const ll = evt?.latLng
if (!ll) return
const lat = typeof ll.getLat === 'function' ? ll.getLat() : ll.lat
const lng = typeof ll.getLng === 'function' ? ll.getLng() : ll.lng
if (lat == null || lng == null || Number.isNaN(lat) || Number.isNaN(lng)) return
const newCenter = new TMap.LatLng(lat, lng)
map.setZoom(16)
map.setCenter(newCenter)
marker.updateGeometries({ id: 'center', position: newCenter })
nextTick(() => {
handleLocationChange(lat, lng)
})
})
}
if (props.latitude && props.longitude) {
handleLocationChange(lat, lng)
}
} else {
loading.value = false
ElMessage.error(t('腾讯地图加载失败'))
}
}, MAP_INIT_DELAY)
}
mapScript.onerror = () => {
loading.value = false
ElMessage.error(t('腾讯地图脚本加载失败'))
}
}
// 初始化天地图
const initTiandituMap = () => {
const mapScript = document.createElement('script')
mapScript.src = 'https://api.tianditu.gov.cn/api?v=4.0&tk=' + mapKey.value
document.body.appendChild(mapScript)
mapScript.onload = () => {
setTimeout(() => {
const T = (window as any).T
if (T) {
const lng = props.longitude ? Number(props.longitude) : 116.397463
const lat = props.latitude ? Number(props.latitude) : 39.909187
map = new T.Map(props.containerId)
map.centerAndZoom(new T.LngLat(lng, lat), props.zoom)
const ctrl = new T.Control.Zoom()
map.addControl(ctrl)
marker = new T.Marker(new T.LngLat(lng, lat))
map.addOverLay(marker)
loading.value = false
if(!props.disabledClickMarker) {
map.addEventListener('click', (evt: any) => {
const lngLat = evt.lnglat
if (!lngLat) return
const lat = lngLat.lat
const lng = lngLat.lng
if (lat == null || lng == null || Number.isNaN(lat) || Number.isNaN(lng)) return
map.removeOverLay(marker)
marker = new T.Marker(new T.LngLat(lng, lat))
map.addOverLay(marker)
map.centerAndZoom(new T.LngLat(lng, lat), 16)
nextTick(() => {
handleLocationChange(lat, lng)
})
})
}
if (props.latitude && props.longitude) {
handleLocationChange(lat, lng)
}
} else {
loading.value = false
ElMessage.error(t('天地图加载失败'))
}
}, MAP_INIT_DELAY)
}
mapScript.onerror = () => {
loading.value = false
ElMessage.error(t('天地图加载失败，请检查密钥配置'))
}
}
// 初始化地图
const initMap = () => {
if (!mapKey.value) {
loading.value = false
return
}
// 防止重复初始化
if (map) {
return
}
if (mapType.value === 'tencent') {
initTencentMap()
} else if (mapType.value === 'tianditu') {
initTiandituMap()
}
}
// 处理位置变化
const handleLocationChange = (lat: number, lng: number) => {
emit('update:longitude', String(lng))
emit('update:latitude', String(lat))
if (mapType.value === 'tencent') {
latLngToAddress({ mapKey: mapKey.value, lat, lng }).then(({ message, result }) => {
if (message == 'query ok' || message == 'Success') {
emit('locationChange', { lat, lng, address: result })
}
})
} else if (mapType.value === 'tianditu') {
tiandituLatLngToAddress({ mapKey: mapKey.value, lat, lng }).then((addressData: any) => {
emit('locationChange', { lat, lng, address: addressData })
}).catch((error: any) => {
ElMessage.error(error.message || t('地址解析失败'))
})
}
}
// 更新地图位置（供外部调用）
const updateLocation = (lat: number, lng: number) => {
if (!map || !marker) return
if (mapType.value === 'tencent') {
const TMap = (window as any).TMap
if (!TMap) return
const newCenter = new TMap.LatLng(lat, lng)
map.setZoom(16)
map.setCenter(newCenter)
marker.updateGeometries({ id: 'center', position: newCenter })
} else if (mapType.value === 'tianditu') {
const T = (window as any).T
if (!T) return
const newCenter = new T.LngLat(lng, lat)
// 移除旧标记
map.removeOverLay(marker)
// 创建新标记
marker = new T.Marker(newCenter)
map.addOverLay(marker)
map.centerAndZoom(newCenter, 16)
}
}
// 地址搜索（供外部调用）
const searchAddress = (address: string): Promise<{ lat: number, lng: number }> => {
return new Promise((resolve, reject) => {
if (!mapKey.value) {
reject(new Error(t('地图配置未加载')))
return
}
const waitForMap = () => {
return new Promise<void>((resolveWait, rejectWait) => {
if (map) {
resolveWait()
return
}
let attempts = 0
const checkInterval = setInterval(() => {
attempts++
if (map) {
clearInterval(checkInterval)
resolveWait()
} else if (attempts > MAP_SEARCH_MAX_ATTEMPTS) {
clearInterval(checkInterval)
rejectWait(new Error(t('地图初始化超时')))
}
}, MAP_SEARCH_INTERVAL)
})
}
waitForMap().then(() => {
if (mapType.value === 'tencent') {
const TMap = (window as any).TMap
if (!TMap?.service) {
reject(new Error(t('腾讯地图服务未加载')))
return
}
const geocoder = new TMap.service.Geocoder({ key: mapKey.value })
geocoder.getLocation({ address }).then((result: any) => {
if (result.status === 0 && result.result?.location) {
const location = result.result.location
const lat = Number(location.lat)
const lng = Number(location.lng)
updateLocation(lat, lng)
resolve({ lat, lng })
} else {
reject(new Error(result.message || t('未找到该地址')))
}
}).catch((error) => {
reject(error)
})
} else if (mapType.value === 'tianditu') {
const T = (window as any).T
if (!T) {
reject(new Error(t('天地图服务未加载')))
return
}
const geocoder = new T.Geocoder()
geocoder.getPoint(address, (result: any) => {
if (result && result.status === '0' && result.location) {
const lat = result.location.lat
const lng = result.location.lon || result.location.lng
if (lat && lng) {
updateLocation(lat, lng)
resolve({ lat, lng })
} else {
reject(new Error(t('坐标解析失败')))
}
} else {
reject(new Error(result?.msg || t('未找到该地址')))
}
})
}
}).catch(reject)
})
}
// 添加圆
const addCircle = (center?: { lat: number; lng: number }, radius = 1000, options?: any) => {
if (!map) return null
const key = options?.key || `circle_${Date.now()}`
let circle = null
// 创建geometriesData对象
const geometriesData = { key, center, radius, ...options }
if (mapType.value === 'tencent') {
createCircle(map, geometriesData, (selectedKey) => {
// 触发selectChange事件
emit('selectChange', selectedKey)
})
// 腾讯地图的createCircle不返回值，创建一个包含key的对象添加到overlays
circle = { key, geometriesData }
} else {
circle = tdCreateCircle(map, geometriesData, (data) => {
// 触发areaChange事件，确保path数据干净，不包含循环引用
emit('areaChange', {
key: data.key,
type: 'circle',
path: {
key: data.key,
center: data.center,
radius: data.radius
}
})
}, (selectedKey) => {
// 触发selectChange事件
emit('selectChange', selectedKey)
})
// 为天地图添加geometriesData引用
if (circle) {
circle.geometriesData = geometriesData
}
}
if (circle) overlays.value.push(circle)
return circle
}
// 添加多边形
const addPolygon = (paths: any[], options?: any) => {
if (!map) return null
const key = options?.key || `poly_${Date.now()}`
let poly = null
// 创建geometriesData对象
const geometriesData = { key, paths, ...options }
if (mapType.value === 'tencent') {
createPolygon(map, geometriesData, (selectedKey) => {
// 触发selectChange事件
emit('selectChange', selectedKey)
})
// 腾讯地图的createPolygon不返回值，创建一个包含key的对象添加到overlays
poly = { key, geometriesData }
} else {
poly = tdCreatePolygon(map, geometriesData, (data) => {
// 触发areaChange事件，确保path数据干净，不包含循环引用
emit('areaChange', {
key: data.key,
type: 'polygon',
path: {
key: data.key,
paths: data.paths.map((point: any) => ({
lat: point.lat,
lng: point.lng
}))
}
})
}, (selectedKey) => {
// 触发selectChange事件
emit('selectChange', selectedKey)
})
// 为天地图添加geometriesData引用
if (poly) {
poly.geometriesData = geometriesData
}
}
if (poly) overlays.value.push(poly)
return poly
}
// 删除覆盖物
const removeOverlay = (overlay: any) => {
if (!map || !overlay) return
const key = overlay.key || ''
mapType.value === 'tencent' ? deleteGeometry(key) : tdDeleteGeometry(map, key)
// 通过key查找并删除覆盖物
const idx = overlays.value.findIndex(item => item.key === key)
if (idx > -1) overlays.value.splice(idx, 1)
}
// 清空所有覆盖物
const clearOverlays = () => {
if (!map) return
mapType.value === 'tencent'
? overlays.value.forEach(o => deleteGeometry(o.key))
: clearAllGeometry(map)
overlays.value = []
}
const selectGeo = (key: string) => {
mapType.value === 'tencent' ? selectGeometry(key) : tdSelectGeometry(key)
}
// 监听选中key变化
watch(() => props.selectedKey, (newKey) => {
if (newKey) {
selectGeo(newKey)
}
})
// 监听地图key和类型变化
watch([mapKey, mapType], ([newKey, newType]) => {
if (newKey && newType) {
initMap()
}
})
onMounted(() => {
getMapConfigData()
})
onBeforeUnmount(() => {
if (map) {
try {
if (mapType.value === 'tencent') {
map.destroy && map.destroy()
} else if (mapType.value === 'tianditu') {
clearOverlays()
map.clearOverLays && map.clearOverLays()
}
} catch (e) {
}
map = null
marker = null
overlays.value = []
}
})
defineExpose({
updateLocation,
searchAddress,
addCircle,
addPolygon,
removeOverlay,
clearOverlays,
selectGeometry: selectGeo,
getMap: () => map,
getMarker: () => marker,
handleLocationChange
})
</script>
<style scoped>
</style>

4
admin/src/stores/modules/user.ts
View File

@ -54,8 +54,8 @@ const useUserStore = defineStore('user', {
// 清除tabbar
useTabbarStore().clearTab()
const login = '/login'
// router.push(login)
location.href = `${location.origin}${login}`
router.push(login)
// location.href = `${location.origin}${login}`
},
getAuthMenusFn() {
return new Promise((resolve, reject) => {

3
admin/src/styles/icon/addon-iconfont.css
View File

@ -1,2 +1 @@
@import "addon/o2o/iconfont.css";
@import "addon/tourism/iconfont.css";
/* addon-iconfont.css */

0
admin/src/styles/icon/addon/.gitignore vendored
View File

38
admin/src/styles/icon/addon/o2o/iconfont.css
View File

@ -1,38 +0,0 @@
@font-face {
font-family: "o2o"; /* Project id 4412516 */
src: url('//at.alicdn.com/t/c/font_4412516_cacqsbew46.woff2?t=1705720131974') format('woff2'),
url('//at.alicdn.com/t/c/font_4412516_cacqsbew46.woff?t=1705720131974') format('woff'),
url('//at.alicdn.com/t/c/font_4412516_cacqsbew46.ttf?t=1705720131974') format('truetype');
}
.o2o {
font-family: "o2o" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.o2o-icon-danhanghuadong:before {
content: "\e66f";
}
.o2o-icon-yuanjiao:before {
content: "\e6c0";
}
.o2o-icon-gl-square:before {
content: "\ea92";
}
.o2o-icon-sousuo12:before {
content: "\e699";
}
.o2o-icon-sousuo11:before {
content: "\e6d4";
}
.o2o-icon-jishi:before {
content: "\e600";
}

51
admin/src/styles/icon/addon/o2o/iconfont.json
View File

@ -1,51 +0,0 @@
{
"id": "4412516",
"name": "上门服务",
"font_family": "o2o",
"css_prefix_text": "o2o-icon-",
"description": "",
"glyphs": [
{
"icon_id": "30621139",
"name": "单行滑动",
"font_class": "danhanghuadong",
"unicode": "e66f",
"unicode_decimal": 58991
},
{
"icon_id": "7149037",
"name": "圆角",
"font_class": "yuanjiao",
"unicode": "e6c0",
"unicode_decimal": 59072
},
{
"icon_id": "7594344",
"name": "20gl-square",
"font_class": "gl-square",
"unicode": "ea92",
"unicode_decimal": 60050
},
{
"icon_id": "10133070",
"name": "搜索",
"font_class": "sousuo12",
"unicode": "e699",
"unicode_decimal": 59033
},
{
"icon_id": "14652583",
"name": "搜索",
"font_class": "sousuo11",
"unicode": "e6d4",
"unicode_decimal": 59092
},
{
"icon_id": "6818781",
"name": "技师",
"font_class": "jishi",
"unicode": "e600",
"unicode_decimal": 58880
}
]
}

58
admin/src/styles/icon/addon/tourism/iconfont.css
View File

@ -1,58 +0,0 @@
@font-face {
font-family: "tourism"; /* Project id 4137250 */
src: url('//at.alicdn.com/t/c/font_4137250_st1ha9l0k1e.woff2?t=1687685028672') format('woff2'),
url('//at.alicdn.com/t/c/font_4137250_st1ha9l0k1e.woff?t=1687685028672') format('woff'),
url('//at.alicdn.com/t/c/font_4137250_st1ha9l0k1e.ttf?t=1687685028672') format('truetype');
}
.tourism {
font-family: "tourism" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.tourism-icon-feiji:before {
content: "\e600";
}
.tourism-icon-lvyou:before {
content: "\e6a9";
}
.tourism-icon-lvyouchanpin:before {
content: "\e63b";
}
.tourism-icon-lvyou1:before {
content: "\e623";
}
.tourism-icon-lvyou2:before {
content: "\e601";
}
.tourism-icon-lvyou3:before {
content: "\e60c";
}
.tourism-icon-lvyoubaochedingdan:before {
content: "\e612";
}
.tourism-icon-lvyou4:before {
content: "\e653";
}
.tourism-icon-lvyou5:before {
content: "\e610";
}
.tourism-icon-lvyouguanguang:before {
content: "\e87e";
}
.tourism-icon-lvyou6:before {
content: "\e642";
}

86
admin/src/styles/icon/addon/tourism/iconfont.json
View File

@ -1,86 +0,0 @@
{
"id": "4137250",
"name": "旅游业",
"font_family": "tourism",
"css_prefix_text": "tourism-icon-",
"description": "",
"glyphs": [
{
"icon_id": "1443",
"name": "飞机",
"font_class": "feiji",
"unicode": "e600",
"unicode_decimal": 58880
},
{
"icon_id": "446824",
"name": "旅游",
"font_class": "lvyou",
"unicode": "e6a9",
"unicode_decimal": 59049
},
{
"icon_id": "1167173",
"name": "旅游产品",
"font_class": "lvyouchanpin",
"unicode": "e63b",
"unicode_decimal": 58939
},
{
"icon_id": "1354920",
"name": "旅游",
"font_class": "lvyou1",
"unicode": "e623",
"unicode_decimal": 58915
},
{
"icon_id": "1505555",
"name": "旅游",
"font_class": "lvyou2",
"unicode": "e601",
"unicode_decimal": 58881
},
{
"icon_id": "2121726",
"name": "旅游",
"font_class": "lvyou3",
"unicode": "e60c",
"unicode_decimal": 58892
},
{
"icon_id": "2357494",
"name": "旅游包车订单",
"font_class": "lvyoubaochedingdan",
"unicode": "e612",
"unicode_decimal": 58898
},
{
"icon_id": "3944019",
"name": "旅游",
"font_class": "lvyou4",
"unicode": "e653",
"unicode_decimal": 58963
},
{
"icon_id": "4838220",
"name": "旅游",
"font_class": "lvyou5",
"unicode": "e610",
"unicode_decimal": 58896
},
{
"icon_id": "7444178",
"name": "旅游观光",
"font_class": "lvyouguanguang",
"unicode": "e87e",
"unicode_decimal": 59518
},
{
"icon_id": "9748082",
"name": "旅游",
"font_class": "lvyou6",
"unicode": "e642",
"unicode_decimal": 58946
}
]
}

450
admin/src/utils/common.ts
View File

@ -9,54 +9,54 @@ import storage from './storage'
* @param app
*/
export function useElementIcon(app: App): void {
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
app.component(key, component)
}
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
app.component(key, component)
}
}
/**
* 设置主题色
*/
export function setThemeColor(color: string, mode: string = 'light'): void {
useCssVar('--el-color-primary', null).value = color
useCssVar('--el-color-primary', null).value = color
const colors: any = {
dark: {
'light-3': 'shade(20%)',
'light-5': 'shade(30%)',
'light-7': 'shade(50%)',
'light-8': 'shade(60%)',
'light-9': 'shade(70%)',
'dark-2': 'tint(20%)'
},
light: {
'dark-2': 'shade(20%)',
'light-3': 'tint(30%)',
'light-5': 'tint(50%)',
'light-7': 'tint(70%)',
'light-8': 'tint(80%)',
'light-9': 'tint(90%)'
}
}
const colors: any = {
dark: {
'light-3': 'shade(20%)',
'light-5': 'shade(30%)',
'light-7': 'shade(50%)',
'light-8': 'shade(60%)',
'light-9': 'shade(70%)',
'dark-2': 'tint(20%)'
},
light: {
'dark-2': 'shade(20%)',
'light-3': 'tint(30%)',
'light-5': 'tint(50%)',
'light-7': 'tint(70%)',
'light-8': 'tint(80%)',
'light-9': 'tint(90%)'
}
}
Object.keys(colors[mode]).forEach((key) => {
useCssVar('--el-color-primary' + '-' + key, null).value = colorFunction.convert(`color(${ color } ${ colors[mode][key] })`)
})
Object.keys(colors[mode]).forEach((key) => {
useCssVar('--el-color-primary' + '-' + key, null).value = colorFunction.convert(`color(${ color } ${ colors[mode][key] })`)
})
}
/**
* 获取当前访问应用类型
*/
export function getAppType() {
const path = location.pathname.split('/').filter((val) => {
return val
})
const path = location.pathname.split('/').filter((val) => {
return val
})
if (!path.length) {
return 'admin'
} else {
return path[0]
}
if (!path.length) {
return 'admin'
} else {
return path[0]
}
}
/**
@ -64,8 +64,8 @@ export function getAppType() {
* @param value
*/
export function setWindowTitle(value: string = ''): void {
const title = useTitle()
title.value = value ? value : import.meta.env.VITE_DETAULT_TITLE
const title = useTitle()
title.value = value ? value : import.meta.env.VITE_DETAULT_TITLE
}
/**
@ -73,7 +73,7 @@ export function setWindowTitle(value: string = ''): void {
* @returns
*/
export function getToken(): null | string {
return storage.get('token')
return storage.get('token')
}
/**
@ -82,7 +82,7 @@ export function getToken(): null | string {
* @returns
*/
export function setToken(token: string): void {
storage.set({ key: 'token', data: token })
storage.set({ key: 'token', data: token })
}
/**
@ -90,7 +90,7 @@ export function setToken(token: string): void {
* @returns
*/
export function removeToken(): void {
storage.remove('token')
storage.remove('token')
}
/**
@ -100,16 +100,16 @@ export function removeToken(): void {
* @returns
*/
export function debounce(fn: (args?: any) => any, delay: number = 300) {
let timer: null | number = null
return function (...args) {
if (timer != null) {
clearTimeout(timer)
timer = null
}
timer = setTimeout(() => {
fn.call(this, ...args)
}, delay);
}
let timer: null | number = null
return function (...args) {
if (timer != null) {
clearTimeout(timer)
timer = null
}
timer = setTimeout(() => {
fn.call(this, ...args)
}, delay);
}
}
/**
@ -118,7 +118,7 @@ export function debounce(fn: (args?: any) => any, delay: number = 300) {
* @returns
*/
export function isUrl(str: string): boolean {
return str.indexOf('http://') != -1 || str.indexOf('https://') != -1
return str.indexOf('http://') != -1 || str.indexOf('https://') != -1
}
/**
@ -127,14 +127,14 @@ export function isUrl(str: string): boolean {
* @returns
*/
export function img(path: string): string {
if (!path) return ''
let imgDomain = import.meta.env.VITE_IMG_DOMAIN || location.origin
if (!path) return ''
if (path.startsWith('/')) path = path.replace(/^\//, '')
if (imgDomain.endsWith('/')) imgDomain = imgDomain.slice(0, -1)
return isUrl(path) ? path : `${imgDomain}/${path}`
let imgDomain = import.meta.env.VITE_IMG_DOMAIN || location.origin
if (path.startsWith('/')) path = path.replace(/^\//, '')
if (imgDomain.endsWith('/')) imgDomain = imgDomain.slice(0, -1)
return isUrl(path) ? path : `${imgDomain}/${path}`
}
/**
@ -143,7 +143,7 @@ export function img(path: string): string {
* @returns
*/
export function assetImg(path: string) {
return new URL('@/', import.meta.url) + path
return new URL('@/', import.meta.url) + path
}
/**
@ -152,15 +152,15 @@ export function assetImg(path: string) {
* @returns
*/
export function strByteLength(str: string = ''): number {
let len = 0;
for (let i = 0; i < str.length; i++) {
if (str.charCodeAt(i) > 127 || str.charCodeAt(i) == 94) {
len += 2;
} else {
len++;
}
}
return len;
let len = 0;
for (let i = 0; i < str.length; i++) {
if (str.charCodeAt(i) > 127 || str.charCodeAt(i) == 94) {
len += 2;
} else {
len++;
}
}
return len;
}
/**
@ -168,22 +168,22 @@ export function strByteLength(str: string = ''): number {
* @param url
*/
export function urlToRouteRaw(url: string) {
const query: any = {}
const [path, param] = url.split('?')
const query: any = {}
const [path, param] = url.split('?')
param && param.split('&').forEach((str: string) => {
let [name, value] = str.split('=')
query[name] = value
})
param && param.split('&').forEach((str: string) => {
let [name, value] = str.split('=')
query[name] = value
})
return { path, query }
return { path, query }
}
const isArray = (value: any) => {
if (typeof Array.isArray === 'function') {
return Array.isArray(value)
}
return Object.prototype.toString.call(value) === '[object Array]'
if (typeof Array.isArray === 'function') {
return Array.isArray(value)
}
return Object.prototype.toString.call(value) === '[object Array]'
}
/**
@ -192,19 +192,19 @@ const isArray = (value: any) => {
* @returns {*} 克隆后的对象或者原值（不是对象）
*/
export function deepClone(obj: object) {
// 对常见的“非”值，直接返回原来值
if ([null, undefined, NaN, false].includes(obj)) return obj
if (typeof obj !== 'object' && typeof obj !== 'function') {
// 原始类型直接返回
return obj
}
const o = isArray(obj) ? [] : {}
for (const i in obj) {
if (obj.hasOwnProperty(i)) {
o[i] = typeof obj[i] === 'object' ? deepClone(obj[i]) : obj[i]
}
}
return o
// 对常见的“非”值，直接返回原来值
if ([null, undefined, NaN, false].includes(obj)) return obj
if (typeof obj !== 'object' && typeof obj !== 'function') {
// 原始类型直接返回
return obj
}
const o = isArray(obj) ? [] : {}
for (const i in obj) {
if (obj.hasOwnProperty(i)) {
o[i] = typeof obj[i] === 'object' ? deepClone(obj[i]) : obj[i]
}
}
return o
}
/**
@ -214,91 +214,91 @@ export function deepClone(obj: object) {
* @param {Number} radix
*/
export function guid(len = 10, firstU = true, radix: any = null) {
const chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('')
const uuid = []
radix = radix || chars.length
const chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('')
const uuid = []
radix = radix || chars.length
if (len) {
// 如果指定uuid长度,只是取随机的字符,0|x为位运算,能去掉x的小数位,返回整数位
for (let i = 0; i < len; i++) uuid[i] = chars[0 | Math.random() * radix]
} else {
let r
// rfc4122标准要求返回的uuid中,某些位为固定的字符
uuid[8] = uuid[13] = uuid[18] = uuid[23] = '-'
uuid[14] = '4'
if (len) {
// 如果指定uuid长度,只是取随机的字符,0|x为位运算,能去掉x的小数位,返回整数位
for (let i = 0; i < len; i++) uuid[i] = chars[0 | Math.random() * radix]
} else {
let r
// rfc4122标准要求返回的uuid中,某些位为固定的字符
uuid[8] = uuid[13] = uuid[18] = uuid[23] = '-'
uuid[14] = '4'
for (let i = 0; i < 36; i++) {
if (!uuid[i]) {
r = 0 | Math.random() * 16
uuid[i] = chars[(i == 19) ? (r & 0x3) | 0x8 : r]
}
}
}
// 移除第一个字符,并用u替代,因为第一个字符为数值时,该guuid不能用作id或者class
if (firstU) {
uuid.shift()
return `u${ uuid.join('') }`
}
return uuid.join('')
for (let i = 0; i < 36; i++) {
if (!uuid[i]) {
r = 0 | Math.random() * 16
uuid[i] = chars[(i == 19) ? (r & 0x3) | 0x8 : r]
}
}
}
// 移除第一个字符,并用u替代,因为第一个字符为数值时,该guuid不能用作id或者class
if (firstU) {
uuid.shift()
return `u${ uuid.join('') }`
}
return uuid.join('')
}
/**
* 金额格式化
*/
export function moneyFormat(money: string): string {
return isNaN(parseFloat(money)) ? money : parseFloat(money).toFixed(2)
return isNaN(parseFloat(money)) ? money : parseFloat(money).toFixed(2)
}
/**
* 时间戳转日期格式
*/
export function timeStampTurnTime(timeStamp: any, type = "") {
if (timeStamp != undefined && timeStamp != "" && timeStamp > 0) {
const date = new Date();
date.setTime(timeStamp * 1000);
const y: any = date.getFullYear();
let m: any = date.getMonth() + 1;
m = m < 10 ? ('0' + m) : m;
let d: any = date.getDate();
d = d < 10 ? ('0' + d) : d;
let h: any = date.getHours();
h = h < 10 ? ('0' + h) : h;
let minute: any = date.getMinutes();
let second: any = date.getSeconds();
minute = minute < 10 ? ('0' + minute) : minute;
second = second < 10 ? ('0' + second) : second;
if (type) {
if (type == 'yearMonthDay') {
return y + '年' + m + '月' + d + '日';
}
return y + '-' + m + '-' + d;
} else {
return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second;
}
if (timeStamp != undefined && timeStamp != "" && timeStamp > 0) {
const date = new Date();
date.setTime(timeStamp * 1000);
const y: any = date.getFullYear();
let m: any = date.getMonth() + 1;
m = m < 10 ? ('0' + m) : m;
let d: any = date.getDate();
d = d < 10 ? ('0' + d) : d;
let h: any = date.getHours();
h = h < 10 ? ('0' + h) : h;
let minute: any = date.getMinutes();
let second: any = date.getSeconds();
minute = minute < 10 ? ('0' + minute) : minute;
second = second < 10 ? ('0' + second) : second;
if (type) {
if (type == 'yearMonthDay') {
return y + '年' + m + '月' + d + '日';
}
return y + '-' + m + '-' + d;
} else {
return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second;
}
} else {
return "";
}
} else {
return "";
}
}
/**
* 获取当前日期时间
*/
export function getCurrentDataTime(timeStamp: any) {
const addZero = (t) => {
return t < 10 ? '0' + t : t;
}
const time = new Date(timeStamp);
let Y = time.getFullYear(), // 年
M = time.getMonth() + 1, // 月
D = time.getDate(), // 日
h = time.getHours(), // 时
m = time.getMinutes(), // 分
s = time.getSeconds(); // 秒
if (M > 12) {
M = M - 12;
}
return `${Y}-${addZero(M)}-${addZero(D)} ${addZero(h)}:${addZero(m)}:${addZero(s)}`
const addZero = (t) => {
return t < 10 ? '0' + t : t;
}
const time = new Date(timeStamp);
let Y = time.getFullYear(), // 年
M = time.getMonth() + 1, // 月
D = time.getDate(), // 日
h = time.getHours(), // 时
m = time.getMinutes(), // 分
s = time.getSeconds(); // 秒
if (M > 12) {
M = M - 12;
}
return `${Y}-${addZero(M)}-${addZero(D)} ${addZero(h)}:${addZero(m)}:${addZero(s)}`
}
/**
@ -306,17 +306,17 @@ export function getCurrentDataTime(timeStamp: any) {
* @param {Object} date
*/
export function timeTurnTimeStamp(date: string) {
const f = date.split(' ', 2);
const d = (f[0] ? f[0] : '').split('-', 3);
const t = (f[1] ? f[1] : '').split(':', 3);
return (new Date(
parseInt(d[0], 10) || null,
(parseInt(d[1], 10) || 1) - 1,
parseInt(d[2], 10) || null,
parseInt(t[0], 10) || null,
parseInt(t[1], 10) || null,
parseInt(t[2], 10) || null
)).getTime() / 1000;
const f = date.split(' ', 2);
const d = (f[0] ? f[0] : '').split('-', 3);
const t = (f[1] ? f[1] : '').split(':', 3);
return (new Date(
parseInt(d[0], 10) || null,
(parseInt(d[1], 10) || 1) - 1,
parseInt(d[2], 10) || null,
parseInt(t[0], 10) || null,
parseInt(t[1], 10) || null,
parseInt(t[2], 10) || null
)).getTime() / 1000;
}
/**
@ -324,15 +324,15 @@ export function timeTurnTimeStamp(date: string) {
* @param event
*/
export function filterDigit(event: any) {
event.target.value = event.target.value.replace(/[^\d\.]/g, '');
event.target.value = event.target.value.replace(/^\./g, '');
event.target.value = event.target.value.replace(/\.{2,}/g, '.');
// 限制最多两位小数
const decimalParts = event.target.value.split('.');
if (decimalParts.length > 1 && decimalParts[1].length > 2) {
// 如果有小数部分且超过两位，则截取前两位
event.target.value = `${ decimalParts[0] }.${ decimalParts[1].slice(0, 2) }`;
}
event.target.value = event.target.value.replace(/[^\d\.]/g, '');
event.target.value = event.target.value.replace(/^\./g, '');
event.target.value = event.target.value.replace(/\.{2,}/g, '.');
// 限制最多两位小数
const decimalParts = event.target.value.split('.');
if (decimalParts.length > 1 && decimalParts[1].length > 2) {
// 如果有小数部分且超过两位，则截取前两位
event.target.value = `${ decimalParts[0] }.${ decimalParts[1].slice(0, 2) }`;
}
}
/**
@ -340,7 +340,7 @@ export function filterDigit(event: any) {
* @param event
*/
export function filterNumber(event: any) {
event.target.value = event.target.value.replace(/[^\d]/g, '');
event.target.value = event.target.value.replace(/[^\d]/g, '');
}
/**
@ -348,8 +348,8 @@ export function filterNumber(event: any) {
* @param event
*/
export function filterSpecial(event: any) {
event.target.value = event.target.value.replace(/[^\u4e00-\u9fa5a-zA-Z0-9]/g, '')
event.target.value = event.target.value.replace(/[`~!@#$%^&*()_\-+=<>?:"{}|,.\/;'\\[\]·~！@#￥%……&*（）——\-+={}|《》？：“”【】、；‘’，。、]/g, '')
event.target.value = event.target.value.replace(/[^\u4e00-\u9fa5a-zA-Z0-9]/g, '')
event.target.value = event.target.value.replace(/[`~!@#$%^&*()_\-+=<>?:"{}|,.\/;'\\[\]·~！@#￥%……&*（）——\-+={}|《》？：“”【】、；‘’，。、]/g, '')
}
/**
@ -357,7 +357,7 @@ export function filterSpecial(event: any) {
* @param event
*/
export function filterBlank(event: any) {
event.target.value = event.target.value.replace(/\s/g, '');
event.target.value = event.target.value.replace(/\s/g, '');
}
/**
* 设置表格分页数据的本地存储
@ -366,23 +366,23 @@ export function filterBlank(event: any) {
* @param where
*/
export function setTablePageStorage(page: any = 1, limit: any = 10, where: any = {}) {
let data = storage.get('tablePageStorage');
if (!data) {
data = {};
}
let data = storage.get('tablePageStorage');
if (!data) {
data = {};
}
const key = location.pathname + JSON.stringify(where);
data[key] = {
page,
limit
};
const key = location.pathname + JSON.stringify(where);
data[key] = {
page,
limit
};
const MAX_COUNT = 5; // 最多存储 5 个页面的分页缓存，超出则删除最开始的第一个页面
if (Object.keys(data).length > MAX_COUNT) {
delete data[Object.keys(data)[0]];
}
const MAX_COUNT = 5; // 最多存储 5 个页面的分页缓存，超出则删除最开始的第一个页面
if (Object.keys(data).length > MAX_COUNT) {
delete data[Object.keys(data)[0]];
}
storage.set({ key: 'tablePageStorage', data });
storage.set({ key: 'tablePageStorage', data });
}
/**
@ -390,49 +390,49 @@ export function setTablePageStorage(page: any = 1, limit: any = 10, where: any =
* @param where
*/
export function getTablePageStorage(where: any = {}) {
let data = storage.get('tablePageStorage');
const key = location.pathname + JSON.stringify(where);
if (!data || !data[key]) {
data = {
page: 1,
limit: 10
};
} else {
data = data[key];
}
return data;
let data = storage.get('tablePageStorage');
const key = location.pathname + JSON.stringify(where);
if (!data || !data[key]) {
data = {
page: 1,
limit: 10
};
} else {
data = data[key];
}
return data;
}
// 距离显示
export function distance(distance: string | number): string {
const dist = typeof distance === 'string' ? parseFloat(distance) : distance;
if (isNaN(dist)) return distance.toString();
return dist < 1 ? parseInt((dist * 1000).toString()) + 'm' : dist.toFixed(1) + 'km'
const dist = typeof distance === 'string' ? parseFloat(distance) : distance;
if (isNaN(dist)) return distance.toString();
return dist < 1 ? parseInt((dist * 1000).toString()) + 'm' : dist.toFixed(1) + 'km'
}
// 获取图片尺寸的函数
export function getImageDimensions (url: string) {
return new Promise((resolve) => {
const imgObj = new Image()
imgObj.onload = () => {
// 成功加载
const size = {
width: imgObj.naturalWidth,
height: imgObj.naturalHeight
}
resolve(size)
}
return new Promise((resolve) => {
const imgObj = new Image()
imgObj.onload = () => {
// 成功加载
const size = {
width: imgObj.naturalWidth,
height: imgObj.naturalHeight
}
resolve(size)
}
imgObj.onerror = (err) => {
// 加载失败
resolve(null)
}
imgObj.onerror = (err) => {
// 加载失败
resolve(null)
}
// 设置图片源，开始加载
// 注意：如果图片跨域且服务器未设置CORS，可能会触发onerror
imgObj.src = img(url)
})
}
// 设置图片源，开始加载
// 注意：如果图片跨域且服务器未设置CORS，可能会触发onerror
imgObj.src = img(url)
})
}

269
admin/src/utils/qqmap.ts
View File

@ -4,8 +4,11 @@ const geometry: any = {}
/**
* 在地图上创建一个圆形
* @param map 地图实例
* @param geometriesData 圆形数据
* @param onSelect 图形被选中时的回调函数
*/
export const createCircle = (map: any, geometriesData: any) => {
export const createCircle = (map: any, geometriesData: any, onSelect?: (key: string) => void) => {
const TMap = (window as any).TMap
const LatLng = TMap.LatLng
@ -27,7 +30,11 @@ export const createCircle = (map: any, geometriesData: any) => {
showBorder: true,
borderColor: `rgb(${color.toString()})`,
borderWidth: 2
})
}),
highlight: new TMap.PolygonStyle({
color: 'rgba(255, 255, 0, 0.6)'
})
},
geometries: [
{
@ -38,25 +45,84 @@ export const createCircle = (map: any, geometriesData: any) => {
}
]
})
geometry[geometriesData.key] = { graphical: multiCircle }
// 如果已存在该图形，先删除
if (geometry[geometriesData.key]) {
try {
geometry[geometriesData.key].graphical.remove(geometriesData.key)
geometry[geometriesData.key].editor?.delete()
} catch (e) {
// 删除旧图形失败
// console.warn('删除旧图形失败:', e)
}
}
// 创建图形编辑器
const editor = new TMap.tools.GeometryEditor({
map: map,
overlayList: [
{
overlay: multiCircle,
id: geometriesData.key,
}
],
actionMode: TMap.tools.constants.EDITOR_ACTION.INTERACT,
activeOverlayId: geometriesData.key, // 激活图层
selectable: true // 开启点选功能
})
let editor = null
// 检查 TMap.tools 是否存在
if (TMap.tools) {
// 创建图形编辑器 - 支持拖动中心点和调整半径
try {
editor = new TMap.tools.GeometryEditor({
map: map,
overlayList: [
{
overlay: multiCircle,
id: geometriesData.key,
selectedStyleId: 'highlight'
}
],
actionMode: TMap.tools.constants?.EDITOR_ACTION?.INTERACT || 0, // 交互模式，支持拖动中心点和调整半径
activeOverlayId: null, // 初始不激活，等待用户选择
selectable: true ,// 开启点选功能
snappable: true // 开启吸附
})
editor.setKeyboardDeleteEnable(false);
editor.on('adjust_complete', (data: any) => {
geometriesData.center = { lat: data.center.lat, lng: data.center.lng }
geometriesData.radius = parseInt(data.radius)
// 监听调整开始事件 - 禁用地图拖拽
editor.on('adjust_start', () => {
currentMap?.setDraggable(false)
})
// 监听调整完成事件
editor.on('adjust_complete', (data: any) => {
if (data?.center && data.radius !== undefined) {
geometriesData.center = { lat: data.center.lat, lng: data.center.lng }
geometriesData.radius = parseInt(data.radius)
}
setTimeout(() => currentMap?.setDraggable(true), 100)
})
// 监听调整中事件（实时更新）
editor.on('adjust', (data: any) => {
if (data?.center && data.radius !== undefined) {
geometriesData.center = { lat: data.center.lat, lng: data.center.lng }
geometriesData.radius = parseInt(data.radius)
}
})
// 监听选中事件
editor.on('select', () => {
// 只有在用户点击地图上的图形时才触发，而不是在切换页面时
if (onSelect) {
onSelect(geometriesData.key)
}
})
} catch (e) {
console.warn('创建编辑器失败:', e)
}
}
// 为圆形添加点击事件监听器
multiCircle.on('click', () => {
// 先选中当前图形，使其高亮显示
if (editor) {
editor.select([geometriesData.key])
editor.setActiveOverlay?.(geometriesData.key)
}
// 然后触发选中回调
if (onSelect) {
onSelect(geometriesData.key)
}
})
geometry[geometriesData.key] = { graphical: multiCircle, editor }
@ -64,10 +130,11 @@ export const createCircle = (map: any, geometriesData: any) => {
/**
* 在地图上创建一个多边形
* @param map
* @param geometriesData
* @param map 地图实例
* @param geometriesData 多边形数据
* @param onSelect 图形被选中时的回调函数
*/
export const createPolygon = (map: any, geometriesData: any) => {
export const createPolygon = (map: any, geometriesData: any, onSelect?: (key: string) => void) => {
const TMap = (window as any).TMap
const LatLng = TMap.LatLng
@ -86,6 +153,17 @@ export const createPolygon = (map: any, geometriesData: any) => {
Math.floor(Math.random() * 255)
]
// 如果已存在该图形，先删除
if (geometry[geometriesData.key]) {
try {
geometry[geometriesData.key].graphical.remove(geometriesData.key)
geometry[geometriesData.key].editor?.delete()
} catch (e) {
// 删除旧多边形失败
// console.warn('删除旧多边形失败:', e)
}
}
const multiPolygon = new TMap.MultiPolygon({
map: map,
styles: {
@ -94,7 +172,10 @@ export const createPolygon = (map: any, geometriesData: any) => {
showBorder: true,
borderColor: `rgb(${color.toString()})`,
borderWidth: 2
})
}),
highlight: new TMap.PolygonStyle({
color: 'rgba(255, 255, 0, 0.6)'
})
},
geometries: [
{
@ -107,23 +188,70 @@ export const createPolygon = (map: any, geometriesData: any) => {
]
});
const editor = new TMap.tools.GeometryEditor({
map: map,
overlayList: [
{
overlay: multiPolygon,
id: geometriesData.key,
}
],
actionMode: TMap.tools.constants.EDITOR_ACTION.INTERACT,
activeOverlayId: geometriesData.key, // 激活图层
selectable: true, // 开启点选功能
})
let editor = null
// 检查 TMap.tools 是否存在
if (TMap.tools) {
// 创建图形编辑器 - 支持拖动边框和调整形状
try {
editor = new TMap.tools.GeometryEditor({
map: map,
overlayList: [
{
overlay: multiPolygon,
id: geometriesData.key,
selectedStyleId: 'highlight'
}
],
actionMode: TMap.tools.constants?.EDITOR_ACTION?.INTERACT || 0, // 交互模式，支持拖动边框和调整形状
activeOverlayId: null, // 初始不激活，等待用户选择
selectable: true, // 开启点选功能
snappable: true // 开启吸附
})
editor.on('adjust_complete', (data: any) => {
geometriesData.paths = data.paths.map(item => {
return { lat: item.lat, lng: item.lng}
})
editor.setKeyboardDeleteEnable(false);
// 监听调整开始事件 - 禁用地图拖拽
editor.on('adjust_start', () => {
currentMap?.setDraggable(false)
})
// 监听调整完成事件
editor.on('adjust_complete', (data: any) => {
if (data?.paths) {
geometriesData.paths = data.paths.map((item: any) => ({ lat: item.lat, lng: item.lng }))
}
setTimeout(() => currentMap?.setDraggable(true), 100)
})
// 监听调整中事件（实时更新）
editor.on('adjust', (data: any) => {
if (data?.paths) {
geometriesData.paths = data.paths.map((item: any) => ({ lat: item.lat, lng: item.lng }))
}
})
// 监听选中事件
editor.on('select', () => {
// 只有在用户点击地图上的图形时才触发，而不是在切换页面时
if (onSelect) {
onSelect(geometriesData.key)
}
})
} catch (e) {
console.warn('创建编辑器失败:', e)
}
}
// 为多边形添加点击事件监听器
multiPolygon.on('click', () => {
// 先选中当前图形，使其高亮显示
if (editor) {
editor.select([geometriesData.key])
editor.setActiveOverlay?.(geometriesData.key)
}
// 然后触发选中回调
if (onSelect) {
onSelect(geometriesData.key)
}
})
geometry[geometriesData.key] = { graphical: multiPolygon, editor }
@ -131,25 +259,68 @@ export const createPolygon = (map: any, geometriesData: any) => {
/**
* 删除图形
* @param key
*/
export const deleteGeometry = (key: string) => {
if (!geometry[key]) {
return
if (!geometry[key]) return
try {
geometry[key].graphical?.remove(key)
geometry[key].editor?.delete()
delete geometry[key]
} catch (e) {
console.warn('删除图形失败:', e)
}
geometry[key].graphical.remove(key)
geometry[key].editor.delete()
}
/**
* 清空所有图形
*/
export const clearAllGeometry = () => {
Object.keys(geometry).forEach(deleteGeometry)
}
// 保存地图引用，用于控制地图拖拽
let currentMap: any = null
/**
* 设置地图引用
* @param map 地图实例
*/
export const setMapInstance = (map: any) => {
currentMap = map
}
/**
* 选中图形
* @param key
*/
export const selectGeometry = (key: string) => {
if (!geometry[key] || !geometry[key].editor) {
return
if (!geometry[key]?.editor) return
try {
// 取消其他图形的选中状态
Object.keys(geometry).forEach(k => {
if (k !== key && geometry[k]?.editor) {
geometry[k].editor.deselect?.()
geometry[k].editor.setActiveOverlay?.(null)
}
})
// 选中当前图形
geometry[key].editor.select?.([key])
geometry[key].editor.setActiveOverlay?.(key)
} catch (e) {
// 删除图形失败
// console.error('选中图形失败:', e)
}
geometry[key].editor.select([key])
}
/**
* 取消选中所有图形
*/
export const deselectAllGeometry = () => {
Object.keys(geometry).forEach(k => {
geometry[k]?.editor?.deselect?.()
geometry[k]?.editor?.setActiveOverlay?.(null)
})
currentMap?.setDraggable(true)
}
/**
@ -185,4 +356,4 @@ export const latLngToAddress = (params: any) => {
*/
export const addressToLatLng = (params: any) => {
return jsonp(`https://apis.map.qq.com/ws/geocoder/v1/?key=${params.mapKey}&address=${params.address}&output=jsonp&callback=addressToLatLng`, { callbackName: 'addressToLatLng' })
}
}

511
admin/src/utils/tianditu.ts Normal file
View File

@ -0,0 +1,511 @@
const geometry: any = {}
// 保存地图引用，用于控制地图拖拽
let currentMap: any = null
/**
* 设置地图引用
* @param map 地图实例
*/
export const setMapInstance = (map: any) => {
currentMap = map
}
/**
* 在天地图上创建一个圆形
* @param map 天地图实例
* @param geometriesData 圆形数据
* @param onChange 图形变化时的回调函数
* @param onSelect 图形被选中时的回调函数
*/
export const createCircle = (map: any, geometriesData: any, onChange?: (data: any) => void, onSelect?: (key: string) => void) => {
const T = (window as any).T
if (!T) return null
geometriesData.radius = geometriesData.radius ?? 1000
geometriesData.center = geometriesData.center ?? { lat: map.getCenter().lat, lng: map.getCenter().lng }
const color = [
Math.floor(Math.random() * 255),
Math.floor(Math.random() * 255),
Math.floor(Math.random() * 255)
]
// 保存原始样式
const originalStyle = {
color: geometriesData.color || `rgba(${color.toString()}, .4)`,
weight: geometriesData.weight || 3,
opacity: geometriesData.opacity || 0.8,
fillColor: geometriesData.fillColor || `rgba(${color.toString()}, .4)`,
fillOpacity: geometriesData.fillOpacity || 0.3
}
const circle = new T.Circle(new T.LngLat(geometriesData.center.lng, geometriesData.center.lat), geometriesData.radius, originalStyle)
// 如果已存在该图形，先删除
if (geometry[geometriesData.key]) {
try {
if (geometry[geometriesData.key].editTimer) {
clearTimeout(geometry[geometriesData.key].editTimer)
}
map.removeOverLay(geometry[geometriesData.key].graphical)
} catch (e) {
// 删除旧图形失败
}
}
map.addOverLay(circle)
// 保存几何数据的引用，确保在事件监听器中可用
const circleData = { ...geometriesData }
// 保存上一次的中心点和半径
let preCenter = { ...circleData.center }
let preRadius = circleData.radius
// 监听地图触摸结束事件，检测圆形变化
const handleTouchEnd = () => {
if (!circle.isEditable()) return
if (geometry[circleData.key]?.editTimer) {
clearTimeout(geometry[circleData.key].editTimer)
}
geometry[circleData.key].editTimer = setTimeout(() => {
const curCenter = circle.getCenter()
const curRadius = circle.getRadius()
// 中心点改变了
if (curCenter.lng !== preCenter.lng || curCenter.lat !== preCenter.lat) {
circleData.center = { lat: curCenter.lat, lng: curCenter.lng }
preCenter = { ...circleData.center }
// console.log('圆形中心点改变了', circleData.center)
// 调用回调函数
if (onChange) {
onChange(circleData)
}
}
// 半径改变了
if (curRadius !== preRadius) {
circleData.radius = curRadius
preRadius = curRadius
// console.log('圆形半径改变了', curRadius)
// 调用回调函数
if (onChange) {
onChange(circleData)
}
}
}, 200)
}
// 监听圆形点击事件
const handleClick = () => {
// 调用选择回调函数
if (onSelect) {
onSelect(circleData.key)
}
}
// 初始时不启用编辑功能，只有在选中时才启用
// circle.enableEdit()
// 添加事件监听
map.addEventListener('touchend', handleTouchEnd)
map.addEventListener('mouseup', handleTouchEnd)
circle.addEventListener('click', handleClick)
geometry[circleData.key] = { graphical: circle, handleTouchEnd, handleClick, originalStyle }
return circle
}
/**
* 在天地图上创建一个矩形
* @param map 天地图实例
* @param geometriesData 矩形数据
*/
export const createRectangle = (map: any, geometriesData: any) => {
const T = (window as any).T
if (!T) return null
const { lat, lng } = map.getCenter()
geometriesData.bounds = geometriesData.bounds ?? {
southwest: { lat: lat - 0.005, lng: lng - 0.005 },
northeast: { lat: lat + 0.005, lng: lng + 0.005 }
}
const lngLats = [
new T.LngLat(geometriesData.bounds.southwest.lng, geometriesData.bounds.southwest.lat),
new T.LngLat(geometriesData.bounds.northeast.lng, geometriesData.bounds.southwest.lat),
new T.LngLat(geometriesData.bounds.northeast.lng, geometriesData.bounds.northeast.lat),
new T.LngLat(geometriesData.bounds.southwest.lng, geometriesData.bounds.northeast.lat)
]
const color = [
Math.floor(Math.random() * 255),
Math.floor(Math.random() * 255),
Math.floor(Math.random() * 255)
]
const rectangle = new T.Polygon(lngLats, {
color: geometriesData.color || `rgba(${color.toString()}, .4)`,
weight: geometriesData.weight || 3,
opacity: geometriesData.opacity || 0.8,
fillColor: geometriesData.fillColor || `rgba(${color.toString()}, .4)`,
fillOpacity: geometriesData.fillOpacity || 0.3
})
map.addOverLay(rectangle)
geometry[geometriesData.key] = { graphical: rectangle }
return rectangle
}
/**
* 在天地图上创建一个多边形
* @param map 天地图实例
* @param geometriesData 多边形数据
* @param onChange 图形变化时的回调函数
* @param onSelect 图形被选中时的回调函数
*/
export const createPolygon = (map: any, geometriesData: any, onChange?: (data: any) => void, onSelect?: (key: string) => void) => {
const T = (window as any).T
if (!T) return null
const { lat, lng } = map.getCenter()
geometriesData.paths = geometriesData.paths ?? [
{ lat: lat + 0.01, lng: lng + 0.01 },
{ lat: lat - 0.01, lng: lng + 0.01 },
{ lat: lat - 0.01, lng: lng - 0.01 },
{ lat: lat + 0.01, lng: lng - 0.01 }
]
const lngLats = geometriesData.paths.map((item: any) => new T.LngLat(item.lng, item.lat))
const color = [
Math.floor(Math.random() * 255),
Math.floor(Math.random() * 255),
Math.floor(Math.random() * 255)
]
// 保存原始样式
const originalStyle = {
color: geometriesData.color || `rgba(${color.toString()}, .4)`,
weight: geometriesData.weight || 3,
opacity: geometriesData.opacity || 0.8,
fillColor: geometriesData.fillColor || `rgba(${color.toString()}, .4)`,
fillOpacity: geometriesData.fillOpacity || 0.3
}
const polygon = new T.Polygon(lngLats, originalStyle)
// 如果已存在该图形，先删除
if (geometry[geometriesData.key]) {
try {
if (geometry[geometriesData.key].editTimer) {
clearTimeout(geometry[geometriesData.key].editTimer)
}
map.removeOverLay(geometry[geometriesData.key].graphical)
} catch (e) {
// 删除旧图形失败
}
}
map.addOverLay(polygon)
// 保存上一次的路径
let prePaths = JSON.parse(JSON.stringify(geometriesData.paths))
// 保存几何数据的引用，确保在事件监听器中可用
const polygonData = { ...geometriesData }
// 监听地图触摸结束事件，检测多边形变化
const handleTouchEnd = () => {
if (!polygon.isEditable()) return
if (geometry[polygonData.key]?.editTimer) {
clearTimeout(geometry[polygonData.key].editTimer)
}
geometry[polygonData.key].editTimer = setTimeout(() => {
try {
const curLngLats = polygon.getLngLats()
// 确保 curLngLats 是数组
if (Array.isArray(curLngLats)) {
// 检查 curLngLats[0] 是否是数组（多边形可能返回嵌套数组）
let pathsArray = curLngLats
if (Array.isArray(curLngLats[0])) {
pathsArray = curLngLats[0]
}
const curPaths = pathsArray.map((lngLat: any) => {
// 检查 lngLat 是否是数组 [lng, lat]
if (Array.isArray(lngLat)) {
return {
lat: lngLat[1],
lng: lngLat[0]
}
} else {
// 否则，假设是对象 { lat, lng }
return {
lat: lngLat.lat,
lng: lngLat.lng
}
}
})
// 检查路径是否改变
const pathsChanged = JSON.stringify(curPaths) !== JSON.stringify(prePaths)
if (pathsChanged) {
polygonData.paths = curPaths
prePaths = JSON.parse(JSON.stringify(polygonData.paths))
// 调用回调函数
if (onChange) {
onChange(polygonData)
}
}
} else {
console.error('curLngLats 不是数组:', curLngLats)
}
} catch (error) {
console.error('获取多边形路径失败:', error)
}
}, 200)
}
// 监听多边形点击事件
const handleClick = () => {
// 调用选择回调函数
if (onSelect) {
onSelect(polygonData.key)
}
}
// 初始时不启用编辑功能，只有在选中时才启用
// polygon.enableEdit()
// 添加事件监听
map.addEventListener('touchend', handleTouchEnd)
map.addEventListener('mouseup', handleTouchEnd)
polygon.addEventListener('click', handleClick)
geometry[polygonData.key] = { graphical: polygon, handleTouchEnd, handleClick, originalStyle }
return polygon
}
/**
* 删除图形
* @param map 地图实例
* @param key 图形key
*/
export const deleteGeometry = (map: any, key: string) => {
if (!geometry[key]) return
try {
const T = (window as any).T
if (T && geometry[key].graphical) {
// 清除定时器
if (geometry[key].editTimer) {
clearTimeout(geometry[key].editTimer)
}
// 移除事件监听器
if (geometry[key].handleTouchEnd) {
map.removeEventListener('touchend', geometry[key].handleTouchEnd)
map.removeEventListener('mouseup', geometry[key].handleTouchEnd)
}
// 移除点击事件监听器
if (geometry[key].handleClick) {
geometry[key].graphical.removeEventListener('click', geometry[key].handleClick)
}
// 移除覆盖物
map.removeOverLay(geometry[key].graphical)
}
delete geometry[key]
} catch (e) {
console.warn('删除图形失败:', e)
}
}
/**
* 清空所有图形
* @param map 地图实例
*/
export const clearAllGeometry = (map: any) => {
const T = (window as any).T
if (T) {
// 先清除所有图形的事件监听器和定时器
Object.keys(geometry).forEach(key => {
if (geometry[key].editTimer) {
clearTimeout(geometry[key].editTimer)
}
if (geometry[key].handleTouchEnd) {
map.removeEventListener('touchend', geometry[key].handleTouchEnd)
map.removeEventListener('mouseup', geometry[key].handleTouchEnd)
}
if (geometry[key].handleClick) {
geometry[key].graphical.removeEventListener('click', geometry[key].handleClick)
}
})
// 一次性清空地图上的所有覆盖物
map.clearOverLays()
}
// 清空几何对象存储
Object.keys(geometry).forEach(key => delete geometry[key])
}
/**
* 选中图形
* @param key 图形key
*/
export const selectGeometry = (key: string) => {
if (!geometry[key]?.graphical) return
try {
// 先取消所有图形的选中状态
deselectAllGeometry()
// 设置选中状态
geometry[key].graphical.setSelected?.(true)
// 启用当前图形的编辑功能
geometry[key].graphical.enableEdit()
const color = [
Math.floor(Math.random() * 255),
Math.floor(Math.random() * 255),
Math.floor(Math.random() * 255)
]
// 修改样式，使其显示为选中状态
geometry[key].graphical.setStyle({
color: '#1890ff', // 选中时的边框颜色
weight: 2, // 选中时的边框宽度
opacity: 1, // 选中时的边框透明度
fillColor: `rgba(${color.toString()}, .6)`, // 选中时的填充颜色
fillOpacity: 1// 选中时的填充透明度
})
} catch (e) {
console.error('选中图形失败:', e)
}
}
/**
* 取消选中所有图形
*/
export const deselectAllGeometry = () => {
Object.keys(geometry).forEach(key => {
try {
// 取消选中状态
geometry[key]?.graphical?.setSelected?.(false)
// 禁用编辑功能
geometry[key]?.graphical?.disableEdit?.()
// 恢复原始样式
if (geometry[key]?.originalStyle) {
geometry[key].graphical.setStyle(geometry[key].originalStyle)
}
} catch (e) {
console.warn('取消选中图形失败:', e)
}
})
}
/**
* 创建点标记
* @param map 天地图实例
* @returns 标记实例
*/
export const createMarker = (map: any) => {
const T = (window as any).T
if (!T) return null
const { lat, lng } = map.getCenter()
const marker = new T.Marker(new T.LngLat(lng, lat))
map.addOverLay(marker)
return marker
}
/**
* 逆地址解析
* @param params 参数 { mapKey, lat, lng }
* @returns Promise
*/
export const latLngToAddress = (params: any) => {
return new Promise((resolve, reject) => {
const T = (window as any).T
if (!T) {
reject(new Error('天地图服务未加载'))
return
}
const geocoder = new T.Geocoder()
const lngLat = new T.LngLat(params.lng, params.lat)
geocoder.getLocation(lngLat, (result: any) => {
if (result && result.status === '0') {
const addrComp = result.addressComponent || {}
let detailAddress = ''
if (result.formattedAddress) {
detailAddress = result.formattedAddress
} else if (result.address) {
detailAddress = result.address
} else {
const parts = []
if (addrComp.road) parts.push(addrComp.road)
if (addrComp.address) parts.push(addrComp.address)
if (addrComp.poi) parts.push(addrComp.poi)
detailAddress = parts.join('')
}
const addressData = {
location: { lat: params.lat, lng: params.lng },
address: addrComp ?
`${ addrComp.province || '' }${ addrComp.city || '' }${ addrComp.county || '' }` : '',
formatted_addresses: {
recommend: detailAddress
},
address_component: {
province: addrComp.province || '',
city: addrComp.city || '',
district: addrComp.county || '',
street: addrComp.road || '',
street_number: addrComp.address || ''
},
addressComponent: addrComp,
formatted_address: detailAddress
}
resolve(addressData)
} else {
reject(new Error(result?.msg || '地址解析失败'))
}
})
})
}
/**
* 地址解析
* @param params 参数 { mapKey, address }
* @returns Promise
*/
export const addressToLatLng = (params: any) => {
return new Promise((resolve, reject) => {
const T = (window as any).T
if (!T) {
reject(new Error('天地图服务未加载'))
return
}
const geocoder = new T.Geocoder()
geocoder.getPoint(params.address, (result: any) => {
if (result && result.status === '0' && result.location) {
const lat = result.location.lat
const lng = result.location.lon || result.location.lng
if (lat && lng) {
resolve({ lat, lng })
} else {
reject(new Error('坐标解析失败'))
}
} else {
reject(new Error(result?.msg || '未找到该地址'))
}
})
})
}