测试大屏

2024-03-15 16:37:36 +08:00 · 2024-03-15 16:37:36 +08:00 · 0b8c38a691
parent 8d2b007ad0
commit 0b8c38a691
11 changed files with 152 additions and 74 deletions
--- a/env/.env.dev
+++ b/env/.env.dev
@ -3,9 +3,11 @@ VITE_ENV = 'development'
 VITE_BUILD_MODE = 'dev'

 # 开发环境接口地址
-VITE_API_URL = '/proxyApi'
+VITE_API_URL = '/proxy'
 # 代理地址
-VITE_proxyTarget = "http://10.40.92.64:8080/zlpt-bigscreen/"
+# VITE_proxyTarget = "http://10.40.92.64:8080/zlpt-bigscreen/"
+# 代理至 https://test-rental.zhgkxt.com/
+VITE_proxyTarget = "https://test-rental.zhgkxt.com/proxy"



--- a/env/.env.production
+++ b/env/.env.production
@ -3,7 +3,9 @@ VITE_ENV = 'production'
 VITE_BUILD_MODE = 'prod'

 # 线上环境接口地址
-VITE_API_URL = 'https://production.com'
+# VITE_API_URL = 'https://production.com'
+VITE_API_URL = 'https://test-rental.zhgkxt.com/proxy'
+# VITE_API_URL = 'http://localhost:8080/proxy'
 # 百度地图key 
 VITE_AK = "cClgLBaLgGUdQDilX9dGvieL"
 # 百度地图版本
--- a/index.html
+++ b/index.html
@ -2,7 +2,7 @@
 <html lang="en">
  <head>
    <meta charset="UTF-8">
-    <link rel="icon" href="/favicon.ico">
+    <!-- <link rel="icon" href="/favicon.ico"> -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>机具租赁共享平台</title>
    <link rel="icon" href="//test-hzdg-1259451974.cos.ap-guangzhou.myqcloud.com/d133bcbb33438a196a8ccd4eda65934f1742495961134923776354.png" />
--- a/package.json
+++ b/package.json
@ -7,7 +7,7 @@
    "build": "npm run build:pro",
    "build:sit": "vite build --mode sit",
    "build:uat": "vite build --mode uat",
-    "build:pro": "&& vite build --mode production",
+    "build:pro": "vite build --mode production",
    "preview": "vite preview",
    "build-only": "vite build",
    "type-check": "vue-tsc --noEmit -p tsconfig.app.json --composite false"
--- a/src/components/customCom/equipmentLeasing.vue
+++ b/src/components/customCom/equipmentLeasing.vue
@ -162,7 +162,7 @@ const mapProps = reactive({
            return ""
        }
        let fromatStr =
-            `<div style="background:url(${getImg('/src/assets/img/mapHoverBg.png')});width:324px;height:225px;background-size:contain;background-repeat:no-repeat;">
+            `<div style="background-image: url(${new URL('/src/assets/img/mapHoverBg.png', import.meta.url).href});width:324px;height:225px;background-size:contain;background-repeat:no-repeat;">
                <div style="width: 100px;height: 90px;padding-top:4px;position:relative;">
                    <div  style="position:absolute;left:20px;top:10px;font-weight:bold;color:#fff;">
                        ${params.name}
@ -194,43 +194,47 @@ const mapProps = reactive({
        console.log("equipmentDialogRef999", params.data.name)
        equipmentDialogRef.value.open(params.data.name)
    },
-    seriesData:[]
-    //  [{ name: '肇庆市', value: [112.48461, 23.05196, 1] },
-    // { name: '佛山市', value: [110.130214, 23.018978, 1] },
-    // { name: '广州', value: [115.261081, 23.139856, 1] },
-    // { name: '南宁', value: [107.45, 22.139856, 1] },
-    // { name: '贵阳', value: [106.7, 26.36, 1] },
-    // { name: '昆明', value: [102.33, 24.23, 1] }   ,
-    // { name: '海口', value: [110.33,19.823, 1] }]
+    // seriesData:[]
+    seriesData: [
+        //地图上的点
+        { name: '肇庆市', value: [112.48461, 23.05196, 1] },
+        { name: '佛山市', value: [110.130214, 23.018978, 1] },
+        { name: '广州', value: [115.261081, 23.139856, 1] },
+        { name: '南宁', value: [107.45, 22.139856, 1] },
+        { name: '贵阳', value: [106.7, 26.36, 1] },
+        { name: '昆明', value: [102.33, 24.23, 1] },
+        { name: '海口', value: [110.33,19.823, 1] }
+    ]
 })
 let listData: any = []
 const mapDataByProvice = (provinceName: String) => {
-    // let listData = [
-    //     {
-    //         name: "广东省",
-    //         selfCount: 123,
-    //         toCount: 300,
-    //         inCount: 987
-    //     },
-    //     {
-    //         name: "广西壮族自治区",
-    //         selfCount: 23,
-    //         toCount: 55,
-    //         inCount: 278
-    //     },
-    //     {
-    //         name: "云南省",
-    //         selfCount: 256,
-    //         toCount: 2456,
-    //         inCount: 745
-    //     },
-    //     {
-    //         name: "贵州省",
-    //         selfCount: 963,
-    //         toCount: 4521,
-    //         inCount: 963
-    //     }
-    // ]
+    let listData = [
+        // 设备租赁分布图的数据
+        {
+            name: "广东省",
+            selfCount: 123,
+            toCount: 300,
+            inCount: 987
+        },
+        {
+            name: "广西壮族自治区",
+            selfCount: 23,
+            toCount: 55,
+            inCount: 278
+        },
+        {
+            name: "云南省",
+            selfCount: 256,
+            toCount: 2456,
+            inCount: 745
+        },
+        {
+            name: "贵州省",
+            selfCount: 963,
+            toCount: 4521,
+            inCount: 963
+        }
+    ]
    const curItem: any = listData.find((ele: any) => ele.name.slice(0, 2) == provinceName)
    return curItem
 }
