wang_yp
/
ball_admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(amap):core

This commit is contained in:
wang_yp 2024-10-16 22:52:24 +08:00
parent fd954a753a
commit cfbcbe31a1
11 changed files with 1342 additions and 71 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
src/components/map/MapComponent.tsx
View File

@ -1,6 +1,7 @@
import { useEffect, useState } from "react";
import AMapLoader from "@amap/amap-jsapi-loader";
import MapUtl from "./mapUtil";
import { mapArrs } from "@/store/map";
export default function MapContainer() {
let [amap, setmaps] = useState<any>(null);
@ -16,7 +17,7 @@ export default function MapContainer() {
const Amap = await AMapLoader.load({
key: "d58999d072ed7e5897d3900a769cfda0", // 申请好的Web端开发者Key，首次调用 load 时必填
version: "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
plugins: ["AMap.Scale","AMap.MoveAnimation","AMap.Weather,AMap.DistrictSearch"],
plugins: ["AMap.Scale", "AMap.MoveAnimation", "AMap.Weather"],
});
amap = new Amap.Map("container", {
@ -26,34 +27,47 @@ export default function MapContainer() {
mapStyle: "amap://styles/darkblue",
resizeEnable: true,
});
const district = new Amap.DistrictSearch({
subdistrict: 3, //返回下一级行政区
extensions: "all", //返回行政区边界坐标组等具体信息
level: "street", //查询行政级别为 市
// const bundler = result.districtList[0].boundaries;
const bundler: Array<any> = [];
mapArrs.forEach((item) => {
let db = MapUtl.bdConvertGd(item);
bundler.push(db);
});
district.search("510116", function (status,result){
if(status === "complete"){
const bundler = result.districtList[0].boundaries;
const polygon = new Amap.Polygon({
map: amap,
path: bundler,
strokeColor: "#ef9363", //线颜色
strokeColor: "#85b0ec", //线颜色
strokeOpacity: 0.8, //线透明度
strokeWeight: 2, //线宽
fillColor: "#ef9363", //填充色
fillColor: "#85b0ec", //填充色
fillOpacity: 0.3, //填充透明度
});
amap.add(polygon)
amap.add(polygon);
amap.setFitView();
}
})
setmaps(amap);
// addMaket(Amap,amap);
MapUtl.loadMap = Amap;
MapUtl.amap = amap;
[
{ title: "红桥微型消防站", po: [103.889435, 30.528084] },
{ title: "桃荚微型消防站", po: [103.89066, 30.506378] },
{ title: "文武微型消防站", po: [103.85076, 30.518194] },
{ title: "长沟微型消防站", po: [103.9063, 30.556198] },
{ title: "应天微型消防站", po: [103.90963, 30.530624] },
{ title: "花龙村微型消防站", po: [103.92564, 30.45827] },
{ title: "白塔小型消防站", po: [103.9049, 30.503006] },
].forEach((item) => {
MapUtl.addMakerDis({
lng: item.po[0],
lat: item.po[1],
title: item.title,
});
});
var weather = new Amap.Weather();
MapUtl.wecherInfo = weather
MapUtl.wecherInfo = weather;
amap.setFitView();
};

40
src/components/map/mapUtil.ts
View File

@ -35,6 +35,33 @@ class MapUtl {
marker: marker
})
}
static addMakerDis(data: any) {
const { lng, lat, title } = data;
const marker = new MapUtl.loadMap.Marker({
position: new MapUtl.loadMap.LngLat(lng, lat),
icon: new MapUtl.loadMap.Icon({
image:
"https://img20.360buyimg.com/n1/jfs/t1/98676/8/28819/96905/62e1e96eE69561497/0e201e39d6d1c1e3.png",
imageSize: [30, 30],
}),
title: title,
});
var content = [
"<div><b>站点名称 :" + title + "</b>",
// "职位 : " + users.pos_held,
// "电话 : " + users.tel,
"</div>",
];
var infoWindow = new MapUtl.loadMap.InfoWindow({
offset: new MapUtl.loadMap.Pixel(0, -30),
autoMove: true,
content: content.join("<br/>"),
});
marker.on("click", (e) => {
infoWindow.open(MapUtl.amap, e.target.getPosition());
});
MapUtl.amap?.add(marker);
}
static setMakericon = (maker) => {
maker.setPosition([103.55, 30.342]);
var m = MapUtl.amap;
@ -79,6 +106,19 @@ class MapUtl {
static getWecher() {
}
// 百度转高德
static bdConvertGd(coordinate) {
var bd_lng = coordinate[0];
var bd_lat = coordinate[1];
var pi = 3.14159265358979324 * 3000.0 / 180.0;
var x = bd_lng - 0.0065;
var y = bd_lat - 0.006;
var z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * pi);
var theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * pi);
var gd_lng = z * Math.cos(theta);
var gd_lat = z * Math.sin(theta);
return [gd_lng, gd_lat];
}
}
export default MapUtl;

3
src/pages/OrgChart.tsx
View File

@ -85,6 +85,7 @@ const OrgChartSelf = (props: Store) => {
{v.depId === 1 ? (
<div className="userNameCont">
{v.users?.map((v1, _) => {
console.log(v1);
return (
<div key={v1.user_name} className="userNmaeBox">
<img
@ -94,7 +95,7 @@ const OrgChartSelf = (props: Store) => {
backgroundColor: "#fff",
}}
width={50}
src="https://pic.aigexing.net/uploads/5/1253/3721116011/92968290915/8785297.jpg"
src={v1.headImg}
alt=""
/>
<span className="userNmae">{v1.user_name}</span>

147
src/pages/home/homeLeft/turn.tsx
View File

@ -13,6 +13,17 @@ const Turn = (props: Store) => {
const [imageUrl, setImageUrl] = useState<any>([]);
const [taskId, setTaskId] = useState<any>([]);
const [folderId, setFolderId] = useState<any>([]);
const getFileTypeFromUrl = (url) => {
console.log(url);
if (url === "" || url.length === 0) return;
// 解析URL以提取文件名
const filename = url.split("/").pop();
// 获取文件扩展名
const fileExtension = filename.split(".").pop();
// 返回文件扩展名
return fileExtension;
};
const initChart = (data) => {
var myChart = echarts.init(document.getElementById("xunlian"));
@ -45,7 +56,67 @@ const Turn = (props: Store) => {
setImageList(folderStore.alist ?? []);
});
};
const imageWidget = (item) => {
return (
<img
onClick={() => {
setImageUrl(item.file_url);
}}
key={item.identity}
style={{ width: "80px", height: "80px" }}
src={item.file_url}
alt=""
/>
);
};
const preView = () => {
let fileType = getFileTypeFromUrl(imageUrl);
switch (fileType) {
case "jpeg":
return <img style={{ width: "100%" }} src={imageUrl} alt="" />;
case "jpg":
return <img style={{ width: "100%" }} src={imageUrl} alt="" />;
case "png":
return <img style={{ width: "100%" }} src={imageUrl} alt="" />;
case "pdf":
return (
<div style={{ width: "100%", height: "500px" }}>
<iframe
style={{ width: "100%", height: "500px" }}
src={imageUrl}
title="描述"
></iframe>
;
</div>
);
case "mp4":
return (
<div style={{ width: "100%", height: "600px" }}>
<video
controls
style={{ width: "100%", height: "600px" }}
src={imageUrl}
></video>
</div>
);
case "docx":
return (
<div style={{ width: "100%", height: "600px" }}>
<iframe
style={{ width: "100%", height: "600px" }}
src={imageUrl}
title="描述"
></iframe>
;
</div>
);
case "":
return <div style={{ width: "100%", height: "600px" }}></div>;
default:
return <div style={{ width: "100%", height: "600px" }}></div>;
}
};
return (
<>
<div
@ -56,7 +127,7 @@ const Turn = (props: Store) => {
<Modal
title="年度训练"
className="owner_model"
width={1200}
width={1100}
open={isModalOpen}
afterClose={() => {}}
onOk={() => {}}
@ -68,7 +139,7 @@ const Turn = (props: Store) => {
<>
<Row>
<Col span={2}>
<div style={{ color: "#fff", margin: "10px" }}>
<div style={{ color: "#fff" }}>
<p>任务列表</p>
{trainingStore.list?.map((item) => {
return (
@ -90,17 +161,18 @@ const Turn = (props: Store) => {
</div>
</Col>
<Col span={2}>
<div style={{ color: "#fff", margin: "10px" }}>
<div style={{ color: "#fff" }}>
<p>文件夹列表</p>
{folderList?.map((item) => {
return (
<p
key={item.identity}
style={{
color: folderId === item.identity ? "blue" : "#fff",
cursor: "pointer",
}}
onClick={() => {
setFolderId(item.identity)
setFolderId(item.identity);
getAehandler(item.identity);
}}
>
@ -111,29 +183,78 @@ const Turn = (props: Store) => {
</div>
</Col>
<Col span={2}>
<div style={{ color: "#fff", margin: "10px" }}>
<div style={{ color: "#fff" }}>
<p>档案列表</p>
{imageList?.map((item) => {
let fileType = getFileTypeFromUrl(item.file_url);
switch (fileType) {
case "png":
return imageWidget(item);
case "jpeg":
return imageWidget(item);
case "jpg":
return imageWidget(item);
case "pdf":
return (
<p
style={{ cursor: "pointer" }}
onClick={() => {
setImageUrl(item.file_url);
}}
>
{item.file_name}
</p>
);
case "mp4":
return (
<p
style={{ cursor: "pointer" }}
onClick={() => {
setImageUrl(item.file_url);
}}
>
{item.file_name}
</p>
);
case "docx":
return (
<p
style={{ cursor: "pointer" }}
onClick={() => {
setImageUrl(item.file_url);
}}
>
{item.file_name}
</p>
);
default:
return (
<img
onClick={() => {
setImageUrl(item.file_url);
}}
style={{ width: "80px", height: "80px" }}
key={item.identity}
style={{ width: "80px" }}
src={item.file_url}
alt=""
/>
);
}
})}
</div>
</Col>
<Col span={18}>
<div style={{ color: "#fff" }}>
<img
style={{ width: "100%", height: "800px" }}
src={imageUrl}
alt=""
/>
<Col span={16}>
<div
style={{
color: "#fff",
margin: "10px",
width: "100%",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
{preView()}
</div>
</Col>
</Row>

23
src/pages/org_config.ts
View File

@ -1,17 +1,22 @@
const bz = require("@/static/user_head/刘先良.webp")
const jdy = require("@/static/user_head/晏巍.png")
export const orgData = [
{
dep_name: "镇武装部党委",
depId: 1,
users: [
{
position: "武装部长",
user_name: "李部长",
userId: 1,
},
{
position: "教导员",
user_name: "王教导",
user_name: "晏 巍",
userId: 2,
headImg:jdy
},
{
position: "武装部长",
user_name: "刘先良",
userId: 1,
headImg:bz
},
],
children: [
@ -94,7 +99,7 @@ export const orgData = [
users: [
{
position: "文武社区支部书记",
user_name: "书记名称",
user_name: "袁建强",
userId: 3,
},
],
@ -170,7 +175,7 @@ export const orgData = [
users: [
{
position: "花龙村支部书记",
user_name: "书记名称",
user_name: "肖冬",
userId: 4,
},
],
@ -235,7 +240,7 @@ export const orgData = [
users: [
{
position: "云华社区支部书记",
user_name: "书记名称",
user_name: "黄忠",
userId: 5,
},
],

4
src/pages/poverPage/pvTable.tsx
View File

@ -52,7 +52,9 @@ const PvTable = (props: Store) => {
<tbody>
{usrStore.list?.map((us,i) => {
return (
<tr onClick={(e) => {
<tr
key={us.id}
onClick={(e) => {
usrStore.setUserDetaul(us)
usrStore.setPoverDe(true)
}}>

BIN
src/static/user_head/刘先良.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
src/static/user_head/晏巍.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 140 KiB

4
src/store/baseStore.ts
View File

@ -44,8 +44,6 @@ class BaseStore<B> implements BaseStoreInterface<B> {
}
// 分页
setPages(page: Pages) {
console.log(page);
this.page = page
this.getlist()
}
@ -72,7 +70,6 @@ class BaseStore<B> implements BaseStoreInterface<B> {
message.error(res.msg)
return false
}
this.getlist(listParam)
return true;
} catch (error) {
@ -83,7 +80,6 @@ class BaseStore<B> implements BaseStoreInterface<B> {
// 获取列表
async getlist(params?: any) {
this.listStatus = true;
console.log(this.page);
try {
let res = await baseHttp.get(this.urlConfig.LIST, {
size: this.page?.Size ?? 20,

1091
src/store/map.ts Normal file
View File

File diff suppressed because it is too large Load Diff

1
src/util/config.ts
View File

@ -6,6 +6,7 @@ class Config {
// static ws = "ws://127.0.0.1:12214/ws?id=admin";
// static baseUrl = "http://127.0.0.1:12214/";
// static uploadUrl = "http://127.0.0.1:12214/";
}
export default Config;