提交

src/utils/echarts.js

@@ -1,5 +1,5 @@
 import * as echarts from "echarts/core";
-import { RadarChart, LineChart,BarChart   } from "echarts/charts";
+import { RadarChart, LineChart,BarChart,PieChart   } from "echarts/charts";
 import { TitleComponent } from "echarts/components";
 import {
   TooltipComponent,
@@ -27,7 +27,8 @@ echarts.use([
   LineChart,
   ToolboxComponent,
   BrushComponent,
-  BarChart 
+  BarChart,
+  PieChart
 ]);
 
 export default echarts;

src/views/report/Advertisement/Charts.js

@@ -9,14 +9,6 @@ export function advertisementSpendInit(ele, list) {
   barEcharts && barEcharts.clear && barEcharts.clear();
   if (!barEcharts) barEcharts = echarts.init(ele);
   barEcharts.setOption({
-    title: {
-      text: list.name || "",
-      left: "center",
-      top: "3px",
-      textStyle: {
-        fontSize: 17,
-      },
-    },
     tooltip: {
       valueFormatter: e => {
         return "环比：" + (e.toFixed(2) - 0) + "%";
@@ -28,7 +20,7 @@ export function advertisementSpendInit(ele, list) {
       },
     },
     grid: {
-      top: "60px",
+      top: "40px",
       left: "3%",
       right: "4%",
       bottom: "3%",
@@ -108,16 +100,7 @@ export function advertisementRingRatioInit(ele, list) {
   ringEcharts && ringEcharts.clear && ringEcharts.clear();
   if (!ringEcharts) ringEcharts = echarts.init(ele);
   let keys = list.F.length > list.L.length ? list.F : list.L;
-  console.log(list.C)
   ringEcharts.setOption({
-    title: {
-      text: list.name || "",
-      left: "center",
-      top: "3px",
-      textStyle: {
-        fontSize: 17,
-      },
-    },
     tooltip: {
       trigger: "axis",
       formatter(e) {
@@ -135,11 +118,11 @@ export function advertisementRingRatioInit(ele, list) {
       },
     },
     legend: {
-      data: [list.F[0].type, list.L[0].type, list.C[0].type],
-      top: "30px",
+      data: [list.F[0].type, list.L[0].type],
+      top: "10px",
     },
     grid: {
-      top: "60px",
+      top: "40px",
       left: "3%",
       right: "6%",
       bottom: "3%",
@@ -157,6 +140,7 @@ export function advertisementRingRatioInit(ele, list) {
     },
     yAxis: {
       type: "value",
+      scale: true,
       axisLabel: {
         formatter: e => {
           let N = e || 0;
@@ -181,13 +165,6 @@ export function advertisementRingRatioInit(ele, list) {
         showSymbol: false,
         data: list.L.map(v => v.value),
       },
-      {
-        name: list.C[0].type,
-        type: "line",
-        stack: "C",
-        showSymbol: false,
-        data: list.C.map(v => v.value),
-      },
     ],
   });
 }
@@ -198,14 +175,6 @@ export function advertisementFeeInit(ele, list) {
   if (!tbEcharts) tbEcharts = echarts.init(ele);
   let keys = list.F.length > list.L.length ? list.F : list.L;
   tbEcharts.setOption({
-    title: {
-      text: list.name || "",
-      left: "center",
-      top: "3px",
-      textStyle: {
-        fontSize: 17,
-      },
-    },
     tooltip: {
       trigger: "axis",
       formatter: a => {

src/views/report/Advertisement/index.vue

@@ -1,164 +1,166 @@
 <template>
-  <div
-    v-if="orgin.html"
-    :style="'font-size: ' + fontSize + 'px;'"
-    class="Advertisement"
-  >
-    <div class="item">
-      <section class="title">
-        <section>电视广告投放简析</section>
-        <img
-          src="../../../assets/image/640.png"
-          width="96.9922px"
-          style="float: right"
-        />
-      </section>
-      <br />
-      <div class="article" v-html="orgin.html"></div>
-    </div>
-    <div class="item">
-      <section class="title">
-        <section>细分信息对比</section>
-        <img
-          src="../../../assets/image/640.png"
-          width="96.9922px"
-          style="float: right"
-        />
-      </section>
-      <div class="card">
-        <h4 class="xifenxinxiTitle">
-          <div class="right"></div>
-          <div class="left">电视 <span v-text="orgin.day_hb.name"> </span></div>
-        </h4>
+  <div style="font-size: 0;background-color:#fff ;">
+    <img
+      src="https://cxzx.smcic.net/zhoubao/assets/guanggao01.jpg"
+      width="100%"
+      style="margin-bottom: 1em;display: block;"
+      alt=""
+    />
+    <div :style="'height: '+ fontSize +'px;'"></div>
+    <div
+      v-if="orgin.html"
+      :style="'font-size: ' + fontSize + 'px;'"
+      class="Advertisement"
+    >
+      <!-- <div class="item" style="text-align: center; padding-top: 1em">
+      <p v-text="orgin.company"></p>
+      <p v-text="orgin.name"></p>
+      <p v-text="orgin.cycle"></p>
+    </div> -->
+      <div class="item">
+        <section class="title">
+          <section>电视广告投放简析</section>
+          <img
+            src="../../../assets/image/640.png"
+            width="96.9922px"
+            style="float: right"
+          />
+        </section>
         <br />
-        <div ref="adRingRatioCanvas"></div>
+        <div class="article" v-html="orgin.html"></div>
       </div>
-      <div class="card">
-        <h4 class="xifenxinxiTitle">
-          <div class="right"></div>
-          <div class="left">
-            电视: <span v-text="orgin.brand_top.name"> </span>
-          </div>
-        </h4>
-        <h4
-          v-if="orgin.brand_top"
-          style="text-align: center; margin: 1em 0"
-          v-text="orgin.brand_top.name"
-        ></h4>
-        <van-row v-if="orgin.brand_top" class="tableHead">
-          <van-col span="3">排名</van-col>
-          <van-col span="7">品牌</van-col>
-          <van-col span="7">费用(万元)</van-col>
-          <van-col span="7">环比</van-col>
-        </van-row>
-        <div v-if="orgin.brand_top">
-          <van-row
-            class="tableBody"
-            v-for="(item, i) in orgin.brand_top.list || []"
-            :key="item.name + i"
-          >
-            <van-col span="3" v-text="i + 1"></van-col>
-            <van-col span="7" v-text="item.name"></van-col>
-            <van-col
-              span="7"
-              :style="
-                item.huanbi > 0
-                  ? 'color: red'
-                  : item.huanbi < 0
-                  ? 'color: green'
-                  : ''
-              "
-            >
-              <counto
-                :startVal="0"
-                :endVal="item.fee1.N || 0"
-                :duration="1000"
-              ></counto>
-              <span v-if="item.fee1.P">.</span>
-              <counto v-if="item.fee1.P">
-                :startVal="0" :endVal="item.fee1.P || 0" :duration="1000"
-                ></counto
-              >{{ item.fee1.wei }}
-            </van-col>
-            <van-col
-              span="7"
-              :style="
-                item.huanbi > 0
-                  ? 'color: red'
-                  : item.huanbi < 0
-                  ? 'color: green'
-                  : ''
-              "
+      <div class="item">
+        <section class="title">
+          <section>细分信息对比</section>
+          <img
+            src="../../../assets/image/640.png"
+            width="96.9922px"
+            style="float: right"
+          />
+        </section>
+        <div class="card">
+          <h4 class="xifenxinxiTitle">
+            <div class="right"></div>
+            <div class="left">
+              电视 <span v-text="orgin.day_hb.name"> </span>
+            </div>
+          </h4>
+          <br />
+          <div ref="adRingRatioCanvas"></div>
+          <p
+            style="text-indent: 2em; margin-top: 0.5em; padding: 0 3px"
+            v-text="orgin.day_hb.desc"
+          ></p>
+        </div>
+        <div class="card">
+          <h4 class="xifenxinxiTitle">
+            <div class="right"></div>
+            <div class="left">
+              电视: <span v-text="orgin.brand_top.name"> </span>
+            </div>
+          </h4>
+          <br />
+          <van-row v-if="orgin.brand_top" class="tableHead">
+            <van-col span="3">排名</van-col>
+            <van-col span="7">品牌</van-col>
+            <van-col span="7">费用(元)</van-col>
+            <van-col span="7" style="text-align: right; padding-right: 3px"
+              >环比</van-col
             >
-              <span v-if="item.huanbi < 0 && item.huanbi1.N > -1">-</span>
-              <counto
-                :startVal="0"
-                :endVal="item.huanbi1.N || 0"
-                :duration="1000"
-              ></counto>
-              <span v-if="item.huanbi1.P">.</span>
-              <counto
-                v-if="item.huanbi1.P"
-                :startVal="0"
-                :endVal="item.huanbi1.P || 0"
-                :duration="1000"
-              ></counto
-              >{{ item.huanbi.wei }}%
-            </van-col>
           </van-row>
+          <div v-if="orgin.brand_top">
+            <van-row
+              class="tableBody"
+              v-for="(item, i) in orgin.brand_top.list || []"
+              :key="item.name + i"
+            >
+              <van-col span="3" v-text="i + 1"></van-col>
+              <van-col span="7" v-text="item.name"></van-col>
+              <van-col
+                span="7"
+                :style="
+                  item.huanbi > 0
+                    ? 'color: red'
+                    : item.huanbi < 0
+                    ? 'color: green'
+                    : ''
+                "
+              >
+                {{ item.fee }}
+              </van-col>
+              <van-col
+                span="7"
+                :style="
+                  item.huanbi > 0
+                    ? 'color: red;text-align: right;padding-right: 3px;'
+                    : item.huanbi < 0
+                    ? 'color: green;text-align: right;padding-right: 3px;'
+                    : ''
+                "
+              >
+                {{ item.huanbi }}%
+              </van-col>
+            </van-row>
+          </div>
+          <p
+            style="text-indent: 2em; margin-top: 0.5em; padding: 0 3px"
+            v-text="orgin.brand_top.desc"
+          ></p>
         </div>
-      </div>
-      <div class="card">
-        <h4 class="xifenxinxiTitle">
-          <div class="right"></div>
-          <div class="left">
-            电视: <span v-text="orgin.brand_hb.name"> </span>
+        <div class="card">
+          <h4 class="xifenxinxiTitle">
+            <div class="right"></div>
+            <div class="left">
+              电视: <span v-text="orgin.brand_hb.name"> </span>
+            </div>
+          </h4>
+          <br />
+          <div ref="adTop10" class="">
+            <div ref="adTop10Canvas"></div>
           </div>
-        </h4>
-        <br />
-        <div ref="adTop10" class="">
-          <div ref="adTop10Canvas"></div>
+          <p
+            style="text-indent: 2em; margin-top: 0.5em; padding: 0 3px"
+            v-text="orgin.brand_hb.desc"
+          ></p>
         </div>
-      </div>
-      <div class="card">
-        <h4 class="xifenxinxiTitle">
-          <div class="right"></div>
-          <div class="left">
-            电视：
-            <span v-text="orgin.month_thb.name"> </span>
+        <div class="card">
+          <h4 class="xifenxinxiTitle">
+            <div class="right"></div>
+            <div class="left">
+              电视：
+              <span v-text="orgin.month_thb.name"> </span>
+            </div>
+          </h4>
+          <br />
+          <div ref="adTop10" class="">
+            <div ref="adFeeCanvas"></div>
           </div>
-        </h4>
-        <br />
-        <div ref="adTop10" class="">
-          <div ref="adFeeCanvas"></div>
+          <p
+            style="text-indent: 2em; margin-top: 0.5em; padding: 0 3px"
+            v-text="orgin.month_thb.desc"
+          ></p>
+        </div>
+        <div class="bottom">
+          <span
+            style="
+              display: block;
+              font-size: 0.9rem;
+              vertical-align: middle;
+              padding-left: 5px;
+              font-weight: 600;
+            "
+          >
+            本数据由“陕西广电融媒体集团大数据平台”提供。
+            <p>技术支持 白帆 13325452244;汪朝涵：17302954998</p>
+          </span>
         </div>
       </div>
     </div>
-    <div class="bottom">
-      <img
-        src="https://djweb.smcic.net/img/smcLogo.png"
-        width="30%"
-        style="vertical-align: middle"
-        alt=""
-      />
-      <span
-        style="
-          display: inline-block;
-          width: 68%;
-          vertical-align: middle;
-          padding-left: 5px;
-          font-weight: 600;
-        "
-      >
-        本数据由<span style="white-space: nowrap;" >“陕西广电融媒体集团大数据平台”</span>提供。技术支持 汪朝涵：17302954998
-      </span>
-    </div>
   </div>
 </template>
 
 <script>
 // @ is an alias to /src
-import counto from "@/components/counto/vue-countTo.vue";
 import watermark from "watermark-package";
 import { Col as vanCol, Row as vanRow } from "vant";
 import "vant/lib/col/style/index";
@@ -182,9 +184,13 @@ export default {
     };
   },
   mounted() {
-    if (!this.$route.query.auto) return;
+    if (
+      this.$route.query.auto !==
+      "06fd56cdf5a6cfc3a2139cc8514d05aa0439ee8c1fb4d81145bc9647"
+    )
+      return;
     this.fontSize = (document.body.offsetWidth / 24).toFixed(2) - 0;
-    if (document.body.offsetWidth > 677) this.fontSize = 22;
+    if (document.body.offsetWidth > 677) this.fontSize = 20;
     const time = new dayJs(this.$route.query.date);
     watermark.setWaterMark({
       w_texts: ["陕西视听大数据"],
@@ -200,17 +206,12 @@ export default {
       const Res = r || {};
       const brand_top = Res.brand_top || { list: [] };
       for (let i = 0; i < brand_top.list.length; i++) {
-        brand_top.list[i].fee1 = this.formatType(
-          brand_top.list[i].fee / 10000,
-          2
-        );
-        brand_top.list[i].huanbi1 = this.formatType(
-          brand_top.list[i].huanbi * 100,
-          2
-        );
+        brand_top.list[i].fee = this.formatType(brand_top.list[i].fee, 2, true);
+        brand_top.list[i].huanbi = (brand_top.list[i].huanbi * 100).toFixed(2);
       }
       Res.brand_top = brand_top;
       this.orgin = Res;
+      console.log(this.orgin);
       this.$nextTick(() => {
         this.createChart();
         window.onresize = () => {
@@ -232,20 +233,12 @@ export default {
     },
     formatType(num, W) {
       let N = this.formatNum(num, 2);
-      let wei = "";
       if (N >= 100000000) {
-        N = (N / 100000000).toFixed(W || 2);
-        wei = "亿";
+        N = (N / 100000000).toFixed(W || 2) + "亿";
       } else if (N >= 10000) {
-        N = (N / 10000).toFixed(W || 2);
-        wei = "万";
+        N = (N / 10000).toFixed(W || 2) + "万";
       }
-      N = N.toString().split(".");
-      return {
-        N: (N[0] || 0) * 1,
-        P: (N[1] || 0) * 1,
-        wei,
-      };
+      return N;
     },
     createChart() {
       let width = this.$refs.adTop10.offsetWidth,
@@ -256,28 +249,23 @@ export default {
 
       const ringRatioF = [];
       const ringRatioL = [];
-      const ringRatioC = [];
       const day_hb = this.orgin.day_hb ? this.orgin.day_hb.list : [];
       for (let i = 0; i < day_hb.length; i++) {
         const v = day_hb[i];
         const type = (v.pdt || "").split("-");
         const type1 = (v.dt || "").split("-");
-        const type2 = (v.ppdt || "").split("-");
-        v.pfee && ringRatioF.push({
-          date: v.pdt || "",
-          type: [type[0], type[1]].join("-"),
-          value: v.pfee * 1,
-        });
-        v.ppfee && ringRatioC.push({
-          date: v.ppdt || "",
-          type: [type2[0], type2[1]].join("-"),
-          value: v.ppfee * 1,
-        });
-        v.fee && ringRatioL.push({
-          date: v.dt || "",
-          type: [type1[0], type1[1]].join("-"),
-          value: v.fee * 1,
-        });
+        v.pfee &&
+          ringRatioF.push({
+            date: v.pdt || "",
+            type: [type[0], type[1]].join("-"),
+            value: v.pfee * 1,
+          });
+        v.fee &&
+          ringRatioL.push({
+            date: v.dt || "",
+            type: [type1[0], type1[1]].join("-"),
+            value: v.fee * 1,
+          });
       }
       const lineF = [];
       const lineL = [];
@@ -325,7 +313,6 @@ export default {
         advertisementRingRatioInit(this.$refs.adRingRatioCanvas, {
           L: ringRatioL,
           F: ringRatioF,
-          C: ringRatioC,
           name: this.orgin.day_hb.name,
         });
       line1L.length &&
@@ -338,14 +325,14 @@ export default {
     },
   },
   beforeUnmount: function () {},
-  components: { vanCol, vanRow, counto },
+  components: { vanCol, vanRow },
 };
 </script>
 
 <style>
 .Advertisement {
   height: 100%;
-  padding: 22px 5px 12px 5px;
+  padding: 0px 5px 12px 5px;
   background-color: #fff;
 }
 .Advertisement .item {

src/views/report/Mobile/index.vue

@@ -35,10 +35,7 @@
             >
               {{ o + 1 }}
             </van-col>
-            <van-col
-              span="7"
-              :class="{ td: true }"
-            >
+            <van-col span="7" :class="{ td: true }">
               {{ v.name }}
             </van-col>
             <van-col span="7" :class="{ td: true }">
@@ -92,13 +89,7 @@
                   :duration="1000"
                 ></counto>
                 <span v-if="ratios.publish_countP">.</span>
-                <counto
-                  v-if="ratios.publish_countP"
-                  :startVal="0"
-                  :endVal="ratios.publish_countP || 0"
-                  :duration="1000"
-                ></counto
-                >{{ ratios.publish_countWei }}
+                {{ (ratios.publish_countP > 0 ? ratios.publish_countP : '') + ratios.publish_countWei }}
               </van-col>
               <van-col span="7" class="td"> 阅读量： </van-col>
               <van-col span="5" class="td">
@@ -108,13 +99,7 @@
                   :duration="1000"
                 ></counto>
                 <span v-if="ratios.read_countP">.</span>
-                <counto
-                  v-if="ratios.read_countP"
-                  :startVal="0"
-                  :endVal="ratios.read_countP || 0"
-                  :duration="1000"
-                ></counto
-                >{{ ratios.read_countWei }}
+                {{ (ratios.read_countP > 0 ? ratios.read_countP : '') + ratios.read_countWei }}
               </van-col>
             </van-row>
             <van-cell-group border title="平台账号">
@@ -141,13 +126,7 @@
                           :duration="1000"
                         ></counto>
                         <span v-if="v.huanbi1P">.</span>
-                        <counto
-                          v-if="v.huanbi1P"
-                          :startVal="0"
-                          :endVal="v.huanbi1P || 0"
-                          :duration="1000"
-                        ></counto
-                        >%
+                        {{v.huanbi1P}}%
                       </div>
                     </template>
                   </van-cell>
@@ -204,22 +183,23 @@
       </van-cell-group>
     </div>
     <div class="bottom content">
-      <img
+      <!-- <img
         src="https://djweb.smcic.net/img/202104021135578156.png"
         width="50%"
         style="vertical-align: middle"
         alt=""
-      />
+      /> -->
       <span
         style="
-          display: inline-block;
-          width: 45%;
+          display: block;
+          font-size: 0.9rem;
           vertical-align: middle;
           padding-left: 5px;
           font-weight: 600;
         "
       >
-        本数据由陕西广电融媒体集团大数据平台提供。技术支持 汪朝涵：17302954998
+        本数据由“陕西广电融媒体集团大数据平台”提供。
+        <p>技术支持 白帆 13325452244;汪朝涵：17302954998</p>
       </span>
     </div>
   </div>
@@ -273,7 +253,7 @@ export default {
   },
   watch: {},
   mounted() {
-    if (!this.$route.query.auto) return;
+    if (this.$route.query.auto !== '06fd56cdf5a6cfc3a2139cc8514d05aa0439ee8c1fb4d81145bc9647') return;
     this.fontSize = (document.body.offsetWidth / 24).toFixed(2) - 0;
     if (document.body.offsetWidth > 677) this.fontSize = 22;
     watermark.setWaterMark({
@@ -317,7 +297,7 @@ export default {
       N = N.toString().split(".");
       return {
         N: (N[0] || 0) * 1,
-        P: (N[1] || 0) * 1,
+        P: N[1] || 0,
         wei,
       };
     },

src/views/report/Traditional/index.vue

@@ -1,220 +1,237 @@
 <template>
-  <div class="tv-list" :style="'font-size:' + fontSize + 'px'">
-    <div class="content">
-      <div class="titleTop">
-        {{ date.join("-") }}
-      </div>
-      <div class="itemHead">
-        <van-row>
-          <van-col span="3" class="td"> 排名 </van-col>
-          <van-col span="8" class="td"> 频道 </van-col>
-          <van-col span="5" class="td"> 市场份额 </van-col>
-          <!-- td2 :style="width > 667 ? 'line-height: 2.5em' : 'line-height: 1.5em'" -->
-          <van-col span="6" class="td"> 人均时长(分) </van-col>
-          <van-col span="2" class="td">
-            <img
-              src="../../../assets/image/shou.gif"
-              width="26px"
-              alt=""
-              style="vertical-align: middle"
-            />
-          </van-col>
-        </van-row>
-      </div>
-      <div v-for="(v, o) in platfromData || []" :key="v.name">
-        <div
-          style="border-bottom: 1px dashed #eee; margin: 11px 0 0 0"
-          v-if="o === 20"
-        ></div>
-        <van-row class="item" @click="() => showPopup(o)">
-          <van-col
-            span="3"
-            :class="{ td: true }"
-            :style="{ color: color[o] || '#000', fontWeight: 600 }"
-          >
-            {{ v.rank }}
-          </van-col>
-          <van-col span="8" :class="{ td: true }">
-            {{ v.channelname }}
-          </van-col>
-          <van-col span="5" :class="{ td: true }">
-            {{ formatNum(v.occrate, 2) }}%
-            <van-icon
-              v-if="v.occrate_change !== '相等'"
-              name="down"
-              :color="v.occrate_change === '上升' ? '#f00' : '#0f0'"
-              :class="{ rise: v.occrate_change === '上升' }"
-            />
-          </van-col>
-          <van-col span="6" :class="{ td: true }">
-            {{ timeFormat(v.user_duration) }}
-            <van-icon
-              v-if="v.user_duration_change !== '相等'"
-              name="down"
-              :color="v.user_duration_change === '上升' ? '#f00' : '#0f0'"
-              :class="{ rise: v.user_duration_change === '上升' }"
-            />
-          </van-col>
-          <van-col span="2" class="td" style="cursor: pointer">
-            <van-icon name="arrow" />
-          </van-col>
-        </van-row>
-      </div>
-      <van-popup
-        :style="{ height: '100%', width: '100%' }"
-        position="right"
-        v-model="show"
-      >
-        <div class="main">
-          <van-cell
-            title-style="flex: 3"
-            :title="ratios.schedulename"
-            :label="ratios.channelname"
-          >
-            <div @click="show = false" style="color: #5470c6; cursor: pointer">
-              <van-icon name="revoke" />
-            </div>
-          </van-cell>
-          <van-cell-group title="视听收视新指标">
-            <van-row>
-              <van-col span="7" class="td"> 收视次数： </van-col>
-              <van-col span="5" class="td">
-                <counto
-                  :startVal="0"
-                  :endVal="ratios.hitcount || 0"
-                  :duration="1000"
-                ></counto>
-                <span v-if="ratios.hitcountP">.</span>
-                <counto
-                  v-if="ratios.hitcountP"
-                  :startVal="0"
-                  :endVal="ratios.hitcountP || 0"
-                  :duration="1000"
-                ></counto
-                >{{ ratios.hitcountWei }}
-              </van-col>
-
-              <van-col span="7" class="td"> 用户数： </van-col>
-              <van-col span="5" class="td">
-                <counto
-                  :startVal="0"
-                  :endVal="ratios.usrcount || 0"
-                  :duration="1000"
-                ></counto>
-                <span v-if="ratios.usrcountP">.</span>
-                <counto
-                  v-if="ratios.usrcountP"
-                  :startVal="0"
-                  :endVal="ratios.usrcountP || 0"
-                  :duration="1000"
-                ></counto
-                >{{ ratios.usrcountWei }}
-              </van-col>
-
-              <van-col span="10" class="td"> 月度活跃用户数： </van-col>
-              <van-col span="5" class="td">
-                <counto
-                  :startVal="0"
-                  :endVal="ratios.usrcount || 0"
-                  :duration="1000"
-                ></counto>
-                <span v-if="ratios.usrcountP">.</span>
-                <counto
-                  v-if="ratios.usrcountP"
-                  :startVal="0"
-                  :endVal="ratios.usrcountP || 0"
-                  :duration="1000"
-                ></counto
-                >{{ ratios.usrcountWei }}
-              </van-col>
-            </van-row>
-          </van-cell-group>
-          <van-cell-group title="传统指标">
-            <van-row>
-              <van-col span="7" class="td"> 收视时长: </van-col>
-              <van-col span="6" class="td">
-                <counto
-                  :startVal="0"
-                  :endVal="ratios.timecount || 0"
-                  :duration="1000"
-                ></counto>
-                <span v-if="ratios.timecountP">.</span>
-                <counto
-                  v-if="ratios.timecountP"
-                  :startVal="0"
-                  :endVal="ratios.timecountP || 0"
-                  :duration="1000"
-                ></counto
-                >{{ ratios.timecountWei }}
-              </van-col>
-              <van-col span="5" class="td"> 到达率： </van-col>
-              <van-col span="6" class="td"
-                >{{ formatNum(ratios.reachrate, 2) }}%
-              </van-col>
-              <van-col span="7" class="td"> 人均时长： </van-col>
-              <van-col span="6" class="td"
-                >{{ timeFormat(ratios.user_duration) }}分钟
-              </van-col>
-              <van-col span="5" class="td"> 收视率： </van-col>
-              <van-col span="6" class="td">
-                {{ formatNum(ratios.watchrate, 2) }}%
-              </van-col>
-              <van-col span="7" class="td"> 市场占有率： </van-col>
-              <van-col span="6" class="td"
-                >{{ formatNum(ratios.occrate, 2) }}%
-              </van-col>
-              <van-col span="5" class="td"> 忠诚度： </van-col>
-              <van-col span="6" class="td"
-                >{{ formatNum(ratios.loyalty, 2) }}%
-              </van-col>
-            </van-row>
-          </van-cell-group>
-          <div ref="pie"></div>
-          <div ref="day"></div>
+  <div style="font-size: 0;background-color:#fff ;">
+    <img
+      src="https://cxzx.smcic.net/zhoubao/assets/tv01.jpg"
+      width="100%"
+      style="margin-bottom: 1em;display: block;"
+      alt=""
+    />
+        <p
+          :style="'text-indent: 2em; font-weight: 600; padding: 0.5em 3px;font-size: '+ fontSize +'px;'"
+          v-text="title.desc"
+        ></p>
+    <div :style="'height: '+ fontSize +'px;'"></div>
+    <div class="tv-list" :style="'font-size:' + fontSize + 'px'">
+      <div class="content">
+        <!-- <div class="titleTop">
+        <p v-text="title.company"></p>
+        <p v-text="title.name"></p>
+        <p v-text="title.title"></p>
+      </div> -->
+        <div class="itemHead">
+          <van-row>
+            <van-col span="3" class="td"> 排名 </van-col>
+            <van-col span="7" class="td"> 频道 </van-col>
+            <van-col span="5">
+              <van-popover
+                v-model="fene"
+                trigger="click"
+                @select="fene = !fene"
+              >
+                <div style="padding: 5px">
+                  市场份额=本频道收视率/所有频道收视率
+                </div>
+                <template #reference>
+                  <p class="td">市场份额</p>
+                </template>
+              </van-popover>
+            </van-col>
+            <!-- td2 :style="width > 667 ? 'line-height: 2.5em' : 'line-height: 1.5em'" -->
+            <van-col span="7">
+              <van-popover
+                v-model="shichang"
+                trigger="click"
+                @select="shichang = !shichang"
+              >
+                <div style="padding: 5px">
+                  市场份额=本频道收视率/所有频道收视率
+                </div>
+                <template #reference>
+                  <p class="td">周人均时长(分)</p>
+                </template>
+              </van-popover>
+            </van-col>
+            <van-col span="2" class="td">
+              <img
+                src="../../../assets/image/shou.gif"
+                width="26px"
+                alt=""
+                style="vertical-align: middle"
+              />
+            </van-col>
+          </van-row>
         </div>
-        <div class="bottom content">
-          <img
+        <div v-for="(v, o) in platfromData || []" :key="v.name">
+          <div
+            style="border-bottom: 1px dashed #eee; margin: 11px 0 0 0"
+            v-if="o === 20"
+          ></div>
+          <van-row class="item" @click="() => showPopup(o)">
+            <van-col
+              span="3"
+              :class="{ td: true }"
+              :style="{ color: color[o] || '#000', fontWeight: 600 }"
+            >
+              {{ v.rank }}
+            </van-col>
+            <van-col span="7" :class="{ td: true }">
+              {{ v.channelname }}
+            </van-col>
+            <van-col span="5" :class="{ td: true }">
+              {{ formatNum(v.occrate, 2) }}%
+              <van-icon
+                v-if="v.occrate_change !== '相等'"
+                name="down"
+                :color="v.occrate_change === '上升' ? '#f00' : '#0f0'"
+                :class="{ rise: v.occrate_change === '上升' }"
+              />
+            </van-col>
+            <van-col span="7" :class="{ td: true }">
+              {{ timeFormat(v.user_duration) }}
+              <van-icon
+                v-if="v.user_duration_change !== '相等'"
+                name="down"
+                :color="v.user_duration_change === '上升' ? '#f00' : '#0f0'"
+                :class="{ rise: v.user_duration_change === '上升' }"
+              />
+            </van-col>
+            <van-col span="2" class="td" style="cursor: pointer">
+              <van-icon name="arrow" />
+            </van-col>
+          </van-row>
+        </div>
+        <van-popup
+          :style="{ height: '100%', width: '100%' }"
+          position="right"
+          v-model="show"
+        >
+          <div class="main">
+            <van-cell
+              title-style="flex: 3"
+              :title="ratios.schedulename"
+              :label="ratios.channelname"
+            >
+              <div
+                @click="show = false"
+                style="color: #5470c6; cursor: pointer"
+              >
+                <van-icon name="revoke" />
+                {{ ratios.channelname }}
+              </div>
+            </van-cell>
+            <van-cell-group title="视听收视新指标">
+              <van-row>
+                <van-col span="10" class="td"> 收视时长: </van-col>
+                <van-col span="14" class="td">
+                  <counto
+                    :startVal="0"
+                    :endVal="ratios.timecount || 0"
+                    :duration="1000"
+                  ></counto>
+                  <span v-if="ratios.timecountP">.</span>
+                  {{
+                    (ratios.timecountP > 0 ? ratios.timecountP : "") +
+                    ratios.timecountWei
+                  }}
+                </van-col>
+                <van-col span="10" class="td"> 收视次数： </van-col>
+                <van-col span="14" class="td">
+                  <counto
+                    :startVal="0"
+                    :endVal="ratios.hitcount || 0"
+                    :duration="1000"
+                  ></counto>
+                  <span v-if="ratios.hitcountP">.</span>
+                  {{
+                    (ratios.hitcountP > 0 ? ratios.hitcountP : "") +
+                    ratios.hitcountWei
+                  }}
+                </van-col>
+
+                <van-col span="10" class="td"> 周活跃户数： </van-col>
+                <van-col span="14" class="td">
+                  <counto
+                    :startVal="0"
+                    :endVal="ratios.usrcount || 0"
+                    :duration="1000"
+                  ></counto>
+                  <span v-if="ratios.usrcountP">.</span>
+                  {{
+                    (ratios.usrcountP > 0 ? ratios.usrcountP : "") +
+                    ratios.usrcountWei
+                  }}
+                </van-col>
+              </van-row>
+            </van-cell-group>
+            <van-cell-group title="传统指标">
+              <van-row>
+                <van-col span="5" class="td"> 到达率： </van-col>
+                <van-col span="5" class="td"
+                  >{{ formatNum(ratios.reachrate, 2) }}%
+                </van-col>
+                <van-col span="7" class="td"> 周人均时长： </van-col>
+                <van-col span="7" class="td"
+                  >{{ timeFormat(ratios.user_duration, 0) }}分钟
+                </van-col>
+                <van-col span="5" class="td"> 收视率： </van-col>
+                <van-col span="5" class="td">
+                  {{ formatNum(ratios.watchrate, 2) }}%
+                </van-col>
+                <van-col span="7" class="td"> 市场占有率： </van-col>
+                <van-col span="7" class="td"
+                  >{{ formatNum(ratios.occrate, 2) }}%
+                </van-col>
+                <van-col span="5" class="td"> 忠诚度： </van-col>
+                <van-col span="5" class="td"
+                  >{{ formatNum(ratios.loyalty, 2) }}%
+                </van-col>
+              </van-row>
+            </van-cell-group>
+            <div ref="pie"></div>
+            <div ref="day"></div>
+          </div>
+          <div class="bottom content">
+            <!-- <img
             src="https://djweb.smcic.net/img/smcLogo.png"
             width="30%"
             style="vertical-align: middle"
             alt=""
-          />
-          <span
-            style="
-              display: inline-block;
-              width: 68%;
-              vertical-align: middle;
-              padding-left: 5px;
-              font-weight: 600;
-            "
-          >
-            本数据由<span style="white-space: nowrap"
-              >“陕西广电融媒体集团大数据平台”</span
-            >提供。技术支持 汪朝涵：17302954998
-          </span>
-        </div>
-      </van-popup>
-    </div>
-    <div class="bottom content">
-      <img
+          /> -->
+            <span
+              style="
+                display: block;
+                font-size: 0.9rem;
+                vertical-align: middle;
+                padding-left: 5px;
+                font-weight: 600;
+              "
+            >
+              本数据由“陕西广电融媒体集团大数据平台”提供。
+              <p>技术支持 白帆 13325452244;汪朝涵：17302954998</p>
+            </span>
+          </div>
+        </van-popup>
+      </div>
+      <div class="bottom content">
+        <!-- <img
         src="https://djweb.smcic.net/img/smcLogo.png"
         width="30%"
         style="vertical-align: middle"
         alt=""
-      />
-      <span
-        style="
-          display: inline-block;
-          width: 68%;
-          vertical-align: middle;
-          padding-left: 5px;
-          font-weight: 600;
-        "
-      >
-        本数据由<span style="white-space: nowrap"
-          >“陕西广电融媒体集团大数据平台”</span
-        >提供。技术支持 汪朝涵：17302954998
-      </span>
+      /> -->
+        <span
+          style="
+            display: block;
+            font-size: 0.9rem;
+            vertical-align: middle;
+            padding-left: 5px;
+            font-weight: 600;
+          "
+        >
+          本数据由“陕西广电融媒体集团大数据平台”提供。
+          <p>技术支持 白帆 13325452244;汪朝涵：17302954998</p>
+        </span>
+      </div>
     </div>
   </div>
 </template>
@@ -230,7 +247,9 @@ import {
   Popup as vanPopup,
   cellGroup as vanCellGroup,
   Cell as vanCell,
+  Popover as vanPopover,
 } from "vant";
+import "vant/lib/popover/style/index";
 import "vant/lib/cell-group/style/index";
 import "vant/lib/cell/style/index";
 import "vant/lib/popup/style/index";
@@ -247,6 +266,8 @@ export default {
   name: "tv-list",
   data() {
     return {
+      shichang: false,
+      fene: false,
       fontSize: 17,
       show: false,
       charts: undefined,
@@ -255,13 +276,17 @@ export default {
       color: ["#ff0036", "#ff9b00", "#ffcc00"],
       echarts: undefined,
       dayEcharts: undefined,
-      date: [],
+      title: {},
       width: document.body.offsetWidth || 0,
     };
   },
   watch: {},
   mounted() {
-    if (!this.$route.query.auto) return;
+    if (
+      this.$route.query.auto !==
+      "06fd56cdf5a6cfc3a2139cc8514d05aa0439ee8c1fb4d81145bc9647"
+    )
+      return;
     this.fontSize = (document.body.offsetWidth / 24).toFixed(2) - 0;
     if (document.body.offsetWidth > 677) this.fontSize = 22;
     watermark.setWaterMark({
@@ -274,13 +299,20 @@ export default {
     let D = new Date(time);
     const lasetDay = new Dayjs(D.getTime() - D.getDay() * 86400000);
     const firstDay = new Dayjs(lasetDay - 6 * 86400000);
-    this.date = [firstDay.format("YYYY-MM-DD"), lasetDay.format("YYYY-MM-DD")];
     jsonZhou({
       start: firstDay.format("YYYYMMDD"),
       end: lasetDay.format("YYYYMMDD"),
     })
       .then(res => {
-        this.platfromData = res || [];
+        console.log(res);
+        const title = {
+          company: res.company || "",
+          name: res.name || "",
+          title: res.title || "",
+          desc: res.desc || "",
+        };
+        this.title = title;
+        this.platfromData = res.list || [];
         this.$emit("start", {
           status: 200,
         });
@@ -327,13 +359,13 @@ export default {
       N = N.toString().split(".");
       return {
         N: (N[0] || 0) * 1,
-        P: (N[1] || 0) * 1,
+        P: N[1] || 0,
         wei,
       };
     },
-    timeFormat(t) {
+    timeFormat(t,w) {
       const Time = t || 0;
-      let out = Time.toFixed(1) - 0;
+      let out = Time.toFixed(w || 0) - 0;
       return out;
     },
     showPopup(i) {
@@ -382,10 +414,10 @@ export default {
       });
       this.dayEcharts.setOption({
         title: {
-          text: "用户趋势",
+          text: "家庭户收视规模",
           subtext: this.ratios.user_count_compare
-            ? this.ratios.user_count_compare
-            : "",
+            ? this.ratios.user_count_compare + " 单位：户"
+            : "单位：户",
           textStyle: {
             fontSize: 14,
           },
@@ -409,7 +441,7 @@ export default {
             formatter: e => {
               const T = this.formatType(e);
               let out = T.N;
-              if (T.P) out += "." + T.P;
+              if (T.P > 0) out += "." + (T.P - 0);
               out += T.wei;
               return out;
             },
@@ -439,61 +471,39 @@ export default {
           }
         );
       }
-      const key = [],
-        value = [];
-      let max = 0;
-      this.ratios.duration_list.map(v => {
-        let val = (v.value * 100).toFixed(2) - 0;
-        key.push(v.range);
-        value.push(val);
-        max < val && (max = val);
-      });
-      max += max * 0.2;
-      max > 100 && (max = 100);
       this.echarts.setOption({
         title: {
           text: "观看时长用户分布",
+          subtext: "单位：%",
           textStyle: {
             fontSize: 14,
           },
         },
-        radar: {
-          shape: "circle",
-          center: ["50%", "50%"],
-          radius: 100,
-          axisName: {
-            color: "#000",
-          },
-          indicator: key.map((v, i) => {
-            let m = value[i] / max,
-              val = max;
-            m <= 0.5 ? (val = 0.5 * max) : "";
-            return {
-              name: v,
-              max: val,
-            };
-          }),
-        },
+        color: [
+          "#87cefa",
+          "#00bfff",
+          "#1e90ff",
+          "#0000ff",
+          "#00008b",
+          "#191970",
+          "#000080",
+          "#0000cd",
+          "#4169e1",
+          "#6495ed",
+        ],
         series: [
           {
-            type: "radar",
-            data: [
-              {
-                value,
-                label: {
-                  show: true,
-                  formatter: function (params) {
-                    return params.value.toFixed(0) + "%";
-                  },
-                },
-                itemStyle: {
-                  color: "#F9713C",
-                },
-                areaStyle: {
-                  opacity: 0.1,
-                },
-              },
-            ],
+            name: "Nightingale Chart",
+            type: "pie",
+            radius: [30, 70],
+            center: ["50%", "50%"],
+            data: this.ratios.duration_list.map(v => {
+              let bfb = (v.value * 100).toFixed(0) - 0;
+              return {
+                value: bfb,
+                name: v.range + "\n 占比" + bfb + "%",
+              };
+            }),
           },
         ],
       });
@@ -508,6 +518,7 @@ export default {
     vanPopup,
     vanCell,
     vanCellGroup,
+    vanPopover,
   },
 };
 </script>
@@ -558,10 +569,17 @@ export default {
   transform: rotate(180deg);
 }
 .titleTop {
-  height: 80px;
-  line-height: 80px;
+  padding: 1em 0;
+  font-weight: 600;
   background-image: linear-gradient(to right, #014392, #008fc4, #00428c);
   color: #fff;
   text-align: center;
 }
 </style>
+<style>
+.van-cell-group__title {
+  font-size: 1.1rem;
+  color: #000;
+  font-weight: 600;
+}
+</style>