--- a/src/components/customCom/hotProvider.vue
+++ b/src/components/customCom/hotProvider.vue
@ -16,8 +16,11 @@
            <div class="provider_item" v-for="(item, index) in providerInfo.list" :key="index">
                <div class="provider_item_left">
                    <div class="pro_item_icon" :class="{ 'inThree': index + 1 <= 3, 'afterThree': index + 1 > 3 }">
-                        <img :src="`/src/assets/img/index${index + 1 <= 3 ? index + 1 : 4}.png`" alt=""
-                            class="pro_item_icon_img">
+                        <!-- <img :src="`/src/assets/img/index${index + 1 <= 3 ? index + 1 : 4}.png`" alt="" -->
+                        <img v-if="index == 0" src="/src/assets/img/index1.png" alt="" class="pro_item_icon_img">
+                        <img v-else-if="index == 1" src="/src/assets/img/index2.png" alt="" class="pro_item_icon_img">
+                        <img v-else-if="index == 2" src="/src/assets/img/index3.png" alt="" class="pro_item_icon_img">
+                        <img v-else src="/src/assets/img/index4.png" alt="" class="pro_item_icon_img">
                    </div>
                    <div class="pro_item_title overflow">
                        {{ item.ownCo }}
@ -40,7 +43,36 @@ import { apiMaDevInfoHotList } from "http/api/echartApi"


 const providerInfo: any = reactive({
-    list: []
+    list: [
+        {
+            ownCo: "中铁一局",
+            count: 1
+        },
+        {
+            ownCo: "中铁二局",
+            count: 2
+        },
+        {
+            ownCo: "中铁三局",
+            count: 3
+        },
+        {
+            ownCo: "中铁四局",
+            count: 4
+        },
+        {
+            ownCo: "中铁五局",
+            count: 5
+        },
+        {
+            ownCo: "中铁十一局",
+            count: 10
+        },
+        {
+            ownCo: "中铁十一局",
+            count: 10
+        },
+    ]
 })

 const subActive = ref("provider")
--- a/src/components/echartsCom/Pie3dCom.vue
+++ b/src/components/echartsCom/Pie3dCom.vue
@ -15,7 +15,7 @@ onMounted(() => {
    Highcharts.chart('container', options)
 })

