generated from Leo_Ding/web-template
1
This commit is contained in:
parent
8314aa5cc3
commit
c3ab39b3c7
160
index.html
160
index.html
@ -1,87 +1,89 @@
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="zh-cn">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link
|
||||
rel="icon"
|
||||
href="/logo-hahayun.png" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0" />
|
||||
|
||||
<title></title>
|
||||
</head>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon"
|
||||
href="/logo-hahayun.png" />
|
||||
<meta name="viewport"
|
||||
content="width=device-width, initial-scale=1.0" />
|
||||
<title></title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app">
|
||||
<div class="app-loading">
|
||||
<div class="app-loading__loader"></div>
|
||||
<div class="app-loading__title">正在加载资源</div>
|
||||
<div class="app-loading__desc">初次加载需要较长时间 请耐心等待</div>
|
||||
</div>
|
||||
<style>
|
||||
.app-loading {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
<body>
|
||||
<div id="app">
|
||||
<div class="app-loading">
|
||||
<div class="app-loading__loader"></div>
|
||||
<div class="app-loading__title">正在加载资源</div>
|
||||
<div class="app-loading__desc">初次加载需要较长时间 请耐心等待</div>
|
||||
</div>
|
||||
<style>
|
||||
.app-loading {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
background: #ffffff;
|
||||
}
|
||||
.app-loading__loader {
|
||||
box-sizing: border-box;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border: 3px solid transparent;
|
||||
border-top-color: rgba(0, 0, 0, 0.65);
|
||||
border-radius: 50%;
|
||||
animation: 1.2s loader linear infinite;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.app-loading__loader {
|
||||
box-sizing: border-box;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border: 3px solid transparent;
|
||||
border-top-color: rgba(0, 0, 0, .65);
|
||||
border-radius: 50%;
|
||||
animation: 1.2s loader linear infinite;
|
||||
position: relative;
|
||||
}
|
||||
.app-loading__loader:before {
|
||||
box-sizing: border-box;
|
||||
content: '';
|
||||
display: block;
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
position: absolute;
|
||||
top: -3px;
|
||||
left: -3px;
|
||||
border: 3px solid rgba(0, 0, 0, 0.25);
|
||||
border-radius: 50%;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.app-loading__loader:before {
|
||||
box-sizing: border-box;
|
||||
content: '';
|
||||
display: block;
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
position: absolute;
|
||||
top: -3px;
|
||||
left: -3px;
|
||||
border: 3px solid rgba(0, 0, 0, .25);
|
||||
border-radius: 50%;
|
||||
opacity: .5;
|
||||
}
|
||||
.app-loading__title {
|
||||
font-size: 18px;
|
||||
color: rgba(0, 0, 0, 0.85);
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.app-loading__title {
|
||||
font-size: 18px;
|
||||
color: rgba(0, 0, 0, .85);
|
||||
margin-top: 30px;
|
||||
}
|
||||
.app-loading__desc {
|
||||
font-size: 14px;
|
||||
color: rgba(0, 0, 0, 0.65);
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.app-loading__desc {
|
||||
font-size: 14px;
|
||||
color: rgba(0, 0, 0, .65);
|
||||
margin-top: 8px;
|
||||
}
|
||||
@keyframes loader {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
@keyframes loader {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
<script src="/libs/tinymce/tinymce.min.js"></script>
|
||||
<script type="module"
|
||||
src="/src/main.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
<script src="/libs/tinymce/tinymce.min.js"></script>
|
||||
<script
|
||||
type="module"
|
||||
src="/src/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
107
package-lock.json
generated
107
package-lock.json
generated
@ -12,7 +12,6 @@
|
||||
"@ant-design/colors": "^7.0.0",
|
||||
"@ant-design/icons-vue": "^6.1.0",
|
||||
"@icon-park/vue-next": "^1.4.2",
|
||||
"@jiaminghi/data-view": "^2.10.0",
|
||||
"@tinymce/tinymce-vue": "^5.1.0",
|
||||
"ant-design-vue": "^4.0.1",
|
||||
"axios": "^1.4.0",
|
||||
@ -905,62 +904,6 @@
|
||||
"url": "https://github.com/sponsors/kazupon"
|
||||
}
|
||||
},
|
||||
"node_modules/@jiaminghi/bezier-curve": {
|
||||
"version": "0.0.9",
|
||||
"resolved": "https://registry.npmmirror.com/@jiaminghi/bezier-curve/-/bezier-curve-0.0.9.tgz",
|
||||
"integrity": "sha512-u9xJPOEl6Dri2E9FfmJoGxYQY7vYJkURNX04Vj64tdi535tPrpkuf9Sm0lNr3QTKdHQh0DdNRsaa62FLQNQEEw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.5.5"
|
||||
}
|
||||
},
|
||||
"node_modules/@jiaminghi/c-render": {
|
||||
"version": "0.4.3",
|
||||
"resolved": "https://registry.npmmirror.com/@jiaminghi/c-render/-/c-render-0.4.3.tgz",
|
||||
"integrity": "sha512-FJfzj5hGj7MLqqqI2D7vEzHKbQ1Ynnn7PJKgzsjXaZpJzTqs2Yw5OSeZnm6l7Qj7jyPAP53lFvEQNH4o4j6s+Q==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.5.5",
|
||||
"@jiaminghi/bezier-curve": "*",
|
||||
"@jiaminghi/color": "*",
|
||||
"@jiaminghi/transition": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@jiaminghi/charts": {
|
||||
"version": "0.2.18",
|
||||
"resolved": "https://registry.npmmirror.com/@jiaminghi/charts/-/charts-0.2.18.tgz",
|
||||
"integrity": "sha512-K+HXaOOeWG9OOY1VG6M4mBreeeIAPhb9X+khG651AbnwEwL6G2UtcAQ8GWCq6GzhczcLwwhIhuaHqRygwHC0sA==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.5.5",
|
||||
"@jiaminghi/c-render": "^0.4.3"
|
||||
}
|
||||
},
|
||||
"node_modules/@jiaminghi/color": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmmirror.com/@jiaminghi/color/-/color-1.1.3.tgz",
|
||||
"integrity": "sha512-ZY3hdorgODk4OSTbxyXBPxAxHPIVf9rPlKJyK1C1db46a50J0reFKpAvfZG8zMG3lvM60IR7Qawgcu4ZDO3+Hg==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@jiaminghi/data-view": {
|
||||
"version": "2.10.0",
|
||||
"resolved": "https://registry.npmmirror.com/@jiaminghi/data-view/-/data-view-2.10.0.tgz",
|
||||
"integrity": "sha512-Cud2MTiMcqc5k2KWabR/svuVQmXHANqURo+yj40370/LdI/gyUJ6LG203hWXEnT1nMCeiv/SLVmxv3PXLScCeA==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.5.5",
|
||||
"@jiaminghi/charts": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@jiaminghi/transition": {
|
||||
"version": "1.1.11",
|
||||
"resolved": "https://registry.npmmirror.com/@jiaminghi/transition/-/transition-1.1.11.tgz",
|
||||
"integrity": "sha512-owBggipoHMikDHHDW5Gc7RZYlVuvxHADiU4bxfjBVkHDAmmck+fCkm46n2JzC3j33hWvP9nSCAeh37t6stgWeg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.5.5"
|
||||
}
|
||||
},
|
||||
"node_modules/@jridgewell/sourcemap-codec": {
|
||||
"version": "1.4.15",
|
||||
"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz",
|
||||
@ -5614,56 +5557,6 @@
|
||||
"resolved": "https://registry.npmmirror.com/@intlify/shared/-/shared-9.14.4.tgz",
|
||||
"integrity": "sha512-P9zv6i1WvMc9qDBWvIgKkymjY2ptIiQ065PjDv7z7fDqH3J/HBRBN5IoiR46r/ujRcU7hCuSIZWvCAFCyuOYZA=="
|
||||
},
|
||||
"@jiaminghi/bezier-curve": {
|
||||
"version": "0.0.9",
|
||||
"resolved": "https://registry.npmmirror.com/@jiaminghi/bezier-curve/-/bezier-curve-0.0.9.tgz",
|
||||
"integrity": "sha512-u9xJPOEl6Dri2E9FfmJoGxYQY7vYJkURNX04Vj64tdi535tPrpkuf9Sm0lNr3QTKdHQh0DdNRsaa62FLQNQEEw==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.5.5"
|
||||
}
|
||||
},
|
||||
"@jiaminghi/c-render": {
|
||||
"version": "0.4.3",
|
||||
"resolved": "https://registry.npmmirror.com/@jiaminghi/c-render/-/c-render-0.4.3.tgz",
|
||||
"integrity": "sha512-FJfzj5hGj7MLqqqI2D7vEzHKbQ1Ynnn7PJKgzsjXaZpJzTqs2Yw5OSeZnm6l7Qj7jyPAP53lFvEQNH4o4j6s+Q==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.5.5",
|
||||
"@jiaminghi/bezier-curve": "*",
|
||||
"@jiaminghi/color": "*",
|
||||
"@jiaminghi/transition": "*"
|
||||
}
|
||||
},
|
||||
"@jiaminghi/charts": {
|
||||
"version": "0.2.18",
|
||||
"resolved": "https://registry.npmmirror.com/@jiaminghi/charts/-/charts-0.2.18.tgz",
|
||||
"integrity": "sha512-K+HXaOOeWG9OOY1VG6M4mBreeeIAPhb9X+khG651AbnwEwL6G2UtcAQ8GWCq6GzhczcLwwhIhuaHqRygwHC0sA==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.5.5",
|
||||
"@jiaminghi/c-render": "^0.4.3"
|
||||
}
|
||||
},
|
||||
"@jiaminghi/color": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmmirror.com/@jiaminghi/color/-/color-1.1.3.tgz",
|
||||
"integrity": "sha512-ZY3hdorgODk4OSTbxyXBPxAxHPIVf9rPlKJyK1C1db46a50J0reFKpAvfZG8zMG3lvM60IR7Qawgcu4ZDO3+Hg=="
|
||||
},
|
||||
"@jiaminghi/data-view": {
|
||||
"version": "2.10.0",
|
||||
"resolved": "https://registry.npmmirror.com/@jiaminghi/data-view/-/data-view-2.10.0.tgz",
|
||||
"integrity": "sha512-Cud2MTiMcqc5k2KWabR/svuVQmXHANqURo+yj40370/LdI/gyUJ6LG203hWXEnT1nMCeiv/SLVmxv3PXLScCeA==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.5.5",
|
||||
"@jiaminghi/charts": "*"
|
||||
}
|
||||
},
|
||||
"@jiaminghi/transition": {
|
||||
"version": "1.1.11",
|
||||
"resolved": "https://registry.npmmirror.com/@jiaminghi/transition/-/transition-1.1.11.tgz",
|
||||
"integrity": "sha512-owBggipoHMikDHHDW5Gc7RZYlVuvxHADiU4bxfjBVkHDAmmck+fCkm46n2JzC3j33hWvP9nSCAeh37t6stgWeg==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.5.5"
|
||||
}
|
||||
},
|
||||
"@jridgewell/sourcemap-codec": {
|
||||
"version": "1.4.15",
|
||||
"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz",
|
||||
|
||||
@ -21,7 +21,6 @@
|
||||
"@ant-design/colors": "^7.0.0",
|
||||
"@ant-design/icons-vue": "^6.1.0",
|
||||
"@icon-park/vue-next": "^1.4.2",
|
||||
"@jiaminghi/data-view": "^2.10.0",
|
||||
"@tinymce/tinymce-vue": "^5.1.0",
|
||||
"ant-design-vue": "^4.0.1",
|
||||
"axios": "^1.4.0",
|
||||
|
||||
24
src/App.vue
24
src/App.vue
@ -30,4 +30,26 @@ const theme = ref({
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less"></style>
|
||||
<style lang="less">
|
||||
.amap-info-content{
|
||||
min-height: 130px;
|
||||
min-width: 200px;
|
||||
/* height: 293px; */
|
||||
background-image: url(/src/assets/marker.png);
|
||||
background-size: 100% 100%;
|
||||
/* background-position: center; */
|
||||
background-repeat: no-repeat;
|
||||
background-color: transparent;
|
||||
padding: 20px;
|
||||
}
|
||||
.bottom-center .amap-info-sharp:after {
|
||||
|
||||
|
||||
position: absolute;
|
||||
content: "";
|
||||
margin-top: -7px;
|
||||
border-top: 8px solid rgba(0, 0, 0, .3);
|
||||
filter: blur(2px);
|
||||
z-index: -1;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -17,4 +17,7 @@ export const delItem = (id) => request.basic.delete(`/api/v1/customers/${id}`)
|
||||
export const getCount=(params)=>request.basic.get('/api/v1/customers/count',params)
|
||||
|
||||
//创建工单
|
||||
export const createOrderItem=(params)=> request.basic.post('/api/v1/orders', params)
|
||||
export const createOrderItem=(params)=> request.basic.post('/api/v1/orders', params)
|
||||
|
||||
//转入转出
|
||||
export const inOutLogs=(params)=>request.basic.post('/api/v1/in-out-logs',params)
|
||||
BIN
src/assets/marker.png
Normal file
BIN
src/assets/marker.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
123
src/components/JsonMap/index.vue
Normal file
123
src/components/JsonMap/index.vue
Normal file
@ -0,0 +1,123 @@
|
||||
<template>
|
||||
<div class="map-wrapper">
|
||||
<div ref="mapContainer" class="map-container"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onMounted, ref } from 'vue'
|
||||
import AMapLoader from '@amap/amap-jsapi-loader'
|
||||
|
||||
// 地图容器引用
|
||||
const mapContainer = ref(null)
|
||||
let map = null
|
||||
|
||||
// 观南社区 - 我们将通过高德行政区查询 API 获取其边界
|
||||
const districtName = '观南社区'
|
||||
const city = '南通市'
|
||||
|
||||
// 初始化地图
|
||||
const initMap = async () => {
|
||||
try {
|
||||
// 🔥 关键:必须在这里声明需要加载的插件
|
||||
await AMapLoader.load({
|
||||
key: '38b334d84b1f89aa39d4efae76f0b341', // 替换为你的高德 Key
|
||||
version: '2.0',
|
||||
plugins: ['AMap.DistrictSearch'] // ✅ 显式加载行政区查询插件
|
||||
})
|
||||
|
||||
console.log('高德地图 SDK 及插件加载成功')
|
||||
|
||||
// 创建地图实例
|
||||
map = new window.AMap.Map(mapContainer.value, {
|
||||
viewMode: '3D',
|
||||
pitch: 20,
|
||||
})
|
||||
|
||||
// 现在可以安全使用 DistrictSearch
|
||||
const districtSearch = new window.AMap.DistrictSearch({
|
||||
level: 'community', // 查询社区级
|
||||
subdistrict: 0 // 不返回下级
|
||||
})
|
||||
|
||||
const city = '南通市'
|
||||
const districtName = '观南社区'
|
||||
|
||||
districtSearch.search(`${city}${districtName}`, (status, result) => {
|
||||
if (status === 'complete' && result.districtList.length > 0) {
|
||||
const data = result.districtList[0]
|
||||
const bounds = data.boundaries
|
||||
|
||||
if (!bounds || bounds.length === 0) {
|
||||
alert('❌ 未获取到观南社区的边界数据,请确认该社区存在')
|
||||
return
|
||||
}
|
||||
|
||||
// 多边形路径
|
||||
const path = bounds[0].map(coord => new window.AMap.LngLat(coord[0], coord[1]))
|
||||
|
||||
// 绘制多边形
|
||||
const polygon = new window.AMap.Polygon({
|
||||
path: path,
|
||||
strokeColor: '#4facfe',
|
||||
strokeWeight: 4,
|
||||
strokeOpacity: 0.9,
|
||||
fillColor: 'transparent'
|
||||
})
|
||||
map.add(polygon)
|
||||
|
||||
// 自动适配视野
|
||||
map.setFitView(polygon)
|
||||
const currentZoom = map.getZoom()
|
||||
map.setZoom(currentZoom - 0.5) // 微调避免太松
|
||||
|
||||
// 添加中心标注
|
||||
const marker = new window.AMap.Marker({
|
||||
position: data.center,
|
||||
label: { content: '观南社区', direction: 'top' }
|
||||
})
|
||||
map.add(marker)
|
||||
|
||||
// 🛑 拖拽限制:防止地图中心移出区域
|
||||
map.on('dragend', () => {
|
||||
const center = map.getCenter()
|
||||
const isInside = window.AMap.GeometryUtil.isPointInRing(center, path)
|
||||
if (!isInside) {
|
||||
console.log('已超出观南社区范围,自动回弹')
|
||||
map.panTo(data.center)
|
||||
}
|
||||
})
|
||||
|
||||
console.log('✅ 成功加载并显示观南社区')
|
||||
} else {
|
||||
alert('🔍 未找到“观南社区”,请检查名称是否正确(建议尝试:观南村、或去掉“市”)')
|
||||
}
|
||||
})
|
||||
|
||||
} catch (e) {
|
||||
console.error('地图初始化失败:', e)
|
||||
alert('❌ 地图加载失败,请检查网络或高德 Key 权限')
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
console.log('组件已挂载,准备初始化地图')
|
||||
initMap()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.map-wrapper {
|
||||
width: 100%;
|
||||
height: 600px;
|
||||
border: 1px solid #333;
|
||||
border-radius: 8px;
|
||||
background: #000; /* 外层黑色背景,无缝衔接 */
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.map-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
119
src/components/MapWithMarkers/index.vue
Normal file
119
src/components/MapWithMarkers/index.vue
Normal file
@ -0,0 +1,119 @@
|
||||
<template>
|
||||
<div class="map-wrapper">
|
||||
<div ref="mapContainer" style="width: 100%; height: 600px; border: 1px solid #333; border-radius: 8px;"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onMounted, ref } from 'vue'
|
||||
import AMapLoader from '@amap/amap-jsapi-loader'
|
||||
import bgImageUrl from '@/assets/marker.png'
|
||||
// 地图容器引用
|
||||
const mapContainer = ref(null)
|
||||
|
||||
// 地图实例
|
||||
let map = null
|
||||
|
||||
// 🌆 更多标注点数据(北京热门地点)
|
||||
const markers = [
|
||||
{ position: [116.397428, 39.90923], title: '天安门', address: '北京市东城区长安街', tel: '010-12345678' },
|
||||
{ position: [116.3961, 39.9087], title: '故宫博物院', address: '北京市东城区景山前街4号', tel: '010-87654321' },
|
||||
{ position: [116.4076, 39.9037], title: '王府井', address: '北京市东城区王府井大街', tel: '010-11223344' },
|
||||
{ position: [116.3780, 39.9042], title: '国家大剧院', address: '北京市西城区西长安街2号', tel: '010-55667788' },
|
||||
{ position: [116.3375, 39.9040], title: '中关村', address: '北京市海淀区中关村大街', tel: '010-99887766' },
|
||||
{ position: [116.481485, 39.989692], title: '望京SOHO', address: '北京市朝阳区望京街', tel: '010-12312312' },
|
||||
{ position: [116.4678, 39.9923], title: '798艺术区', address: '北京市朝阳区酒仙桥路', tel: '010-23423423' },
|
||||
{ position: [116.4255, 39.9075], title: '北京站', address: '北京市东城区毛家湾胡同甲13号', tel: '010-34534534' },
|
||||
{ position: [116.3260, 39.9870], title: '颐和园', address: '北京市海淀区新建宫门路19号', tel: '010-45645645' },
|
||||
{ position: [116.4948, 39.8814], title: '北京南站', address: '北京市丰台区永外大街120号', tel: '010-56756756' },
|
||||
{ position: [116.4625, 39.9100], title: '三里屯', address: '北京市朝阳区三里屯路', tel: '010-67867867' },
|
||||
{ position: [116.3600, 39.9780], title: '奥林匹克公园', address: '北京市朝阳区科荟路15号', tel: '010-78978978' }
|
||||
]
|
||||
|
||||
// 初始化地图
|
||||
const initMap = async () => {
|
||||
try {
|
||||
// 加载高德地图 SDK
|
||||
await AMapLoader.load({
|
||||
key: '38b334d84b1f89aa39d4efae76f0b341', // 🔑 替换为你的高德 Key
|
||||
version: '2.0' // 使用最新版本
|
||||
// 注意:不需要聚合插件了
|
||||
})
|
||||
|
||||
console.log('高德地图 SDK 加载成功')
|
||||
|
||||
// 初始化地图
|
||||
map = new window.AMap.Map(mapContainer.value, {
|
||||
zoom: 11, // 适当缩放,显示更多点
|
||||
center: [116.397428, 39.90923], // 北京中心
|
||||
viewMode: '3D',
|
||||
mapStyle: 'amap://styles/dark', // 🖤 黑色主题
|
||||
pitch: 35, // 倾斜角度,增强 3D 感
|
||||
rotation: 0 // 旋转角度
|
||||
})
|
||||
|
||||
console.log('地图初始化完成,共添加 ${markers.length} 个标注')
|
||||
|
||||
// 遍历数据,创建标注
|
||||
markers.forEach(item => {
|
||||
// 创建水滴图标标注
|
||||
const marker = new window.AMap.Marker({
|
||||
position: item.position,
|
||||
icon: new AMap.Icon({
|
||||
size:new AMap.Size(30,30),
|
||||
imageSize: new AMap.Size(30, 30), // 图像裁剪大小(可选)
|
||||
image:'data:image/png;base64,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', // 💧 蓝色水滴
|
||||
}),
|
||||
offset: new window.AMap.Pixel(-13, -30), // 调整锚点,指向位置
|
||||
title: item.title, // 鼠标悬停提示
|
||||
extData: item // 绑定数据,便于点击时使用
|
||||
})
|
||||
|
||||
// 创建信息窗口
|
||||
const infoWindow = new window.AMap.InfoWindow({
|
||||
content: `
|
||||
<div>
|
||||
<h4 >${item.title}</h4>
|
||||
<p><b>📍 地址:</b>${item.address}</p>
|
||||
<p><b>📞 电话:</b>${item.tel}</p>
|
||||
</div>
|
||||
`,
|
||||
offset: new window.AMap.Pixel(0, -30)
|
||||
})
|
||||
|
||||
// 点击标注打开信息窗口
|
||||
marker.on('click', () => {
|
||||
infoWindow.open(map, marker.getPosition())
|
||||
})
|
||||
|
||||
// 将标注添加到地图
|
||||
map.add(marker)
|
||||
})
|
||||
|
||||
} catch (e) {
|
||||
console.error('地图初始化失败:', e)
|
||||
alert('地图加载失败,请检查高德 Key 或网络连接')
|
||||
}
|
||||
}
|
||||
|
||||
// 组件挂载后初始化地图
|
||||
onMounted(() => {
|
||||
console.log('组件已挂载,准备初始化地图')
|
||||
initMap()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.map-wrapper {
|
||||
/* padding: 20px; */
|
||||
background: #0f0f0f;
|
||||
/* min-height: 100vh; */
|
||||
color: #fff;
|
||||
font-family: 'Microsoft YaHei', Arial, sans-serif;
|
||||
}
|
||||
h2 {
|
||||
text-align: center;
|
||||
color: #4facfe;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
</style>
|
||||
50
src/components/ServiceStation/index.vue
Normal file
50
src/components/ServiceStation/index.vue
Normal file
@ -0,0 +1,50 @@
|
||||
<template>
|
||||
<a-select ref="select" v-model:value="model" style="width: 100%" @change="handleChange" :defaultOpen="defaultOpen">
|
||||
<a-select-option v-for="value in stationList" :key="value.id" :value="value.id">
|
||||
{{ value.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref,defineModel } from 'vue'
|
||||
import apis from '@/apis'
|
||||
|
||||
// 使用 defineModel 简化双向绑定
|
||||
// 它会自动生成 { currentOrg: String, onUpdateCurrentOrg: Function }
|
||||
// 并返回一个可读写的 ref
|
||||
const model = defineModel('currentOrg', { type: String, default: '' })
|
||||
|
||||
// 接收其他不需要双向绑定的 prop
|
||||
const props = defineProps({
|
||||
defaultOpen: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
})
|
||||
|
||||
const emit = defineEmits(['change']) // 保留 change 事件
|
||||
|
||||
// 获取数据
|
||||
const stationList = ref([])
|
||||
getData()
|
||||
async function getData() {
|
||||
try {
|
||||
const { data, success } = await apis.serviceMenu.getServiceSiteList({
|
||||
pageSize: 100,
|
||||
current: 1
|
||||
})
|
||||
if (success) {
|
||||
stationList.value = data.map(item => ({ id: item.id, name: item.name }))
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取服务站点列表失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
// 处理 change 事件
|
||||
function handleChange(e) {
|
||||
// model.value 会自动同步(不需要手动赋值)
|
||||
emit('change', e)
|
||||
}
|
||||
</script>
|
||||
@ -1,12 +1,12 @@
|
||||
import { createApp } from 'vue'
|
||||
import {spliceUrl} from '@/utils/util'
|
||||
import { spliceUrl } from '@/utils/util'
|
||||
import App from '@/App.vue'
|
||||
import { useCore } from '@/core'
|
||||
import './assets/iconfont/iconfont.css';
|
||||
import './assets/iconfont/iconfont.css'
|
||||
// import dataV from '@jiaminghi/data-view'
|
||||
|
||||
const app = createApp(App)
|
||||
// app.use(dataV)
|
||||
app.config.globalProperties.$spliceUrl=spliceUrl
|
||||
|
||||
app.config.globalProperties.$spliceUrl = spliceUrl
|
||||
useCore(app)
|
||||
app.mount('#app')
|
||||
|
||||
@ -6,5 +6,5 @@ export default [
|
||||
meta: {
|
||||
title: '平台选择',
|
||||
},
|
||||
},
|
||||
}
|
||||
]
|
||||
@ -1,4 +1,5 @@
|
||||
<template>
|
||||
<!-- <JsonMap /> -->
|
||||
<a-row :gutter="16">
|
||||
<a-col :lg="24">
|
||||
<a-card>
|
||||
@ -95,6 +96,7 @@
|
||||
import ClipboardJS from 'clipboard'
|
||||
import { CheckCircleFilled, CopyOutlined } from '@ant-design/icons-vue'
|
||||
import { message } from 'ant-design-vue'
|
||||
import JsonMap from '@/components/JsonMap/index.vue'
|
||||
defineOptions({
|
||||
name: 'home',
|
||||
})
|
||||
|
||||
@ -6,61 +6,84 @@
|
||||
</div>
|
||||
<div class="screen-content">
|
||||
<div>
|
||||
<div>
|
||||
<div class="card-title">服务对象人口统计</div>
|
||||
<div class="card-content"></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="card-title">服务对象人口统计</div>
|
||||
<div class="card-content"></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="card-title">服务对象人口统计</div>
|
||||
<div class="card-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
<MapWidthMarkers />
|
||||
</div>
|
||||
<div>
|
||||
<div class="card-title">服务对象人口统计</div>
|
||||
<div class="card-content">
|
||||
<!-- <dv-active-ring-chart :config="config1" style="width:300px;height:300px" /> -->
|
||||
<borderBox1 />
|
||||
</div>
|
||||
</div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</div>
|
||||
<div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</div>
|
||||
<div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div>
|
||||
<div class="card-title">服务对象人口统计</div>
|
||||
<div class="card-content"></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="card-title">服务对象人口统计</div>
|
||||
<div class="card-content"></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="card-title">服务对象人口统计</div>
|
||||
<div class="card-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import {ref} from 'vue'
|
||||
const config1=ref(
|
||||
import { ref } from 'vue'
|
||||
import MapWidthMarkers from '@/components/MapWithMarkers/index.vue'
|
||||
import { borderBox1 } from '@jiaminghi/data-view'
|
||||
Vue.use(borderBox1)
|
||||
const config1 = ref(
|
||||
{
|
||||
|
||||
radius: '40%',
|
||||
activeRadius: '45%',
|
||||
data: [
|
||||
{
|
||||
name: '周口',
|
||||
value: 55
|
||||
},
|
||||
{
|
||||
name: '南阳',
|
||||
value: 120
|
||||
},
|
||||
{
|
||||
name: '西峡',
|
||||
value: 78
|
||||
},
|
||||
{
|
||||
name: '驻马店',
|
||||
value: 66
|
||||
},
|
||||
{
|
||||
name: '新乡',
|
||||
value: 80
|
||||
}
|
||||
],
|
||||
digitalFlopStyle: {
|
||||
fontSize: 20
|
||||
},
|
||||
showOriginValue: true
|
||||
radius: '40%',
|
||||
activeRadius: '45%',
|
||||
data: [
|
||||
{
|
||||
name: '周口',
|
||||
value: 55
|
||||
},
|
||||
{
|
||||
name: '南阳',
|
||||
value: 120
|
||||
},
|
||||
{
|
||||
name: '西峡',
|
||||
value: 78
|
||||
},
|
||||
{
|
||||
name: '驻马店',
|
||||
value: 66
|
||||
},
|
||||
{
|
||||
name: '新乡',
|
||||
value: 80
|
||||
}
|
||||
],
|
||||
digitalFlopStyle: {
|
||||
fontSize: 20
|
||||
},
|
||||
showOriginValue: true
|
||||
}
|
||||
)
|
||||
</script>
|
||||
|
||||
10
src/views/login/map.vue
Normal file
10
src/views/login/map.vue
Normal file
@ -0,0 +1,10 @@
|
||||
<template>
|
||||
<div style="width: 100%;height: 100%;">
|
||||
<JsonMap />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import {ref} from 'vue'
|
||||
import JsonMap from '@/components/JsonMap/index.vue'
|
||||
</script>
|
||||
@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<div class="layout-container">
|
||||
<StarBackground />
|
||||
<div class="top">
|
||||
<div>
|
||||
<div class="top" @click="handleLogout">
|
||||
<div >
|
||||
<span class="corner corner-top"></span>
|
||||
<span class="corner corner-left"></span>
|
||||
<span class="corner corner-bottom"></span>
|
||||
@ -58,12 +58,7 @@
|
||||
<span @click="currentPlatForm = 'jianguan'">{{ '< 返回' }}</span>
|
||||
</div>
|
||||
<h3>请选择您的管理组织</h3>
|
||||
<a-select ref="select" v-model:value="currentOrg" style="width: 100%"
|
||||
@change="handleChange" :defaultOpen="true">
|
||||
<a-select-option v-for="value in stationList" :value="value.id">{{
|
||||
value.name
|
||||
}}</a-select-option>
|
||||
</a-select>
|
||||
<ServiceStation @change="handleChange" :defaultOpen="true"/>
|
||||
</a-card>
|
||||
</div>
|
||||
</div>
|
||||
@ -83,13 +78,16 @@ import yunying from '@/assets/imgs/yunying.png'
|
||||
import { useAppStore, useRouterStore, useUserStore } from '@/store'
|
||||
import { template } from 'lodash-es'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import apis from '@/apis'
|
||||
import ServiceStation from '@/components/ServiceStation/index.vue'
|
||||
import storage from '@/utils/storage'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
const { locale, t } = useI18n()
|
||||
defineOptions({
|
||||
name: 'PlatForm',
|
||||
})
|
||||
const appStore = useAppStore()
|
||||
const routerStore = useRouterStore()
|
||||
const userStore = useUserStore()
|
||||
const router = useRouter()
|
||||
const stationList = ref([])
|
||||
const currentPlatForm = ref('jianguan')
|
||||
@ -101,14 +99,7 @@ onBeforeMount(() => {
|
||||
async function handleSelect(type) {
|
||||
if (type === 'yunying') {
|
||||
currentPlatForm.value = 'yunying'
|
||||
try {
|
||||
const { data, success } = await apis.serviceMenu.getServiceSiteList({ pageSize: 100, current: 1 })
|
||||
if (success) {
|
||||
stationList.value = data.map(item => ({ id: item.id, name: item.name }))
|
||||
}
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
|
||||
} else {
|
||||
storage.local.setItem('platform', type)
|
||||
await appStore.init()
|
||||
@ -148,6 +139,23 @@ async function handleChange(e) {
|
||||
goIndex()
|
||||
|
||||
}
|
||||
/**
|
||||
* 退出登录
|
||||
*/
|
||||
function handleLogout() {
|
||||
Modal.confirm({
|
||||
title: t('component.RightContent.logout'),
|
||||
okText: t('button.confirm'),
|
||||
cancelText: t('button.cancel'),
|
||||
onOk: () => {
|
||||
userStore.logout().then(() => {
|
||||
router.push({
|
||||
name: 'login',
|
||||
})
|
||||
})
|
||||
},
|
||||
})
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.body-bg {
|
||||
|
||||
@ -624,6 +624,7 @@ function handleOk() {
|
||||
params.archive.starGovernmentService = formData.value.governmentPurchasedServiceStartDate[0]
|
||||
params.archive.endGovernmentService = formData.value.governmentPurchasedServiceStartDate[1]
|
||||
}
|
||||
// params.stationId=storage.local.getItem('stationId')
|
||||
// 单独封装一个同步校验函数
|
||||
if (params.identityType === '1' && !isValidIdCard(params.identityNo)) {
|
||||
return message.error('请输入正确的身份证号码')
|
||||
|
||||
156
src/views/serverObj/serverList/components/TransferOut.vue
Normal file
156
src/views/serverObj/serverList/components/TransferOut.vue
Normal file
@ -0,0 +1,156 @@
|
||||
<template>
|
||||
<a-modal :open="modal.open" :title="modal.title" :width="600" :confirm-loading="modal.confirmLoading"
|
||||
:after-close="onAfterClose" :cancel-text="cancelText" @ok="handleOk" @cancel="handleCancel">
|
||||
<a-spin tip="Loading..." :spinning="spining">
|
||||
<a-card>
|
||||
<a-form ref="formRef" :model="formData" :rules="formRules">
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="24">
|
||||
<a-form-item label="转出类型" name="directionType">
|
||||
<a-radio-group v-model:value="formData.directionType">
|
||||
<a-radio :value="'Transfer'">转出</a-radio>
|
||||
<a-radio :value="'Death'">去世</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-form-item label="转出原因" name="reason">
|
||||
<a-select v-model:value="formData.reason" placeholder="请选择转出原因" allow-clear >
|
||||
<a-select-option v-for="item in dicsStore.dictOptions.OUT_REASON"
|
||||
:key="item.dval" :value="item.dval">
|
||||
{{ item.introduction }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-form-item label="转入节点" name="nStationId">
|
||||
<ServiceStation @change="handleChange" v-model:value="formData.nStationId"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24" v-if="formData.directionType==='Death'">
|
||||
<a-form-item label="去世时间">
|
||||
<a-date-picker v-model:value="formData.passWayAt" style="width: 100%;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-form-item label="备注" name="remark">
|
||||
<a-textarea v-model:value="formData.remark" placeholder="请输入备注"
|
||||
:rows="1" :auto-size="{ minRows: 1, maxRows: 2 }" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, defineProps, nextTick, watch } from 'vue'
|
||||
import { config } from '@/config'
|
||||
import apis from '@/apis'
|
||||
import { useForm, useModal, useSpining } from '@/hooks'
|
||||
import { useDicsStore } from '@/store'
|
||||
import dayjs from 'dayjs'
|
||||
import storage from '@/utils/storage'
|
||||
import ServiceStation from '@/components/ServiceStation/index.vue'
|
||||
const emit = defineEmits(['ok'])
|
||||
const { modal, showModal, hideModal, showLoading, hideLoading } = useModal()
|
||||
const { formRecord, formData, formRef, formRules, resetForm } = useForm()
|
||||
const cancelText = ref('取消')
|
||||
const spining = ref(false)
|
||||
formRules.value = {
|
||||
reason: [{ required: true, message: '请选择原因', trigger: 'change' }],
|
||||
directionType: [{ required: true, message: '请选择类型', trigger: 'change' }],
|
||||
nStationId:[{ required: true, message: '请选择节点', trigger: 'change' }],
|
||||
passWayAt:[{ required: true, message: '请选择去世时间', trigger: 'change' }]
|
||||
}
|
||||
|
||||
const dicsStore = useDicsStore()
|
||||
formData.value = {}
|
||||
/**
|
||||
* 新建
|
||||
*/
|
||||
function handleCreate(id) {
|
||||
formData.value.directionType = 'Transfer'
|
||||
formData.value.direction='Out'
|
||||
formData.value.customerId=storage.local.getItem('stationId'),
|
||||
formData.value.stationId=id
|
||||
showModal({
|
||||
type: 'create',
|
||||
title: '转出',
|
||||
})
|
||||
}
|
||||
function handleChange(e){
|
||||
console.log(e)
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 确定
|
||||
*/
|
||||
function handleOk() {
|
||||
formRef.value
|
||||
.validateFields()
|
||||
.then(async (values) => {
|
||||
try {
|
||||
showLoading()
|
||||
let params = {
|
||||
...formData.value,
|
||||
}
|
||||
if(params.directionType==='Death'){
|
||||
params.passWayAt=dayjs(formData.value.passWayAt)
|
||||
}
|
||||
let result = null
|
||||
switch (modal.value.type) {
|
||||
case 'create':
|
||||
result = await apis.serverObj.inOutLogs(params).catch(() => {
|
||||
throw new Error()
|
||||
})
|
||||
console.log('result', result.code)
|
||||
break
|
||||
case 'edit':
|
||||
console.log(params)
|
||||
result = await apis.serverObj.updateItem(params.id, params).catch(() => {
|
||||
throw new Error()
|
||||
})
|
||||
break
|
||||
}
|
||||
hideLoading()
|
||||
if (config('http.code.success') === true) {
|
||||
hideModal()
|
||||
emit('ok')
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error.message)
|
||||
hideLoading()
|
||||
// message.error(error.message)
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
hideLoading()
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 取消
|
||||
*/
|
||||
function handleCancel() {
|
||||
hideModal()
|
||||
}
|
||||
|
||||
/**
|
||||
* 关闭后
|
||||
*/
|
||||
function onAfterClose() {
|
||||
resetForm()
|
||||
hideLoading()
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
handleCreate
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
@ -343,7 +343,7 @@
|
||||
v-if="platForm === 'jianguan'">
|
||||
<span>线上工单</span>
|
||||
</x-action-button>
|
||||
<x-action-button @click="checkHandler(record)">
|
||||
<x-action-button @click="$refs.transferRef.handleCreate(record.id)">
|
||||
<span>转出</span>
|
||||
</x-action-button>
|
||||
</template>
|
||||
@ -355,7 +355,7 @@
|
||||
<edit-dialog ref="editDialogRef" @ok="onOk"></edit-dialog>
|
||||
<detail ref="detailRef"></detail>
|
||||
<LineOrder2 ref="lineOrderRef" />
|
||||
|
||||
<TransferOut ref="transferRef" />
|
||||
<!-- <a-drawer v-model:open="lineOpen" class="custom-class" width="600" root-class-name="root-class-name" :root-style="{ color: 'blue' }" :title="lineTitle" placement="right">
|
||||
<LineOrder ref="lineOrderRef" />
|
||||
</a-drawer> -->
|
||||
@ -379,6 +379,7 @@ import NodeTree from '@/components/NodeTree/index.vue'
|
||||
import dayjs from 'dayjs'
|
||||
import {DownOutlined} from '@ant-design/icons-vue'
|
||||
import storage from '@/utils/storage'
|
||||
import TransferOut from './components/TransferOut.vue'
|
||||
defineOptions({
|
||||
name: 'serverList',
|
||||
})
|
||||
@ -387,7 +388,7 @@ const totalCount = ref(0) // 总人数
|
||||
const dicsStore = useDicsStore()
|
||||
const lineOpen = ref(false)
|
||||
const lineTitle = ref('线下工单')
|
||||
|
||||
const transferRef=ref()
|
||||
const serviceName = ref('')
|
||||
const columns = [
|
||||
{
|
||||
@ -678,6 +679,7 @@ const checkHandler = (record) => {
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
|
||||
@ -45,6 +45,7 @@ import apis from '@/apis'
|
||||
import { useForm, useModal, useSpining } from '@/hooks'
|
||||
import { message } from 'ant-design-vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import storage from '@/utils/storage'
|
||||
const emit = defineEmits(['ok'])
|
||||
const { t } = useI18n() // 解构出t方法
|
||||
const { modal, showModal, hideModal, showLoading, hideLoading } = useModal()
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<x-search-bar class="mb-8-2">
|
||||
<template #default="{ gutter, colSpan }">
|
||||
<a-form :label-col="{ style: { width: '100px' } }" :model="searchFormData" layout="inline">
|
||||
<a-form :model="searchFormData" layout="inline">
|
||||
<a-row :gutter="gutter">
|
||||
<a-col v-bind="colSpan">
|
||||
<a-form-item :label="$t('pages.system.menu.form.name')" name="name">
|
||||
|
||||
@ -88,7 +88,7 @@ import { ref, watch } from 'vue'
|
||||
import { config } from '@/config'
|
||||
import apis from '@/apis'
|
||||
import { useForm, useModal } from '@/hooks'
|
||||
|
||||
import storage from '@/utils/storage'
|
||||
const emit = defineEmits(['ok'])
|
||||
import { useI18n } from 'vue-i18n'
|
||||
const { modal, showModal, hideModal, showLoading, hideLoading } = useModal()
|
||||
@ -108,7 +108,8 @@ formRules.value = {
|
||||
const treeData = ref([])
|
||||
const checkedKeys = ref([])
|
||||
async function getMenus() {
|
||||
const { data } = await apis.menu.getMenuList().catch(() => {
|
||||
const platForm = storage.local.getItem('platform')
|
||||
const { data } = await apis.menu.getMenuList({platform:platForm}).catch(() => {
|
||||
throw new Error()
|
||||
})
|
||||
|
||||
|
||||
47
yarn.lock
47
yarn.lock
@ -175,7 +175,7 @@
|
||||
resolved "https://registry.npmjs.org/@babel/parser/-/parser-7.22.5.tgz"
|
||||
integrity sha512-DFZMC9LJUG9PLOclRC32G63UXwzqS2koQC8dkx+PLdmt1xSePYpbT/NbsrJy8Q/muXz7o/h/d4A7Fuyixm559Q==
|
||||
|
||||
"@babel/runtime@^7.10.5", "@babel/runtime@^7.5.5":
|
||||
"@babel/runtime@^7.10.5":
|
||||
version "7.18.6"
|
||||
resolved "https://registry.npmjs.org/@babel/runtime/-/runtime-7.18.6.tgz"
|
||||
integrity sha512-t9wi7/AW6XtKahAe20Yw0/mMljKq0B1r2fPdvaAdV/KPDZewFXdaaa6K7lxmZBZ8FBNpCiAT6iHPmd6QO9bKfQ==
|
||||
@ -302,51 +302,6 @@
|
||||
resolved "https://registry.npmmirror.com/@intlify/shared/-/shared-9.14.4.tgz"
|
||||
integrity sha512-P9zv6i1WvMc9qDBWvIgKkymjY2ptIiQ065PjDv7z7fDqH3J/HBRBN5IoiR46r/ujRcU7hCuSIZWvCAFCyuOYZA==
|
||||
|
||||
"@jiaminghi/bezier-curve@*":
|
||||
version "0.0.9"
|
||||
resolved "https://registry.npmmirror.com/@jiaminghi/bezier-curve/-/bezier-curve-0.0.9.tgz"
|
||||
integrity sha512-u9xJPOEl6Dri2E9FfmJoGxYQY7vYJkURNX04Vj64tdi535tPrpkuf9Sm0lNr3QTKdHQh0DdNRsaa62FLQNQEEw==
|
||||
dependencies:
|
||||
"@babel/runtime" "^7.5.5"
|
||||
|
||||
"@jiaminghi/c-render@^0.4.3":
|
||||
version "0.4.3"
|
||||
resolved "https://registry.npmmirror.com/@jiaminghi/c-render/-/c-render-0.4.3.tgz"
|
||||
integrity sha512-FJfzj5hGj7MLqqqI2D7vEzHKbQ1Ynnn7PJKgzsjXaZpJzTqs2Yw5OSeZnm6l7Qj7jyPAP53lFvEQNH4o4j6s+Q==
|
||||
dependencies:
|
||||
"@babel/runtime" "^7.5.5"
|
||||
"@jiaminghi/bezier-curve" "*"
|
||||
"@jiaminghi/color" "*"
|
||||
"@jiaminghi/transition" "*"
|
||||
|
||||
"@jiaminghi/charts@*":
|
||||
version "0.2.18"
|
||||
resolved "https://registry.npmmirror.com/@jiaminghi/charts/-/charts-0.2.18.tgz"
|
||||
integrity sha512-K+HXaOOeWG9OOY1VG6M4mBreeeIAPhb9X+khG651AbnwEwL6G2UtcAQ8GWCq6GzhczcLwwhIhuaHqRygwHC0sA==
|
||||
dependencies:
|
||||
"@babel/runtime" "^7.5.5"
|
||||
"@jiaminghi/c-render" "^0.4.3"
|
||||
|
||||
"@jiaminghi/color@*":
|
||||
version "1.1.3"
|
||||
resolved "https://registry.npmmirror.com/@jiaminghi/color/-/color-1.1.3.tgz"
|
||||
integrity sha512-ZY3hdorgODk4OSTbxyXBPxAxHPIVf9rPlKJyK1C1db46a50J0reFKpAvfZG8zMG3lvM60IR7Qawgcu4ZDO3+Hg==
|
||||
|
||||
"@jiaminghi/data-view@^2.10.0":
|
||||
version "2.10.0"
|
||||
resolved "https://registry.npmmirror.com/@jiaminghi/data-view/-/data-view-2.10.0.tgz"
|
||||
integrity sha512-Cud2MTiMcqc5k2KWabR/svuVQmXHANqURo+yj40370/LdI/gyUJ6LG203hWXEnT1nMCeiv/SLVmxv3PXLScCeA==
|
||||
dependencies:
|
||||
"@babel/runtime" "^7.5.5"
|
||||
"@jiaminghi/charts" "*"
|
||||
|
||||
"@jiaminghi/transition@*":
|
||||
version "1.1.11"
|
||||
resolved "https://registry.npmmirror.com/@jiaminghi/transition/-/transition-1.1.11.tgz"
|
||||
integrity sha512-owBggipoHMikDHHDW5Gc7RZYlVuvxHADiU4bxfjBVkHDAmmck+fCkm46n2JzC3j33hWvP9nSCAeh37t6stgWeg==
|
||||
dependencies:
|
||||
"@babel/runtime" "^7.5.5"
|
||||
|
||||
"@jridgewell/sourcemap-codec@^1.4.13":
|
||||
version "1.4.15"
|
||||
resolved "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz"
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user