上传代码

.env.development

@@ -0,0 +1,15 @@
+# 页面标题
+VUE_APP_TITLE = 河北邯港高速
+
+# 开发环境配置
+ENV = 'development'
+
+# 若依管理系统/开发环境
+VITE_APP_BASE_API=/dev-api
+VITE_APP_CONTROL_BASE_API=/control-api
+VUE_APP_MONITOR_URL='http://172.16.1.147:8083/cn/demo.html'
+VUE_LOGIN_USERNAME = 'admin'
+VUE_LOGIN_PASSWORD = 'admin123'
+
+# 路由懒加载
+VUE_CLI_BABEL_TRANSPILE_MODULES = true

.env.production

@@ -0,0 +1,12 @@
+# 页面标题
+VUE_APP_TITLE = 河北邯港高速
+
+# 生产环境配置
+ENV = 'production'
+
+# 河北邯港高速/生产环境
+VITE_APP_BASE_API=/iotApi
+VITE_APP_CONTROL_BASE_API=/xjIotApi
+VUE_APP_MONITOR_URL='/monitor-webs/cn/demo.html'
+VUE_LOGIN_USERNAME = ''
+VUE_LOGIN_PASSWORD = ''

.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
+}

.vscode/settings.json

@@ -0,0 +1,26 @@
+{
+  "editor.formatOnSave": true,
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "[javascript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[typescript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[json]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[vue]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[css]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[less]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[scss]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "i18n-ally.localesPaths": ["src/assets/locales"]
+}

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 daidai
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,313 @@
+
+## 项目描述
+
+[IofTV-Screen](https://gitee.com/daidaibg/IofTV-Screen/tree/main)  的 Vue3+vite版本，
+
+### 与vue2版本对比
+
+#### 功能
+
+功能采用与vue2版本相同功能
+
+因为要与vue2版本相同功能，有些组件不兼容vue3版本，例如：胶囊柱图，数字滚动皆重新封装为组件，整体来说，功能属实相同。根据自己需求选择[vue2](#vue2版本地址)版本与[vue3](#本项目地址 vue3+vite)版本
+
+#### 样式
+
+进行微调，整体看着更加美观
+
+
+
+- 项目需要全屏展示（按 F11）。
+
+- 项目部分区域使用了全局注册方式，增加了打包体积，在实际运用中请使用 **按需引入**。
+
+- 项目环境：Vite、Echarts、Npm、Node，axios,mock,vue3。
+
+- 请拉取 master 分支的代码，其余分支是开发分支。
+
+- 在项目public目录下存放地图数据合集，根据地市编存放。
+
+
+友情链接：
+
+1. [Vue 官方文档](https://cn.vuejs.org/)
+3. [echarts 实例](https://gitee.com/link?target=https%3A%2F%2Fecharts.apache.org%2Fexamples%2Fzh%2Findex.html)，[echarts API 文档](https://gitee.com/link?target=https%3A%2F%2Fecharts.apache.org%2Fzh%2Fapi.html%23echarts)
+4. [mock.js官网](http://mockjs.com/examples.html)
+5. [axios官网](https://axios-http.com/)
+
+**项目展示** 
+
+![项目展示](https://www.daidaibg.com/bigscreen/a-img/home.png)
+
+### 项目预览地址
+
+[https://www.daidaibg.com/bigscreen-vue3](https://www.daidaibg.com/bigscreen-vue3)
+
+### 项目仓库地址
+
+#### 本项目地址 vue3+vite
+
+**github地址**
+
+[https://github.com/daidaibg/IofTV-Screen-Vue3](https://github.com/daidaibg/IofTV-Screen-Vue3)
+
+**Gitee地址**
+
+[https://gitee.com/daidaibg/IofTV-Screen-Vue3](https://gitee.com/daidaibg/IofTV-Screen-Vue3)
+
+#### vue2版本地址
+
+**github地址**
+
+[https://github.com/daidaibg/IofTV-Screen](https://github.com/daidaibg/IofTV-Screen)
+
+**Gitee地址**
+
+[https://gitee.com/daidaibg/IofTV-Screen](https://gitee.com/daidaibg/IofTV-Screen)
+
+
+
+### 采用自适应组件方式，
+
+###  滚动设置，自适应设置 
+
+项目中可以进行滚动配置，内容是否滚动
+
+点击右上角设置按钮
+![设置](https://www.daidaibg.com/bigscreen/a-img/setting.png)
+
+
+
+可以进行以下配置，可以自行代码中进行修改或增加配置
+
+
+
+![在这里插入图片描述](https://www.daidaibg.com/bigscreen/a-img/setting2.png)
+
+
+
+##  2、主要文件介绍
+
+| 文件              | 作用/功能                                                    |
+| ----------------- | ------------------------------------------------------------ |
+| main.js           | 主目录文件，引入 Echart/DataV 等文件                         |
+| utils             | 工具函数与 mixins 函数等                                     |
+| views/ home.vue   | 项目主结构                                                   |
+| views/其余文件    | 界面各个区域组件（按照位置来命名）                           |
+| assets            | 静态资源目录，放置 logo 与背景图片                           |
+| assets / css/     | 通用 CSS 文件，全局项目快捷样式调节                          |
+| components/echart | 所有 echart 图表（按照位置来命名）                           |
+| common/...        | 全局封装的 ECharts 和 flexible 插件代码（适配屏幕尺寸，可定制化修改） |
+| api/api.js        | 接口封装文件                                                 |
+| mock              | 模拟数据接口地址                                             |
+
+###  
+
+## 使用介绍
+
+### 安装
+
+```npm
+npm install   
+```
+### 启动
+
+```npm
+npm run dev
+```
+
+### 取消mock模拟数据
+
+```javascript
+// src\main.ts文件
+把下面两行代码注释掉就可以了。
+import { mockXHR } from "@/mock/index";
+mockXHR()
+```
+
+## 
+
+## 公用组件
+
+封装了除面条外个别用到的组件
+
+### 自适应缩放组件
+
+#### 注意
+
+采用Scale方式，会自动给组件父元素添加overflow:hidden 
+
+#### 使用
+
+```vue
+<template>
+  <scale-screen width="1920" height="1080">
+    <div>
+   			content
+    </div>
+  </scale-screen>
+</template>
+
+<script>
+import ScaleScreen from 'scale-screen'
+
+export default {
+  name:'Demo',
+  components:{
+    VScaleScreen
+  }
+}
+</script>
+```
+
+#### API
+
+| 属性         | 说明                                                         | 类型                             | 默认值 |
+| ------------ | ------------------------------------------------------------ | -------------------------------- | ------ |
+| selfAdaption | 是否进行自适应                                               | Boolean                          | true   |
+| width        | 大屏宽度                                                     | `Number` or `String`             | 1920   |
+| height       | 大屏高度                                                     | `Number` or `String`             | 1080   |
+| autoScale    | 自适应配置，配置为boolean类型时，为启动或者关闭自适应，配置为对象时，若x为true，x轴产生边距，y为true时，y轴产生边距，启用fullScreen时此配置失效 | Boolean or {x:boolean,y:boolean} | true   |
+| delay        | 窗口变化防抖延迟时间                                         | Number                           | 500    |
+| fullScreen   | 全屏自适应，启用此配置项时会存在拉伸效果，同时autoScale失效，非必要情况下不建议开启 | Boolean                          | false  |
+| boxStyle     | 修改容器样式，如居中展示时侧边背景色，符合Vue双向绑定style标准格式 | Object                           | null   |
+| wrapperStyle | 修改自适应区域样式，符合Vue双向绑定style标准格式             | Object                           | null   |
+
+
+###  外边框
+
+因为我的项目外边框几乎一样，还有title,所以封装了此组件。
+
+根据自己需求更改，更换外边框（src\components\item-wrap\item-wrap.vue）下更换。
+
+```vue
+<ItemWrap
+    title="我是title"
+    >
+       <div>我是谁？</div>
+</ItemWrap>
+```
+
+| 参数  | 描述 | 默认值 |  类型  | 可选值 |
+| :---: | :--: | :----: | :----: | :----: |
+| title | 标头 |   -    | string |   -    |
+
+### CountUp 数字滚动
+
+以下属性同 coutup.js 配置项（same as countup.js properties）
+
+#### Props
+
+| Name     | Type             | Default | Description                                                  |
+| -------- | ---------------- | ------- | ------------------------------------------------------------ |
+| endVal   | Number \| String | -       | 结束值                                                       |
+| startVal | Number \| String | 0       | 起始值                                                       |
+| duration | Number           | 2.5     | 动画时长，单位：秒                                           |
+| options  | Object           | -       | [countUp.js](https://github.com/inorganik/countUp.js) options 配置项 |
+
+以下为组件特有属性（extension properties）
+
+| Name     | Type              | Default | Description                   |
+| -------- | ----------------- | ------- | ----------------------------- |
+| autoplay | Boolean           | true    | 是否自动计数                  |
+| loop     | Boolean \| Number | false   | 循环次数，有限次数 / 无限循环 |
+| delay    | Number            | 0       | loop 循环的间隔时间，单位：秒 |
+
+#### 插槽（slots）
+
+| Name   | Description |
+| ------ | ----------- |
+| prefix | 前缀        |
+| suffix | 后缀        |
+
+#### 事件（Events）
+
+| Name      | Description                | return       |
+| --------- | -------------------------- | ------------ |
+| @init     | CountUp 实例初始化完成触发 | CountUp 实例 |
+| @finished | 计数结束时触发             | -            |
+
+#### countup.js 配置项说明
+```ts
+interface CountUpOptions {
+  startVal?: number // number to start at (0) 开始数值，默认 0
+  decimalPlaces?: number // number of decimal places (0) 小数点 位数
+  duration?: number // animation duration in seconds (2) 动画时长
+  useGrouping?: boolean // example: 1,000 vs 1000 (true) 是否使用千分位
+  useEasing?: boolean // ease animation (true) 是否开启动画过渡，默认动画函数为easeOutExpo 
+  smartEasingThreshold?: number // smooth easing for large numbers above this if useEasing (999)
+  smartEasingAmount?: number // amount to be eased for numbers above threshold (333)
+  separator?: string // grouping separator (',') 千分位分隔符
+  decimal?: string // decimal ('.') 小数点分隔符
+  // easingFn: easing function for animation (easeOutExpo) 动画函数
+  easingFn?: (t: number, b: number, c: number, d: number) => number
+  formattingFn?: (n: number) => string // this function formats result 格式化结果
+  prefix?: string // text prepended to result 数值前缀
+  suffix?: string // text appended to result 数值后缀
+  numerals?: string[] // numeral glyph substitution 数字符号替换 0 - 9，例如替换为 [a,b,c,d,e,f,g,h,i,j]
+  enableScrollSpy?: boolean // start animation when target is in view 在可视范围内才开始动画
+  scrollSpyDelay?: number // delay (ms) after target comes into view  目标进入可视范围内后的延迟时间(毫秒)
+}
+```
+
+###  胶囊柱图
+
+#### Props
+
+|  属性  |   说明   |      类型       |          可选值           | 默认值  |
+| :----: | :------: | :-------------: | :-----------------------: | :-----: |
+|  data  |  柱数据  | `Array<Object>` |   [data属性](#data属性)   |  `[]`   |
+| config | 基础配置 |     Object      | [config属性](#config属性) | `false` |
+
+#### config属性
+
+|   属性    |   说明   |      类型       | 可选值 | 默认值  |
+| :-------: | :------: | :-------------: | :----: | :-----: |
+|   unit    |   单位   |    `String`     |  ---   |  `''`   |
+|  colors   |  环颜色  | `Array<String>` |  [1]   |   [2]   |
+| showValue | 显示数值 |    `Boolean`    |  ---   | `false` |
+
+#### 注释config注释
+
+[1] 颜色支持`hex|rgb|rgba|颜色关键字`等四种类型。
+
+[2] 默认配色为`['#37a2da', '#32c5e9', '#67e0e3', '#9fe6b8', '#ffdb5c', '#ff9f7f', '#fb7293']`。
+
+#### data属性
+
+| 属性  |   说明   |   类型   | 可选值 | 默认值 |
+| :---: | :------: | :------: | :----: | :----: |
+| name  |  柱名称  | `String` |  ---   |  ---   |
+| value | 柱对应值 | `Number` |  ---   |  ---   |
+
+### 无缝轮播组件
+
+看此文档 优化次源码
+
+[https://doc.wssio.com/opensource/vue3-seamless-scroll/](https://doc.wssio.com/opensource/vue3-seamless-scroll/)
+
+## 中间地图
+
+### 南海显隐控制
+
+ 根据需求来，**修改此值请刷新页面**
+
+```indexs/center-map.vue``` 文件中```isSouthChinaSea```变量 默认不显示南海(false),为```true```的时候显示南海
+
+```
+isSouthChinaSea:false,//默认不显示南海，改为true可显示南海
+```
+
+
+##  大屏交流反馈（面条的群）
+
+### 大屏QQ群
+
+QQ群号：
+
+一群：713105837 （已满）
+
+二群：495755841
+
+
+

auto-imports.d.ts

@@ -0,0 +1,9 @@
+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// noinspection JSUnusedGlobalSymbols
+// Generated by unplugin-auto-import
+export {}
+declare global {
+
+}

components.d.ts

@@ -0,0 +1,26 @@
+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// Generated by unplugin-vue-components
+// Read more: https://github.com/vuejs/core/pull/3399
+export {}
+
+declare module 'vue' {
+  export interface GlobalComponents {
+    BorderBox13: typeof import('./src/components/datav/border-box-13/border-box-13.vue')['default']
+    CapsuleChart: typeof import('./src/components/datav/capsule-chart/capsule-chart.vue')['default']
+    CountUp: typeof import('./src/components/count-up/count-up.vue')['default']
+    ElDrawer: typeof import('element-plus/es')['ElDrawer']
+    ElRadio: typeof import('element-plus/es')['ElRadio']
+    ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
+    EmptyCom: typeof import('./src/components/empty-com/empty-com.vue')['default']
+    ItemWrap: typeof import('./src/components/item-wrap/item-wrap.vue')['default']
+    MessageContent: typeof import('./src/components/Plugins/MessageContent/index.vue')['default']
+    MonitoringPointsChart: typeof import('./src/components/monitoring-points-chart.vue')['default']
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
+    ScaleScreen: typeof import('./src/components/scale-screen/scale-screen.vue')['default']
+    SeamlessScroll: typeof import('./src/components/seamless-scroll/seamless-scroll.vue')['default']
+    TrafficTrendChart: typeof import('./src/components/traffic-trend-chart.vue')['default']
+  }
+}

dist/index.html

@@ -0,0 +1 @@
+<!doctype html><html lang="en"><head><meta charset="UTF-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><title>IofTV-Screen-Vue3</title><script src="https://api.map.baidu.com/getscript?v=3.0&ak=a76Liq52IWX8S5WkSi2z5WvUYRMaNMRe&s=1"></script><script type="module" crossorigin src="/static/index-C8CpfsCA.js"></script><link rel="stylesheet" crossorigin href="/static/index-CJgPVv5L.css"></head><body><div id="app"></div></body></html>

dist/map-geojson/710000.json

@@ -0,0 +1 @@
+{"type":"FeatureCollection","features":[{"type":"Feature","properties":{"adcode":710000,"name":"台湾省","center":[121.509062,25.044332],"centroid":[120.971485,23.749452],"childrenNum":0,"level":"province","acroutes":[100000],"parent":{"adcode":100000}},"geometry":{"type":"MultiPolygon","coordinates":[[[[120.443558,22.441245],[120.517584,22.408536],[120.569903,22.361728],[120.640505,22.241347],[120.659209,22.15432],[120.662001,22.066983],[120.651464,22.033165],[120.667691,21.983168],[120.70157,21.927065],[120.743246,21.915569],[120.78155,21.923957],[120.85468,21.883333],[120.87291,21.897387],[120.866482,21.98436],[120.907315,22.033208],[120.904154,22.119757],[120.914955,22.302718],[120.981658,22.528305],[121.015009,22.584168],[121.033292,22.650725],[121.078498,22.669656],[121.170544,22.723133],[121.210481,22.770665],[121.237931,22.836327],[121.324708,22.945666],[121.354687,23.01006],[121.370388,23.084347],[121.409535,23.102669],[121.430294,23.137196],[121.415015,23.195973],[121.440358,23.272096],[121.479558,23.3223],[121.497788,23.419789],[121.521497,23.483198],[121.523078,23.538708],[121.587778,23.76102],[121.621604,23.92075],[121.659381,24.006893],[121.639992,24.064276],[121.643838,24.097713],[121.678085,24.133906],[121.689044,24.174401],[121.809172,24.339055],[121.826717,24.423579],[121.867498,24.478978],[121.885464,24.529677],[121.892524,24.617912],[121.862598,24.671515],[121.837993,24.76015],[121.845053,24.836269],[121.932883,24.938645],[122.012178,25.001469],[121.980776,25.03079],[121.947425,25.031955],[121.917077,25.137908],[121.842155,25.135332],[121.782407,25.160425],[121.750531,25.160716],[121.707327,25.191493],[121.700319,25.226913],[121.655324,25.241859],[121.623026,25.294694],[121.584986,25.308926],[121.535038,25.307515],[121.444415,25.270624],[121.413487,25.238912],[121.371864,25.159885],[121.319281,25.140691],[121.209322,25.127104],[121.133135,25.078728],[121.102102,25.075153],[121.024704,25.040479],[121.009688,24.993649],[120.960899,24.940227],[120.908475,24.852012],[120.892299,24.767526],[120.823753,24.688321],[120.762371,24.658335],[120.688661,24.600678],[120.64277,24.490172],[120.589187,24.432354],[120.546299,24.370413],[120.521009,24.312038],[120.470534,24.24259],[120.451461,24.182691],[120.392029,24.11824],[120.316158,23.984881],[120.278276,23.927798],[120.245768,23.840553],[120.175377,23.807385],[120.102773,23.700981],[120.094817,23.587466],[120.121741,23.504664],[120.107831,23.341264],[120.081434,23.29191],[120.018947,23.073115],[120.029537,23.048623],[120.131382,23.002118],[120.149138,22.896715],[120.200403,22.721101],[120.274272,22.560181],[120.297191,22.531315],[120.443558,22.441245]]],[[[124.542984,25.903911],[124.586346,25.913777],[124.572805,25.93974],[124.541825,25.931031],[124.542984,25.903911]]],[[[123.445286,25.725966],[123.472104,25.713024],[123.508933,25.723237],[123.514834,25.751226],[123.483063,25.768587],[123.444496,25.746514],[123.445286,25.725966]]],[[[119.64597,23.55091],[119.701081,23.550657],[119.678057,23.600041],[119.610089,23.603953],[119.594388,23.577245],[119.566306,23.584732],[119.562565,23.530377],[119.573788,23.505885],[119.609141,23.503864],[119.64597,23.55091]]],[[[123.667207,25.914066],[123.707092,25.916873],[123.678008,25.938667],[123.667207,25.914066]]],[[[119.506031,23.625567],[119.505241,23.575814],[119.472416,23.557136],[119.523207,23.563699],[119.525578,23.624895],[119.506031,23.625567]]],[[[119.49739,23.386683],[119.495125,23.350156],[119.516885,23.349903],[119.49739,23.386683]]],[[[119.557454,23.666474],[119.604083,23.616989],[119.615516,23.660925],[119.586485,23.675974],[119.557454,23.666474]]],[[[121.46823,22.676644],[121.476502,22.64166],[121.513541,22.631833],[121.5147,22.67639],[121.46823,22.676644]]],[[[121.510538,22.087185],[121.507693,22.048523],[121.534089,22.022146],[121.594522,21.995382],[121.604586,22.022699],[121.575028,22.037122],[121.575607,22.084421],[121.510538,22.087185]]],[[[122.097533,25.500168],[122.093581,25.47183],[122.124825,25.475932],[122.097533,25.500168]]],[[[119.421467,23.216684],[119.421309,23.18935],[119.453396,23.217697],[119.421467,23.216684]]],[[[120.355042,22.327259],[120.395454,22.342287],[120.383072,22.355573],[120.355042,22.327259]]]]}}]}

dist/static/map_load.js

@@ -0,0 +1,29 @@
+//卫星瓦片地图
+ 
+// console.log(process.env.VITE_BASE_URL_MAP);
+var bmapcfg = {
+  'imgext': '.jpg',   //瓦片图的后缀 ------ 根据需要修改，一般是 .png .jpg
+//这里我直接用的路径是/static/bmap_offline_demo/tiles，如果瓦片数量较大，可改为瓦片服务的地址
+     tiles_dir: "images", //普通瓦片图的地址，为空默认在 offlinemap/tiles/ 目
+    // 'tiles_path'  : 'http://172.16.1.162:8123/',
+    // 'tiles_hybrid': 'http://172.16.1.162:8123/',       //卫星瓦片图的地址，为空默认在 offlinemap/tiles_hybrid/ 目
+    // 'tiles_self'  : 'http://172.16.1.162:8123/'        //自定义图层的地址，为空默认在 offlinemap/tiles_self/ 目录
+    tiles_path: "http://111.229.30.246:4008/HeBeiDarkMap/",
+    tiles_hybrid: "http://111.229.30.246:4008/HeBeiDarkMap/", //卫星瓦片图的地址，为空默认在 offlinemap/tiles_hybrid/ 目
+    tiles_self: "http://111.229.30.246:4008/HeBeiDarkMap/", //自定义图层的地址，为空默认在 offlinemap/tiles_self/ 目录
+};
+ 
+//下面的保持不动///
+var scripts = document.getElementsByTagName("script");
+var JS__FILE__ = scripts[scripts.length - 1].getAttribute("src");  //获得当前js文件路径
+bmapcfg.home = JS__FILE__.substr(0, JS__FILE__.lastIndexOf("/") + 1); //地图API主目录
+(function () {
+  window.BMap_loadScriptTime = (new Date).getTime();
+  //加载地图API主文件
+  document.write('<script type="text/javascript" src="' + bmapcfg.home + 'bmap_offline_api_v3.0_min.js"></script>');
+  //加载扩展函数
+  document.write('<script type="text/javascript" src="' + bmapcfg.home + 'map_plus.js"></script>');
+  //加载城市坐标
+  document.write('<script type="text/javascript" src="' + bmapcfg.home + 'map_city.js"></script>');
+})();
+///

env.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />

index.html

@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>IofTV-Screen-Vue3</title>
+    <script
+      type="text/javascript"
+      src="<%= BASE_URL %>static/map_load.js"
+    ></script>
+    <!-- <script src="https://api.map.baidu.com/api?v=3.0&ak=a76Liq52IWX8S5WkSi2z5WvUYRMaNMRe"></script> -->
+     <!-- <script src="https://api.map.baidu.com/getscript?v=3.0&ak=a76Liq52IWX8S5WkSi2z5WvUYRMaNMRe&s=1"></script> -->
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>

package.json

@@ -0,0 +1,46 @@
+{
+  "name": "test",
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build:old": "run-p type-check build-only",
+    "build": "vite build",
+    "preview": "vite preview --port 4173",
+    "build-only": "vite build",
+    "type-check": "vue-tsc --noEmit"
+  },
+  "dependencies": {
+    "axios": "^1.6.8",
+    "countup.js": "^2.8.0",
+    "dayjs": "^1.11.10",
+    "echarts": "^5.5.0",
+    "element-plus": "^2.6.2",
+    "lodash-es": "^4.17.21",
+    "mockjs": "^1.1.0",
+    "pinia": "^2.1.7",
+    "vite-plugin-html": "^3.2.2",
+    "vue": "^3.4.21",
+    "vue-echarts": "^6.6.9",
+    "vue-router": "^4.3.0"
+  },
+  "devDependencies": {
+    "@types/lodash-es": "^4.17.12",
+    "@types/mockjs": "^1.0.10",
+    "@types/node": "^20.11.30",
+    "@vitejs/plugin-vue": "^5.0.4",
+    "@vue/tsconfig": "^0.5.1",
+    "@vueuse/core": "^10.9.0",
+    "autoprefixer": "^10.4.19",
+    "npm-run-all": "^4.1.5",
+    "postcss": "^8.4.38",
+    "sass": "^1.72.0",
+    "tailwindcss": "^3.4.3",
+    "typescript": "~5.4.3",
+    "unplugin-auto-import": "^0.17.5",
+    "unplugin-element-plus": "^0.8.0",
+    "unplugin-vue-components": "^0.26.0",
+    "vite": "^5.2.6",
+    "vue-tsc": "^2.0.7"
+  }
+}

postcss.config.js

@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}