-const options = {
+const options:any = {
    chart: {
        type: 'pie',
        backgroundColor: 'rgba(0, 0, 0, 0.32)',
@ -50,7 +50,7 @@ const options = {
    },
    series: [{
        name: '设备数量',
-        data:props.list
+        data:props.list 
    }]
 }

--- a/src/http/api/echartApi.ts
+++ b/src/http/api/echartApi.ts
@ -18,11 +18,11 @@ export function apiMaDevInfoMatypeList() {
 }
 //      查询今日订单额以及订单数量:
 export function apiMaOrderInfoTodayList() {
-    return get('maOrderInfo/today-list', {})
+    return get('order/maOrderInfo/today-list', {})
 }
 //      租赁订单月统计:
 export function apiMaOrderInfoList() {
-    return get('maOrderInfo/list', {})
+    return get('order/maOrderInfo/list', {})
 }
 // --
 // 获取企业所属对应的机手数量以及机手总人数:
--- a/src/http/index.ts
+++ b/src/http/index.ts
@ -34,6 +34,8 @@ service.interceptors.response.use(
 )

 export function get(url: string, params: any) {
+    // 拼接查询字符串 ?platformId=20
+    url += '?platformId=20'
    return new Promise((resolve, reject) => {
        NProgress.start()
        service
@ -41,7 +43,7 @@ export function get(url: string, params: any) {
            .then((res: any) => {
                NProgress.done()
                console.log("res-get",res)
-                if (res.code == '200') {
+                if (res.code == '0') {
                    resolve(res.data)
                } else {
                    reject(res.data)
--- a/src/views/screen/sharePlatform.vue
+++ b/src/views/screen/sharePlatform.vue
@ -6,7 +6,7 @@
                <img src="@/assets/img/setting.png" />
            </div>
            <div class="right_title_more_info">
-                <span class="wheather">晴转多云 16℃ </span>
+                <span class="weather">晴转多云 16℃ </span>
                <span class="time">{{ nowTime }}</span>
            </div>
        </div>
@ -108,8 +108,9 @@
                <div class="bottom_row_center_bar">
                    <div class="bottom_row_center_bar_left">
                        <div class="total_count">
-                            总人数：{{ totalCount }}
+                            总人数：{{ totalCount || "0" }}
                        </div>
+                        <!-- 机手人数 -->
                        <barCom v-if="barComProps.xAxisData.length > 0" :domId="1" :title="barComProps.title"
                            :titleStyle="barComProps.titleStyle" :xAxisData="barComProps.xAxisData"
                            :yAxisProps="barComProps.yAxisProps" :seriseData="barComProps.seriseData"
@ -119,6 +120,7 @@
                            :barWidth="barComProps.barWidth" :formatCallBack="barComProps.formatCallBack"></barCom>
                    </div>
                    <div class="bottom_row_center_bar_right">
+                        <!-- 租赁订单月统计 -->
                        <barCom v-if="barComPropsSimple.xAxisData.length > 0" ref="barSimpleRef" :domId="2"
                            :title="barComPropsSimple.title" :xAxisData="barComPropsSimple.xAxisData"
                            :titleStyle="barComProps.titleStyle" :yAxisProps="barComPropsSimple.yAxisProps"
@ -167,41 +169,55 @@ import {
    apiMaLeaseInfoInfoTypeList
 } from "http/api/echartApi"
 const equipmentCountInfo: any = reactive({
-    listCount: [],
-    selfCount: "",
-    shelfCount: ""
+    // 平台入驻设备总数
+    listCount: [
+        "0", "0", "0", "0" // 默认假数据
+    ],
+    selfCount: "0",
+    shelfCount: "0"
 })

 const middleCountList = reactive({
    list: [
        {
-            icon: getImg("/src/assets/img/money1.png"),
+            // icon: getImg("/src/assets/img/money1.png"),
+            icon: new URL("/src/assets/img/money1.png", import.meta.url).href,
            count: "",
            title: "今日订单"
        },
        {
-            icon: getImg("/src/assets/img/money2.png"),
+            // icon: getImg("/src/assets/img/money2.png"),
+            icon: new URL("/src/assets/img/money2.png", import.meta.url).href,
            count: "",
            title: "累计金额"
        },
        {
-            icon: getImg("/src/assets/img/money3.png"),
+            // icon: getImg("/src/assets/img/money3.png"),
+            icon: new URL("/src/assets/img/money3.png", import.meta.url).href,
            count: "",
            title: "在用设备"
        },
        {
-            icon: getImg("/src/assets/img/money2.png"),
+            // icon: getImg("/src/assets/img/money2.png"),
+            icon: new URL("/src/assets/img/money2.png", import.meta.url).href,
            count: "",
            title: "待租设备"
        }
    ]
 })
 const rentWantRent:any=reactive({
-    rent:[],
-    wantRent:[]
+    rent:[
+        "0", "0", "0", "0" // 默认假数据
+    ],
+    wantRent:[
+        "0", "0", "0", "0" // 默认假数据
+    ]
 })
 const platFormInfo: any = reactive({
-    listCount: [],
+    // 平台入驻设备总数
+    listCount: [
+        "0", "0", "0", "0" // 默认假数据
+    ],
    socailCount: "",
    enterpriseCount: "",
    holdingCount: ''
@ -213,7 +229,9 @@ const barComProps = reactive({
        color: "#0099FF",
        paddingTop: 20
    },
-    xAxisData: [],
+    xAxisData: [
+        "1月","2月","3月"
+    ],
    yAxisProps: {
        type: "value",
        splitLine: {//是否显示 y轴横线
@ -319,13 +337,23 @@ const barComPropsHorizontal = reactive({
            show: false
        },
    },
-    xAxisData: [],
+    xAxisData: [
+        20, 40, 60, 80, 100
+    ],
    yAxisProps: {
        type: "category",
        // boundaryGap: false,
    },
-    yAxisData: [],
-    seriseData: [],//数据
+    yAxisData: [
+        "装备1", "装备2", "装备3", "装备4", "装备5"
+    ],
+    seriseData: [
+        { value: 120, name: '装备1' },
+        { value: 132, name: '装备2' },
+        { value: 101, name: '装备3' },
+        { value: 134, name: '装备4' },
+        { value: 90, name: '装备5' }
+    ],//数据
    itemStyle: [//柱状图的默认颜色 渐变
        { offset: 0, color: '#077FBA' },
        { offset: 1, color: '#91FFBE' }
@ -358,7 +386,14 @@ const barComPropsHorizontal = reactive({
    }
 })
 const pie3DList = reactive({
-    list: []
+    list: [
+        // 假数据
+        {name: 'Chrome', y: 61.41},
+        {name: 'Internet Explorer', y: 11.84},
+        {name: 'Firefox', y: 10.85},
+        {name: 'Edge', y: 4.67},
+        {name: 'Safari', y: 4.18},
+    ]
 })
 onMounted(() => {
    iniTapiMaDevInfoList()
@ -424,8 +459,8 @@ const iniTapiMaDevInfoMatypeList = async () => {
    try {
        const res: any = await apiMaDevInfoMatypeList()
        console.log("apiMaDevInfoMatypeList", res)
-        middleCountList.list[2].count = res.rent.count
-        middleCountList.list[3].count = res.use.count
+        middleCountList.list[2].count = res.rent.count || 0
+        middleCountList.list[3].count = res.use.count || 0
    } catch (error) {
        console.log(error)
    }
@ -436,10 +471,10 @@ const iniTapiMaOrderInfoTodayList = async () => {
    try {
        const res: any = await apiMaOrderInfoTodayList()
        console.log("apiMaOrderInfoTodayList", res)
-        middleCountList.list[0].count = res[0].count
-        middleCountList.list[1].count = res[0].money
+        middleCountList.list[0].count = res.count || 0
+        middleCountList.list[1].count = res.money || 0
    } catch (error) {
-        console.log(error)
+        console.log('err-->', error)
    }

 }
@ -448,7 +483,7 @@ const iniTapiMaOrderInfoList = async () => {
    //租赁订单月统计:
    try {
        const res: any = await apiMaOrderInfoList()
-
+        console.log("租赁订单-->", res)
        barComPropsSimple.xAxisData = res.map((ele: any) => ele.month)
        barComPropsSimple.seriseData = res.map((ele: any) => ele.count)
    } catch (error) {
@ -575,11 +610,12 @@ setInterval(() => {
        font-size: 16px;
        display: flex;

-        .wheather {
+        .weather {
            padding-right: 34px;
        }
        .time {
            display: flex;
+            white-space: nowrap;
            width: 205px;
        }
    }
--- a/vite.config.ts
+++ b/vite.config.ts
@ -79,11 +79,11 @@ export default ({ mode }: any) => {
      // port: Number(envInfo.VITE_PORT),
      // open: envInfo.VITE_OPEN,
      proxy: {
-        '/proxyApi': {
+        '/proxy': {
          target: envInfo.VITE_proxyTarget,
          secure: false,
          changeOrigin: true,
-          rewrite: (path) => path.replace(/^\/proxyApi/, ''),
+          rewrite: (path) => path.replace(/^\/proxy/, '/'),
          configure: (proxy, _options) => {
            proxy.on('error', (err, _req, _res) => {
              // console.log('proxy error', err)