66 lines
2.4 KiB
JavaScript
66 lines
2.4 KiB
JavaScript
import { Image } from "antd"
|
|
import zd from '../../../../assets/img/u0.png'
|
|
// import qys1 from '../../../../assets/img/qys1.png'
|
|
import qys1 from '../../../../assets/img/sk.jpg'
|
|
import qys2 from '../../../../assets/img/qys2.jpg'
|
|
import qys3 from '../../../../assets/img/qys3.jpg'
|
|
import qys4 from '../../../../assets/img/qys4.png'
|
|
import stylesCss from './index.module.less'
|
|
|
|
import { Rnd } from "react-rnd"
|
|
import { useState, useEffect } from "react"
|
|
const list = [
|
|
{ name: '水库地理位置图', key: 1, img: qys1 },
|
|
{ name: '水库平面布置图', key: 2, img: qys2 },
|
|
{ name: '主坝平面布置图', key: 3, img: qys3 },
|
|
{ name: '副坝平面布置图', key: 4, img: qys4 },
|
|
]
|
|
const Page = () => {
|
|
const [url, setUrl] = useState(qys1)
|
|
const tabClick = (item) => {
|
|
setUrl(item.img)
|
|
}
|
|
useEffect(() => {
|
|
// let scale = 1
|
|
// const img = document.getElementById("img");
|
|
// const fun = (e) => {
|
|
// console.log(1111)
|
|
// // 大于0:滚轮向上滚动 小于0:滚轮向下滚动
|
|
// if (e.wheelDelta > 0) {
|
|
// scale += 0.05;
|
|
// img.style.transform = `scale(${scale})`;
|
|
// } else {
|
|
// if (scale == 1) {
|
|
// img.style.left = 0 + "px";
|
|
// img.style.top = 0 + "px";
|
|
// }
|
|
// // 缩放值大于1时,可以缩小,反之亦然
|
|
// if (scale > 1) {
|
|
// scale -= 0.05;
|
|
// img.style.transform = `scale(${scale})`;
|
|
// }
|
|
// }
|
|
// }
|
|
// img.addEventListener("wheel", fun)
|
|
|
|
// // getSyData()
|
|
// // getSlData()
|
|
// // getWyData()
|
|
// // getDmData()
|
|
// return () => {
|
|
// img.removeEventListener("wheel", fun)
|
|
// }
|
|
|
|
}, [])
|
|
return (
|
|
<div style={{ backgroundColor: '#fff', height: '100%' }}>
|
|
<div style={{ display: 'flex', justifyContent: 'start', alignItems: 'center', padding: 10 }}>
|
|
{list.map(item => <div className={url == item.img ? stylesCss.active : stylesCss.tabCheck} onClick={() => tabClick(item)}>{item.name}</div>)}
|
|
</div>
|
|
<div style={{height: 'calc(100% - 60px)',textAlign:'center',padding:20,overflow:'auto'}}>
|
|
<Image src={url} width='80%' preview={false} />
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
export default Page |