liyongli 2 gadi atpakaļ
vecāks
revīzija
97686d8bef

+ 1 - 1
package.json

@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "description": "",
   "scripts": {
-    "dev": "vite --host",
+    "dev": "vite --open",
     "build": "vite build",
     "serve": "vite preview"
   },

+ 27 - 20
src/pages/bigScreen/Home.jsx

@@ -1,4 +1,4 @@
-import { onMount, createSignal, Show, For } from "solid-js";
+import { onMount, createSignal, createEffect, Show, For } from "solid-js";
 import { createStore } from "solid-js/store";
 import dayjs from "dayjs"
 
@@ -206,24 +206,25 @@ function BigScreenHome() {
         getWeather().then(r => setTQ(r.data))
         getData().then(r => {
             if (r.code != 0) return
-            const newHeadTitle = [], newproTv = JSON.parse(JSON.stringify(proTv()));
-            for (let i = 0; i < HeadTitle().length; i++) {
-                const v = JSON.parse(JSON.stringify(HeadTitle()[i]));
-                if (v.title === '重大活动传播总量') v.value = r.data.activity_total.data
-                if (v.title === "新媒体月度传播力") v.value = r.data.media_month_play.data
-                if (v.title === "传统媒体-昨日收视时长") v.value = (r.data.media_overview.data.timeCount / 60).toFixed(0)
-                if (v.title === "传统媒体-日收视次数") v.value = r.data.media_overview.data.watchCount
-                if (v.title === "传统媒体-日活跃用户") v.value = r.data.media_overview.data.activeUser
-                if (v.title === "传统媒体-覆盖终端") v.value = r.data.media_overview.data.totalUser
-                newHeadTitle.push(v)
-            }
-            newproTv[0].value = r.data.cm_tv_overview.data.watchRate;
-            newproTv[1].value = r.data.cm_tv_overview.data.occRate;
-            newproTv[2].value = r.data.cm_tv_overview.data.loyalty;
-            setoriData(r.data || {})
-            setHeadTitle(newHeadTitle)
-            setproTv(newproTv)
-
+            createEffect(() => {
+                const newHeadTitle = [], newproTv = JSON.parse(JSON.stringify(proTv()));
+                for (let i = 0; i < HeadTitle().length; i++) {
+                    const v = JSON.parse(JSON.stringify(HeadTitle()[i]));
+                    if (v.title === '重大活动传播总量') v.value = r.data.activity_total.data
+                    if (v.title === "新媒体月度传播力") v.value = r.data.media_month_play.data
+                    if (v.title === "传统媒体-昨日收视时长") v.value = (r.data.media_overview.data.timeCount / 60).toFixed(0)
+                    if (v.title === "传统媒体-日收视次数") v.value = r.data.media_overview.data.watchCount
+                    if (v.title === "传统媒体-日活跃用户") v.value = r.data.media_overview.data.activeUser
+                    if (v.title === "传统媒体-覆盖终端") v.value = r.data.media_overview.data.totalUser
+                    newHeadTitle.push(v)
+                }
+                newproTv[0].value = r.data.cm_tv_overview.data.watchRate;
+                newproTv[1].value = r.data.cm_tv_overview.data.occRate;
+                newproTv[2].value = r.data.cm_tv_overview.data.loyalty;
+                setoriData(r.data || {})
+                setHeadTitle(newHeadTitle)
+                setproTv(newproTv)
+            })
         })
         // TODO: 浏览器获取定位权限
         // const location = navigator.geolocation || false;
@@ -244,7 +245,13 @@ function BigScreenHome() {
     return (
         <div class="home">
             <div class="homeHeader">
-                <div class="sz">{TimeDate()}</div>
+                <div class="sz">
+                    <img style={{ "vertical-align": 'middle', width: '115px' }}
+                        src="http://res.cnwest.com/t/site/10001/663789250d35fb30006597dcddc4be8b/assets/sxtvs2019/sxtvs_index/images/logonew2.png" alt="" />
+                    <span style={{ "vertical-align": 'middle' }}>
+                        {TimeDate()}
+                    </span>
+                </div>
                 <div class="tq">{Weather()}</div>
                 <div class="headTitle">陕西广电融媒体集团大数据平台</div>
                 {/* <div className="tq">

+ 2 - 4
src/pages/bigScreen/components/Activity.jsx

@@ -1,10 +1,9 @@
-import { onMount, createSignal, For } from "solid-js";
+import { onMount, For } from "solid-js";
 
 import utils from "../../../utils/index"
 import "../../../assets/style/BigScreenHome.css"
 
 function ListeningRate(prop) {
-    const [TableList] = createSignal(prop.list)
     onMount(() => { })
     return (
         <div class="livRang" style={{
@@ -21,7 +20,7 @@ function ListeningRate(prop) {
                     height:`${prop.height - 42}px`,
                     overflow: 'auto'
                 }}>
-                    <For each={TableList}>{(item, i) => <div class="tr trColor">
+                    <For each={prop.list}>{(item, i) => <div class="tr trColor">
                         <div class='td'>{i() + 1}</div>
                         <div class='td' style={{"flex":"2","min-width":"0"}}>
                             {/* <Show when={maxlen <= item.activity.length}>
@@ -30,7 +29,6 @@ function ListeningRate(prop) {
                             <Show when={maxlen > item.activity.length}> */}
                                 {item.activity}
                             {/* </Show> */}
-                            
                         </div>
                         <div class='td'>{utils.formatNumber(item.readCount)}</div>
                     </div>}</For>

+ 21 - 21
src/pages/bigScreen/components/NewMedia.jsx

@@ -1,6 +1,4 @@
-import { onMount, createSignal, For } from "solid-js";
-import { createStore } from "solid-js/store";
-
+import { onMount, createSignal, createEffect, For } from "solid-js";
 import utils from "../../../utils/index"
 import "../../../assets/style/BigScreenHome.css"
 
@@ -9,7 +7,7 @@ function NewMedia(prop) {
     function getlist() {
         const setli = [];
         for (let i = 0; i < Math.floor((prop.height - 42) / 40); i++) {
-            const v = ((origin[act()] || {}).data || [])[i];
+            const v = ((prop.list[act()] || {}).data || [])[i];
             if (!v) break
             setli.push({
                 userName: v.userName,
@@ -19,7 +17,6 @@ function NewMedia(prop) {
         }
         return setli
     }
-    const [origin] = createStore(prop.list || {})
     const [act, setact] = createSignal(0)
     const [TableList, setTableList] = createSignal(getlist())
     onMount(() => { })
@@ -30,50 +27,53 @@ function NewMedia(prop) {
     function timeoutFun() {
         return setTimeout(() => {
             if (timeout) clearTimeout(timeout)
-            const i = act() + 1 >= origin.length ? 0 : act() + 1;
+            const i = act() + 1 >= prop.list.length ? 0 : act() + 1;
             imgClick(i);
             timeout = timeoutFun();
         }, 3000);
     }
 
     timeout = timeoutFun()
-    let p = prop.styleCss || {};
-    p.width = `${prop.width}px`;
-    p.height = `${prop.height + 40}px`;
+    let p = {};
+    createEffect(() => {
+        if (prop.styleCss) p = prop.styleCss;
+        if (prop.width) p.width = `${prop.width}px`;
+        if (prop.height) p.height = `${prop.height + 40}px`;
+    })
     return (
         <div class="livRang" style={p}>
             <div class="head">{prop.title}</div>
-            <div style={{"white-space":"nowrap","display":"flex"}}>
-                <For each={origin}>{(item, i) => <div class="TabBtn">
-                    <img onClick={() => imgClick(i())} style={{"width":"100%","vertical-align":"middle","margin-right":"3px"}} src={'/src/assets/img/' + item.name + (act() === i() ? '-o' : '') + '.png'} />
+            <div style={{ "white-space": "nowrap", "display": "flex" }}>
+                <For each={prop.list}>{(item, i) => <div class="TabBtn">
+                    <img onClick={() => imgClick(i())} style={{ "width": "100%", "vertical-align": "middle", "margin-right": "3px" }} src={'/src/assets/img/' + item.name + (act() === i() ? '-o' : '') + '.png'} />
                     {/* <span style="vertical-align: middle;">{item.name}</span> */}
                 </div>}</For>
             </div>
             <div class="table" >
-                <div class="tr" style={{"background-color":"#03375e"}}>
+                <div class="tr" style={{ "background-color": "#03375e" }}>
                     <div class='td'>序号</div>
-                    <div class='td' style={{"flex":"2"}}>部门</div>
-                    <div class='td' style={{"flex":"2"}}>账号</div>
-                    <div class='td' style={{"flex":"2"}}>当月阅读量</div>
+                    <div class='td' style={{ "flex": "2" }}>部门</div>
+                    <div class='td' style={{ "flex": "2" }}>账号</div>
+                    <div class='td' style={{ "flex": "2" }}>当月阅读量</div>
                 </div>
                 <div style={{
-                    height:`${prop.height - 82}px`,
+                    height: `${prop.height - 82}px`,
                     overflow: 'hidden'
                 }}>
                     <For each={TableList()}>{(item, i) => <div class="tr trColor">
                         <div class='td'>{i() + 1}</div>
-                        <div class='td' style={{"flex":"2"}}>
+                        <div class='td' style={{ "flex": "2" }}>
                             {item.depName}
                         </div>
-                        <div class='td' style={{"flex":"2"}}>
+                        <div class='td' style={{ "flex": "2" }}>
                             {/* <Show when={maxlen <= item.userName.length}>
                                 <marquee behavior="scroll">{item.userName}</marquee>
                             </Show>
                             <Show when={maxlen > item.userName.length}> */}
-                                {item.userName}
+                            {item.userName}
                             {/* </Show> */}
                         </div>
-                        <div class='td' style={{"flex":"2"}}>{utils.formatNumber(item.readCount)}</div>
+                        <div class='td' style={{ "flex": "2" }}>{utils.formatNumber(item.readCount)}</div>
                     </div>}</For>
                 </div>
             </div>

+ 3 - 3
src/pages/bigScreen/components/NewMediaTrend.jsx

@@ -14,11 +14,11 @@ function DataFormmat(timeString) {
 }
 
 function Usertrend(prop) {
-    let $canvas = undefined, origin = prop.list || [];
+    let $canvas = undefined;
     function getlist() {
         const setli = [];
-        for (let i = 0; i < origin.length; i++) {
-            const item = origin[i];
+        for (let i = 0; i < (prop.list || []).length; i++) {
+            const item = (prop.list || [])[i];
             (item.data || []).map(v => {
                 setli.push({
                     Data: DataFormmat(v.dt),

+ 2 - 2
src/pages/bigScreen/components/SelfPlatform.jsx

@@ -14,9 +14,9 @@ function DataFormmat(timeString) {
 }
 
 function Usertrend(prop) {
-    let $canvas = undefined, origin = prop.list || [];
+    let $canvas = undefined;
     function TrendChart(width, height, $canvas) {
-        const data = (origin || []).map(v => {
+        const data = (prop.list || []).map(v => {
             return {
                 Data: DataFormmat(v.dt),
                 sales: v.readCount

+ 0 - 1
src/router/index.jsx

@@ -13,7 +13,6 @@ const Fourth = lazy(() => import("../pages/Fourth"))
 const Fifth = lazy(() => import("../pages/Fifth"))
 const BigScreen = lazy(() => import("../pages/BigScreen/Home"))
 
-
 const [BottomLi, setBottomLi] = createSignal(baseText.bottoms);
 
 const changeBottomTab = function (e) {

+ 5 - 1
vite.config.js

@@ -3,7 +3,11 @@ import solidPlugin from "vite-plugin-solid";
 
 export default defineConfig({
   server: {
-    // https: true
+    // https: true,
+    watch: {
+      usePolling: true,
+    },
+    hmr: true
   },
   plugins: [solidPlugin()],
   build: {