提交 e6f01a89 作者: 翁进城

打包前优化

上级 f2e35d4e
...@@ -14,15 +14,6 @@ export function useUser() { ...@@ -14,15 +14,6 @@ export function useUser() {
useEffect(() => { useEffect(() => {
setUserAccountId(Number(window.localStorage.getItem('userId'))); setUserAccountId(Number(window.localStorage.getItem('userId')));
window.setUserId = (id) => {
setUserAccountId(id);
window.localStorage.setItem('userId', id);
};
//退出登录
window.logout = () => {
window.setUserId('');
}
try { try {
let userInfo = JSON.parse(window.localStorage.getItem('userInfo') || '') || null; let userInfo = JSON.parse(window.localStorage.getItem('userInfo') || '') || null;
......
...@@ -6,106 +6,102 @@ import api, { Flying, SkillsType, RegionResp } from "../../../api"; ...@@ -6,106 +6,102 @@ import api, { Flying, SkillsType, RegionResp } from "../../../api";
interface BrushQuestionZoneType { interface BrushQuestionZoneType {
} }
export default function index() { export default function BrushQuestionZone() {
const [secondDistrictInfo, setSecondDistrictInfo] = useState( const [secondDistrictInfo, setSecondDistrictInfo] = useState(
Array<RegionResp> Array<RegionResp>
); );
const [skills, setSkills] = useState( const [skills, setSkills] = useState(Array<RegionResp>);
Array<RegionResp> const [flightSkillsList, setFlightSkillsList] = useState(Array<SkillsType>);
);
const [flightSkillsList, setFlightSkillsList] = useState(Array<SkillsType>);
const [list,setList] = useState<Array<BrushQuestionZoneType>>() const [list, setList] = useState<Array<BrushQuestionZoneType>>();
const handleChange = (value: string) => { const handleChange = (value: string) => {
console.log(`selected ${value}`); console.log(`selected ${value}`);
}; };
useEffect(() => { useEffect(() => {
setList([{},{},{},{},{},{}]) setList([{}, {}, {}, {}, {}, {}]);
api.region().then((res) => { api.region().then((res) => {
setSecondDistrictInfo(res.result || []); setSecondDistrictInfo(res.result || []);
}); });
api.PilotLicense().then((res) => { api.PilotLicense().then((res) => {
setSkills(res.result || []); setSkills(res.result || []);
}); });
api.IndustryFlightSkills().then((res) => { api.IndustryFlightSkills().then((res) => {
const list = res.result?.map((item)=>{ const list = res.result?.map((item) => {
item.label = item.skillsName item.label = item.skillsName;
item.value = item.id item.value = item.id;
return item return item;
}) });
setFlightSkillsList(list || []); setFlightSkillsList(list || []);
}); });
}, []); }, []);
return ( return (
<Box> <Box>
<div className="title"> <div className="title">
<Cascader <Cascader
allowClear allowClear
placeholder="地域" placeholder="地域"
className="selectItem" className="selectItem"
size="large" size="large"
fieldNames={{ fieldNames={{
label: "name", label: "name",
value: "id", value: "id",
children: "childInfo", children: "childInfo",
}} }}
options={secondDistrictInfo} options={secondDistrictInfo}
// onChange={onChange} // onChange={onChange}
changeOnSelect changeOnSelect
/> />
<Cascader <Cascader
allowClear allowClear
placeholder="考证" placeholder="考证"
className="selectItem" className="selectItem"
size="large" size="large"
fieldNames={{ fieldNames={{
label: "licenseType", label: "licenseType",
value: "id", value: "id",
children: "childLicenses", children: "childLicenses",
}} }}
options={skills} options={skills}
// onChange={onChange} // onChange={onChange}
changeOnSelect changeOnSelect
/> />
<Select <Select
className="selectItem" className="selectItem"
popupMatchSelectWidth={false} popupMatchSelectWidth={false}
placeholder="技能" placeholder="技能"
size="large" size="large"
// onChange={(value) => onProvinceChange(value, "技能")} // onChange={(value) => onProvinceChange(value, "技能")}
options={flightSkillsList} options={flightSkillsList}
fieldNames={{ value: "id", label: "skillsName" }} fieldNames={{ value: "id", label: "skillsName" }}
allowClear allowClear
/> />
<Cascader <Cascader
allowClear allowClear
placeholder="选择课程" placeholder="选择课程"
className="selectItem" className="selectItem"
style={{width:200}} style={{ width: 200 }}
size="large" size="large"
fieldNames={{ fieldNames={{
label: "name", label: "name",
value: "id", value: "id",
children: "childInfo", children: "childInfo",
}} }}
options={secondDistrictInfo} options={secondDistrictInfo}
// onChange={onChange} // onChange={onChange}
changeOnSelect changeOnSelect
/> />
</div> </div>
<div className="content"> <div className="content">
{ {list?.map((item, i) => (
list?.map(item=>( <div key={i} className="item">
<div className='item'> <div className="img-box"></div>
<div className='img-box'></div> <div className="item-content">
<div className='item-content'> 第一章 第1节 习题练习习题练习习题练习
第一章 第1节 习题练习习题练习习题练习 </div>
</div> </div>
</div> ))}
)) </div>
}
</div>
</Box> </Box>
) );
} }
...@@ -5,31 +5,28 @@ interface MockExamType { ...@@ -5,31 +5,28 @@ interface MockExamType {
} }
export default function index() { export default function MockExam() {
const [list, setList] = useState<Array<MockExamType>>();
const [list,setList] = useState<Array<MockExamType>>() useEffect(() => {
setList([{}, {}, {}, {}, {}, {}]);
useEffect(()=>{ }, []);
setList([{},{},{},{},{},{}])
},[])
return ( return (
<Box> <Box>
<div className="content"> <div className="content">
{ {list?.map((item, i) => (
list?.map(item=>( <div key={i} className="item">
<div className='item'> <div className="img-box"></div>
<div className='img-box'></div> <div className="item-content">
<div className='item-content'> <div className="top">云飞手行业认证考核</div>
<div className="top">云飞手行业认证考核</div> <div className="bottom">
<div className="bottom"> <div className="user-img"></div>
<div className="user-img"></div> <div className="application">77人报名</div>
<div className="application">77人报名</div> </div>
</div> </div>
</div> </div>
</div> ))}
)) </div>
}
</div>
</Box> </Box>
) );
} }
...@@ -14,7 +14,7 @@ interface UserInfoType { ...@@ -14,7 +14,7 @@ interface UserInfoType {
pageSize?:number pageSize?:number
} }
export default function index() { export default function MoreServicePoints() {
const [mapItem, setMapItem] = useState(0); const [mapItem, setMapItem] = useState(0);
const [userPositioning, setUserPositioning] = useState<UserInfoType>(); const [userPositioning, setUserPositioning] = useState<UserInfoType>();
const [markerCol, setMarkerCol] = useState<any>([]); const [markerCol, setMarkerCol] = useState<any>([]);
...@@ -25,13 +25,13 @@ export default function index() { ...@@ -25,13 +25,13 @@ export default function index() {
const AMapLoader = await import( const AMapLoader = await import(
/* webpackChunkName: "amap" */ "@amap/amap-jsapi-loader" /* webpackChunkName: "amap" */ "@amap/amap-jsapi-loader"
); );
await AMapLoader.load({ await AMapLoader.load({
key: "87b424e68754efc3ba9d11ae07475091", // 申请好的Web端开发者Key,首次调用 load 时必填 key: "87b424e68754efc3ba9d11ae07475091", // 申请好的Web端开发者Key,首次调用 load 时必填
version: "2.0", // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15 version: "2.0", // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
plugins: [""], // 需要使用的的插件列表,如比例尺'AMap.Scale'等 plugins: [""], // 需要使用的的插件列表,如比例尺'AMap.Scale'等
}) })
.then(async (AMap) => { .then(async (AMap) => {
Amap = AMap Amap = AMap;
MAP = new AMap.Map("container", { MAP = new AMap.Map("container", {
// 设置地图容器id // 设置地图容器id
viewMode: "3D", // 是否为3D地图模式 viewMode: "3D", // 是否为3D地图模式
...@@ -39,40 +39,42 @@ export default function index() { ...@@ -39,40 +39,42 @@ export default function index() {
center: [113.93029, 22.53291], // 初始化地图中心点位置 center: [113.93029, 22.53291], // 初始化地图中心点位置
}); });
//用户定位 //用户定位
AMap.plugin('AMap.Geolocation', function() { AMap.plugin("AMap.Geolocation", function () {
const geolocation = new AMap.Geolocation({ const geolocation = new AMap.Geolocation({
enableHighAccuracy: true,//是否使用高精度定位,默认:true enableHighAccuracy: true, //是否使用高精度定位,默认:true
timeout: 10000, //超过10秒后停止定位,默认:5s timeout: 10000, //超过10秒后停止定位,默认:5s
position:'RB', //定位按钮的停靠位置 position: "RB", //定位按钮的停靠位置
offset: [10, 20], //定位按钮与设置的停靠位置的偏移量,默认:[10, 20] offset: [10, 20], //定位按钮与设置的停靠位置的偏移量,默认:[10, 20]
zoomToAccuracy: true, //定位成功后是否自动调整地图视野到定位点 zoomToAccuracy: true, //定位成功后是否自动调整地图视野到定位点
}); });
MAP.addControl(geolocation); MAP.addControl(geolocation);
geolocation.getCurrentPosition(function(status:string,result:any){ geolocation.getCurrentPosition(function (
status: string,
result: any
) {
console.log(result); console.log(result);
if(status=='complete'){ if (status == "complete") {
onComplete(result) onComplete(result);
}else{ } else {
onError(result) onError(result);
} }
}); });
}); });
//解析定位结果 //解析定位结果
async function onComplete(data:any) { async function onComplete(data: any) {
console.log('定位成功'); console.log("定位成功");
setUserPositioning(data.position) setUserPositioning(data.position);
// return await mapEntiy(0,data.position); // return await mapEntiy(0,data.position);
} }
//解析定位错误信息 //解析定位错误信息
async function onError(data:any) { async function onError(data: any) {
// message.error(`定位失败 // message.error(`定位失败
// 失败原因排查信息:${data.message} // 失败原因排查信息:${data.message}
// 浏览器返回信息:${data.originMessage} // 浏览器返回信息:${data.originMessage}
// `) // `)
} }
await mapEntiy(0) await mapEntiy(0);
}) })
.catch((e) => { .catch((e) => {
console.log(e); console.log(e);
...@@ -81,7 +83,7 @@ export default function index() { ...@@ -81,7 +83,7 @@ export default function index() {
console.log(error); console.log(error);
} }
}; };
const showPositioningInfo = async (index:number,data?:UserInfoType) => { const showPositioningInfo = async (index: number, data?: UserInfoType) => {
const res = await api.listPositioningInfo({ const res = await api.listPositioningInfo({
lon: userPositioning?.lon || data?.lon || 113.93029, lon: userPositioning?.lon || data?.lon || 113.93029,
lat: userPositioning?.lat || data?.lat || 22.53291, lat: userPositioning?.lat || data?.lat || 22.53291,
...@@ -96,96 +98,103 @@ export default function index() { ...@@ -96,96 +98,103 @@ export default function index() {
const EntiyValue = addEntiy(item.jd, item.wd, item.dizhi); const EntiyValue = addEntiy(item.jd, item.wd, item.dizhi);
markerList.push(EntiyValue); markerList.push(EntiyValue);
}); });
setServicePoints(list) setServicePoints(list);
if(markerList.length) MAP?.add(markerList);setMarkerCol([...markerList]); if (markerList.length) MAP?.add(markerList);
setMarkerCol([...markerList]);
} }
} };
const showFlyerBitmap = async (index:number,data?:UserInfoType,pageSize?:number) => { const showFlyerBitmap = async (
index: number,
data?: UserInfoType,
pageSize?: number
) => {
const res = await api.listFlyerBitmap({ const res = await api.listFlyerBitmap({
lon: userPositioning?.lon || data?.lon || 113.93029, lon: userPositioning?.lon || data?.lon || 113.93029,
lat: userPositioning?.lat || data?.lat || 22.53291, lat: userPositioning?.lat || data?.lat || 22.53291,
pageNo:1, pageNo: 1,
pageSize: pageSize || 40 pageSize: pageSize || 40,
}); });
const list = res.result?.list const list = res.result?.list;
const markerList: any = []; const markerList: any = [];
if (list?.length) { if (list?.length) {
list?.map((item) => { list?.map((item) => {
const EntiyValue = addEntiy(item.lon, item.lat, item.flyerName); const EntiyValue = addEntiy(item.lon, item.lat, item.flyerName);
markerList.push(EntiyValue); markerList.push(EntiyValue);
}); });
setServicePoints(list) setServicePoints(list);
if(markerList.length) MAP?.add(markerList);setMarkerCol(markerList) if (markerList.length) MAP?.add(markerList);
setMarkerCol(markerList);
} }
} };
const showUavBitmap = async (index:number,data?:UserInfoType) => { const showUavBitmap = async (index: number, data?: UserInfoType) => {
console.log(MAP.panTo); console.log(MAP.panTo);
const res = await api.listUavBitmap({ const res = await api.listUavBitmap({
lon: userPositioning?.lon || data?.lon || 113.93029, lon: userPositioning?.lon || data?.lon || 113.93029,
lat: userPositioning?.lat || data?.lat || 22.53291, lat: userPositioning?.lat || data?.lat || 22.53291,
pageNo:1, pageNo: 1,
pageSize: 40 pageSize: 40,
}); });
const list = res.result?.list const list = res.result?.list;
const markerList: any = []; const markerList: any = [];
if (list?.length) { if (list?.length) {
list?.map((item) => { list?.map((item) => {
const EntiyValue = addEntiy(item.lon, item.lat, item.uavName); const EntiyValue = addEntiy(item.lon, item.lat, item.uavName);
markerList.push(EntiyValue); markerList.push(EntiyValue);
}); });
setServicePoints(list) setServicePoints(list);
if(markerList.length) MAP?.add(markerList);setMarkerCol(markerList) if (markerList.length) MAP?.add(markerList);
setMarkerCol(markerList);
}
};
//添加点位
const mapEntiy = async (index: number, data?: UserInfoType) => {
MAP?.remove(markerCol);
if (userPositioning) {
MAP?.setCenter([userPositioning.lon, userPositioning.lat]);
}
if (index === 0) {
showPositioningInfo(index, data);
} else if (index === 1) {
showFlyerBitmap(index, data, 30);
} else if (index === 2) {
showUavBitmap(index, data);
} else {
showFlyerBitmap(index, data, 30);
} }
} setMapItem(index);
//添加点位 };
const mapEntiy = async (index: number,data?:UserInfoType) => {
MAP?.remove(markerCol); const addEntiy = (lon: any, lat: any, name: string) => {
if (userPositioning) { if (!Amap) return;
MAP?.setCenter([userPositioning.lon, userPositioning.lat]); const icons = new Amap.Icon({
} size: new Amap.Size(60, 60), // 图标尺寸
if (index === 0) { image: icon.src, // Icon的图像
showPositioningInfo(index,data) imageSize: new Amap.Size(60, 60), // 根据所设置的大小拉伸或压缩图片
}else if (index === 1) {
showFlyerBitmap(index,data,30)
} else if(index === 2) {
showUavBitmap(index,data)
}else{
showFlyerBitmap(index,data,30)
}
setMapItem(index);
};
const addEntiy = ( lon: any, lat: any, name: string) => {
if (!Amap) return;
const icons = new Amap.Icon({
size: new Amap.Size(60, 60), // 图标尺寸
image: icon.src, // Icon的图像
imageSize: new Amap.Size(60, 60) // 根据所设置的大小拉伸或压缩图片
}); });
const marker = new Amap.Marker({ const marker = new Amap.Marker({
position: new Amap.LngLat(lon, lat), position: new Amap.LngLat(lon, lat),
offset: new Amap.Pixel(-10, -10), offset: new Amap.Pixel(-10, -10),
icon: icons, // 添加 Icon 实例 icon: icons, // 添加 Icon 实例
title: name, title: name,
zoom: 13 zoom: 13,
}); });
return marker; return marker;
}; };
const moveTo = (item: any) => {
console.log(markerCol);
const moveTo = (item:any) => { if (item.dizhi) {
console.log(markerCol); return MAP?.setCenter([item.jd, item.wd]);
} else if (item.flyerName || item.uavName) {
if (item.dizhi) { return MAP?.setCenter([item.lon, item.lat]);
return MAP?.setCenter([item.jd, item.wd]);
}else if (item.flyerName || item.uavName) {
return MAP?.setCenter([item.lon, item.lat]);
}
return message.warning("暂无位置信息")
} }
return message.warning("暂无位置信息");
};
useEffect(() => { useEffect(() => {
(async () => { (async () => {
await init(); await init();
})(); })();
return MAP && MAP.destroy(); return MAP && MAP.destroy();
}, []); }, []);
...@@ -193,23 +202,46 @@ export default function index() { ...@@ -193,23 +202,46 @@ export default function index() {
return ( return (
<Layout> <Layout>
<Box> <Box>
<div className='title'> <div className="title">
<div onClick={() => mapEntiy(0)} className={`item ${mapItem === 0 ? "active" : ""}`}>服务网点</div> <div
<div onClick={() => mapEntiy(1)} className={`item ${mapItem === 1 ? "active" : ""}`}>租赁网点</div> onClick={() => mapEntiy(0)}
<div onClick={() => mapEntiy(2)} className={`item ${mapItem === 2 ? "active" : ""}`}>培训网点</div> className={`item ${mapItem === 0 ? "active" : ""}`}
<div onClick={() => mapEntiy(3)} className={`item ${mapItem === 3 ? "active" : ""}`}>机构网点</div> >
服务网点
</div>
<div
onClick={() => mapEntiy(1)}
className={`item ${mapItem === 1 ? "active" : ""}`}
>
租赁网点
</div>
<div
onClick={() => mapEntiy(2)}
className={`item ${mapItem === 2 ? "active" : ""}`}
>
培训网点
</div>
<div
onClick={() => mapEntiy(3)}
className={`item ${mapItem === 3 ? "active" : ""}`}
>
机构网点
</div>
</div> </div>
<div className='content'> <div className="content">
<div className="left"> <div className="left">
<div className="left-title">服务网点</div> <div className="left-title">服务网点</div>
<div className="left-content"> <div className="left-content">
{ {servicePoints.map((item: any) => (
servicePoints.map((item:any)=>( <div
<div onClick={()=>moveTo(item)} className="left-content-item" title={item.dizhi || item.flyerName || item.uavName}> key={item.id}
{item.dizhi || item.flyerName || item.uavName} onClick={() => moveTo(item)}
</div> className="left-content-item"
)) title={item.dizhi || item.flyerName || item.uavName}
} >
{item.dizhi || item.flyerName || item.uavName}
</div>
))}
</div> </div>
</div> </div>
<div className="right"> <div className="right">
...@@ -218,5 +250,5 @@ export default function index() { ...@@ -218,5 +250,5 @@ export default function index() {
</div> </div>
</Box> </Box>
</Layout> </Layout>
) );
} }
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论