mirror of
https://gitee.com/beecue/fastbee.git
synced 2025-12-18 00:45:55 +08:00
大屏展示
This commit is contained in:
孙阿龙
75
vue/src/utils/bigScreen/drawMixin.js
Normal file
75
vue/src/utils/bigScreen/drawMixin.js
Normal file
@@ -0,0 +1,75 @@
|
||||
/*
|
||||
* @Author: daidai
|
||||
* @Date: 2022-02-28 10:48:02
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @LastEditTime: 2022-04-26 14:55:41
|
||||
* @FilePath: \web-pc\src\pages\big-screen\utils\drawMixin.js
|
||||
*/
|
||||
// 屏幕适配 mixin 函数
|
||||
|
||||
// * 默认缩放值
|
||||
const scale = {
|
||||
width: '1',
|
||||
height: '1',
|
||||
}
|
||||
|
||||
// * 设计稿尺寸（px）
|
||||
const baseWidth = 1920
|
||||
const baseHeight = 1080
|
||||
|
||||
// * 需保持的比例（默认1.77778）
|
||||
const baseProportion = parseFloat((baseWidth / baseHeight).toFixed(5))
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// * 定时函数
|
||||
drawTiming: null,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isScale(){
|
||||
return this.$store.state.settings.isScale
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
if(!this.isScale){
|
||||
return
|
||||
}
|
||||
this.calcRate()
|
||||
window.addEventListener('resize', this.resize)
|
||||
},
|
||||
beforeDestroy () {
|
||||
window.removeEventListener('resize', this.resize)
|
||||
},
|
||||
methods: {
|
||||
calcRate () {
|
||||
const appRef = this.$refs["appRef"]
|
||||
if (!appRef) return
|
||||
// 当前宽高比
|
||||
const currentRate = parseFloat((window.innerWidth / window.innerHeight).toFixed(5))
|
||||
if (appRef) {
|
||||
if (currentRate > baseProportion) {
|
||||
// 表示更宽
|
||||
scale.width = ((window.innerHeight * baseProportion) / baseWidth).toFixed(5)
|
||||
scale.height = (window.innerHeight / baseHeight).toFixed(5)
|
||||
appRef.style.transform = `scale(${scale.width}, ${scale.height}) translate(-50%, -50%)`
|
||||
} else {
|
||||
// 表示更高
|
||||
scale.height = ((window.innerWidth / baseProportion) / baseHeight).toFixed(5)
|
||||
scale.width = (window.innerWidth / baseWidth).toFixed(5)
|
||||
appRef.style.transform = `scale(${scale.width}, ${scale.height}) translate(-50%, -50%)`
|
||||
}
|
||||
}
|
||||
},
|
||||
resize () {
|
||||
if(!this.isScale){
|
||||
return
|
||||
}
|
||||
clearTimeout(this.drawTiming)
|
||||
this.drawTiming = setTimeout(() => {
|
||||
this.calcRate()
|
||||
}, 200)
|
||||
}
|
||||
},
|
||||
}
|
||||
58
vue/src/utils/bigScreen/index.js
Normal file
58
vue/src/utils/bigScreen/index.js
Normal file
@@ -0,0 +1,58 @@
|
||||
/*
|
||||
* @Author: daidai
|
||||
* @Date: 2022-02-23 08:59:26
|
||||
* @LastEditors: daidai
|
||||
* @LastEditTime: 2022-02-24 17:11:58
|
||||
* @FilePath: \big-screen-vue-datav\src\utils\index.js
|
||||
*/
|
||||
|
||||
/**
|
||||
* @param {Function} fn 防抖函数
|
||||
* @param {Number} delay 延迟时间
|
||||
*/
|
||||
export function debounce(fn, delay) {
|
||||
var timer;
|
||||
return function () {
|
||||
var context = this;
|
||||
var args = arguments;
|
||||
clearTimeout(timer);
|
||||
timer = setTimeout(function () {
|
||||
fn.apply(context, args);
|
||||
}, delay);
|
||||
};
|
||||
}
|
||||
/**
|
||||
* @param {date} time 需要转换的时间
|
||||
* @param {String} fmt 需要转换的格式 如 yyyy-MM-dd、yyyy-MM-dd HH:mm:ss
|
||||
*/
|
||||
export function formatTime(time, fmt) {
|
||||
if (!time) return '';
|
||||
else {
|
||||
const date = new Date(time);
|
||||
const o = {
|
||||
'M+': date.getMonth() + 1,
|
||||
'd+': date.getDate(),
|
||||
'H+': date.getHours(),
|
||||
'm+': date.getMinutes(),
|
||||
's+': date.getSeconds(),
|
||||
'q+': Math.floor((date.getMonth() + 3) / 3),
|
||||
S: date.getMilliseconds(),
|
||||
};
|
||||
if (/(y+)/.test(fmt))
|
||||
fmt = fmt.replace(
|
||||
RegExp.$1,
|
||||
(date.getFullYear() + '').substr(4 - RegExp.$1.length)
|
||||
);
|
||||
for (const k in o) {
|
||||
if (new RegExp('(' + k + ')').test(fmt)) {
|
||||
fmt = fmt.replace(
|
||||
RegExp.$1,
|
||||
RegExp.$1.length === 1
|
||||
? o[k]
|
||||
: ('00' + o[k]).substr(('' + o[k]).length)
|
||||
);
|
||||
}
|
||||
}
|
||||
return fmt;
|
||||
}
|
||||
}
|
||||
1
vue/src/utils/bigScreen/map/china.json
Normal file
1
vue/src/utils/bigScreen/map/china.json
Normal file
File diff suppressed because one or more lines are too long
217
vue/src/utils/bigScreen/map/xzqCode.js
Normal file
217
vue/src/utils/bigScreen/map/xzqCode.js
Normal file
@@ -0,0 +1,217 @@
|
||||
/*
|
||||
* @Author: daidai
|
||||
* @Date: 2022-03-02 09:51:44
|
||||
* @LastEditors: daidai
|
||||
* @LastEditTime: 2022-03-02 09:51:45
|
||||
* @FilePath: \web-pc\src\pages\big-screen\utils\map\xzqCode.js
|
||||
*/
|
||||
//获取中国行政区 code
|
||||
// AMap.plugin("AMap.DistrictSearch", function () {
|
||||
// var districtSearch = new AMap.DistrictSearch({
|
||||
// // 关键字对应的行政区级别，country表示国家
|
||||
// level: "country",
|
||||
// // 显示下级行政区级数，1表示返回下一级行政区
|
||||
// subdistrict: 1,
|
||||
// });
|
||||
// let xzqCode = {};
|
||||
// // 搜索所有省/直辖市信息
|
||||
// districtSearch.search("中国", function (status, result) {
|
||||
// // console.log(result);
|
||||
// result.districtList[0].districtList.forEach((item) => {
|
||||
// // console.log(item);
|
||||
// xzqCode[item.name] = {
|
||||
// adcode: item.adcode,
|
||||
// level: item.level,
|
||||
// name: item.name,
|
||||
// };
|
||||
// });
|
||||
// });
|
||||
// xzqCode["中国"] = {
|
||||
// adcode: "100000",
|
||||
// level: "country",
|
||||
// name: "中华人民共和国",
|
||||
// };
|
||||
// setTimeout(() => {
|
||||
// console.log(JSON.stringify(xzqCode),);
|
||||
|
||||
// }, 1000);
|
||||
// });
|
||||
|
||||
|
||||
export default {
|
||||
"中国": {
|
||||
"adcode": "100000",
|
||||
"level": "country",
|
||||
"name": "中华人民共和国"
|
||||
},
|
||||
"新疆维吾尔自治区": {
|
||||
"adcode": "650000",
|
||||
"level": "province",
|
||||
"name": "新疆维吾尔自治区"
|
||||
},
|
||||
"湖北省": {
|
||||
"adcode": "420000",
|
||||
"level": "province",
|
||||
"name": "湖北省"
|
||||
},
|
||||
"辽宁省": {
|
||||
"adcode": "210000",
|
||||
"level": "province",
|
||||
"name": "辽宁省"
|
||||
},
|
||||
"广东省": {
|
||||
"adcode": "440000",
|
||||
"level": "province",
|
||||
"name": "广东省"
|
||||
},
|
||||
"内蒙古自治区": {
|
||||
"adcode": "150000",
|
||||
"level": "province",
|
||||
"name": "内蒙古自治区"
|
||||
},
|
||||
"黑龙江省": {
|
||||
"adcode": "230000",
|
||||
"level": "province",
|
||||
"name": "黑龙江省"
|
||||
},
|
||||
"河南省": {
|
||||
"adcode": "410000",
|
||||
"level": "province",
|
||||
"name": "河南省"
|
||||
},
|
||||
"山东省": {
|
||||
"adcode": "370000",
|
||||
"level": "province",
|
||||
"name": "山东省"
|
||||
},
|
||||
"陕西省": {
|
||||
"adcode": "610000",
|
||||
"level": "province",
|
||||
"name": "陕西省"
|
||||
},
|
||||
"贵州省": {
|
||||
"adcode": "520000",
|
||||
"level": "province",
|
||||
"name": "贵州省"
|
||||
},
|
||||
"上海市": {
|
||||
"adcode": "310000",
|
||||
"level": "province",
|
||||
"name": "上海市"
|
||||
},
|
||||
"重庆市": {
|
||||
"adcode": "500000",
|
||||
"level": "province",
|
||||
"name": "重庆市"
|
||||
},
|
||||
"西藏自治区": {
|
||||
"adcode": "540000",
|
||||
"level": "province",
|
||||
"name": "西藏自治区"
|
||||
},
|
||||
"安徽省": {
|
||||
"adcode": "340000",
|
||||
"level": "province",
|
||||
"name": "安徽省"
|
||||
},
|
||||
"福建省": {
|
||||
"adcode": "350000",
|
||||
"level": "province",
|
||||
"name": "福建省"
|
||||
},
|
||||
"湖南省": {
|
||||
"adcode": "430000",
|
||||
"level": "province",
|
||||
"name": "湖南省"
|
||||
},
|
||||
"海南省": {
|
||||
"adcode": "460000",
|
||||
"level": "province",
|
||||
"name": "海南省"
|
||||
},
|
||||
"江苏省": {
|
||||
"adcode": "320000",
|
||||
"level": "province",
|
||||
"name": "江苏省"
|
||||
},
|
||||
"青海省": {
|
||||
"adcode": "630000",
|
||||
"level": "province",
|
||||
"name": "青海省"
|
||||
},
|
||||
"广西壮族自治区": {
|
||||
"adcode": "450000",
|
||||
"level": "province",
|
||||
"name": "广西壮族自治区"
|
||||
},
|
||||
"宁夏回族自治区": {
|
||||
"adcode": "640000",
|
||||
"level": "province",
|
||||
"name": "宁夏回族自治区"
|
||||
},
|
||||
"浙江省": {
|
||||
"adcode": "330000",
|
||||
"level": "province",
|
||||
"name": "浙江省"
|
||||
},
|
||||
"河北省": {
|
||||
"adcode": "130000",
|
||||
"level": "province",
|
||||
"name": "河北省"
|
||||
},
|
||||
"香港特别行政区": {
|
||||
"adcode": "810000",
|
||||
"level": "province",
|
||||
"name": "香港特别行政区"
|
||||
},
|
||||
"台湾省": {
|
||||
"adcode": "710000",
|
||||
"level": "province",
|
||||
"name": "台湾省"
|
||||
},
|
||||
"澳门特别行政区": {
|
||||
"adcode": "820000",
|
||||
"level": "province",
|
||||
"name": "澳门特别行政区"
|
||||
},
|
||||
"甘肃省": {
|
||||
"adcode": "620000",
|
||||
"level": "province",
|
||||
"name": "甘肃省"
|
||||
},
|
||||
"四川省": {
|
||||
"adcode": "510000",
|
||||
"level": "province",
|
||||
"name": "四川省"
|
||||
},
|
||||
"天津市": {
|
||||
"adcode": "120000",
|
||||
"level": "province",
|
||||
"name": "天津市"
|
||||
},
|
||||
"江西省": {
|
||||
"adcode": "360000",
|
||||
"level": "province",
|
||||
"name": "江西省"
|
||||
},
|
||||
"云南省": {
|
||||
"adcode": "530000",
|
||||
"level": "province",
|
||||
"name": "云南省"
|
||||
},
|
||||
"山西省": {
|
||||
"adcode": "140000",
|
||||
"level": "province",
|
||||
"name": "山西省"
|
||||
},
|
||||
"北京市": {
|
||||
"adcode": "110000",
|
||||
"level": "province",
|
||||
"name": "北京市"
|
||||
},
|
||||
"吉林省": {
|
||||
"adcode": "220000",
|
||||
"level": "province",
|
||||
"name": "吉林省"
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user