From b35e9e4aebcec3b36ccc7cab4639ff2ad74aea97 Mon Sep 17 00:00:00 2001
From: zzzz <690498789@qq.com>
Date: Sat, 23 Mar 2024 18:10:25 +0800
Subject: [PATCH] 1

---
 src/page/kline/index.vue |  645 ++++++++++++++++++++++++++++++++++++++++++++++------------
 1 files changed, 510 insertions(+), 135 deletions(-)

diff --git a/src/page/kline/index.vue b/src/page/kline/index.vue
index 933266b..350ad70 100644
--- a/src/page/kline/index.vue
+++ b/src/page/kline/index.vue
@@ -4,53 +4,56 @@
       <div class="detail_title">
         <div class="ti_cont">
           <div class="top_back">
-            <div class="left_back" @click="handleBack()">
+            <div class="left_back" @click="handleBackaa()">
               <img src="../../assets/img/zuojiantou.png" alt />
             </div>
             <div class="right_title">
-              <div class="t_t">
-                <span>{{ kLineDetails.name }}</span>
+              <div class="t_t" style="white-space: nowrap;">
+                <span>{{ singDetails.spell }}</span>
               </div>
               <div class="b_t">
                 <span>{{ singDetails.code }}</span>
               </div>
             </div>
           </div>
-          <div class="right_money sss" @click="openDialog()">
+          <div class="right_money sss">
             <div class="content_money">
               <div class="top_price">
                 <div class="left">
-                  <span>{{ '余额' }}</span>
+                  <span>{{ $t('hj47') }}</span>
                 </div>
                 <div class="right">
-                  <span v-if="$store.state.userInfo.userAmt==undefined">¥0.00</span>
-                  <span
-                    v-if="$store.state.userInfo&&kLineDetails.if_zhishu!='0'"
-                    style="white-space: nowarp;"
-                  >
-                    {{ '¥' + $store.state.userInfo.userIndexAmt
+                  <span v-if="$store.state.userInfo.userAmt == undefined">₹0.00</span>
+                  <span v-if="$store.state.userInfo && kLineDetails.if_zhishu != '0'" style="white-space: nowarp;">
+                    {{ kLineDetails.if_us == 1 ? '$' + Number(Number($store.state.userInfo.userIndexAmt) /
+                        7.1).toFixed(2) :
+                        kLineDetails.if_us == 2 ? 'HK$' + (Number($store.state.userInfo.userIndexAmt) / 0.9).toFixed(2) :
+                          '₹' +
+                          $store.state.userInfo.userIndexAmt
                     }}
                   </span>
-                  <span
-                    v-if="$store.state.userInfo.userAmt!=undefined&&kLineDetails.if_zhishu=='0'"
-                    style="white-space: nowarp;"
-                  >
-                    {{ '¥ ' + $store.state.userInfo.userAmt
-                    }}
+                  <span v-if="$store.state.userInfo.userAmt != undefined && kLineDetails.if_zhishu == '0'"
+                    style="white-space: nowarp;">
+                    <!-- {{ kLineDetails.if_us == 1 ? '$' + Number(Number($store.state.userInfo.userAmt) / 7.1).toFixed(2) :
+                        kLineDetails.if_us == 2 ? 'HK$' + (Number($store.state.userInfo.userAmt) / 0.9).toFixed(2) : '₹ ' +
+                          $store.state.userInfo.userAmt
+                    }} -->
+                    {{ '₹ ' +  parseFloat($store.state.userInfo.enableAmt.toFixed(2)).toLocaleString()
+                  }}
                   </span>
                 </div>
                 <div class="sanjiao">
-                  <img
+                  <!-- <img
                     :class="dialogFlag ? 'xuanz' : ''"
                     style="transition: all 0.5s;"
                     src="../../assets/img/xiala.png"
                     alt
-                  />
+                  /> -->
                 </div>
               </div>
               <div class="bottom_balance">
                 <div>
-                  <span>{{ '可用余额' }}</span>
+                  <span>{{ $t('hj48') }}</span>
                 </div>
               </div>
             </div>
@@ -59,20 +62,28 @@
         <div class="real_time_detail">
           <div class="left_now_price">
             <div class="top_now">
-              <span :class="singDetails.nowPrice - singDetails.preclose_px < 0 ? 'price green' : 'price red'">{{
+              <!-- <span :class="singDetails.nowPrice - singDetails.preclose_px > 0 ? 'price green' : 'price red'">{{
+                  singDetails.nowPrice
+              }}</span> -->
+              <span :class="singDetails.hcrate > 0 ? 'price green' : 'price red'">{{
                   singDetails.nowPrice
               }}</span>
             </div>
             <div class="bottom_now">
               <div>
-                <span v-if="singDetails.nowPrice == 0">-</span>
-                <span v-else>{{ singDetails.nowPrice - singDetails.preclose_px > 0
+                <span v-if="singDetails.nowPrice === 0">-</span>
+                <!-- <span v-else>{{ singDetails.nowPrice - singDetails.preclose_px > 0
                     ? '+' : ''
-                }}{{ (singDetails.nowPrice - singDetails.preclose_px).toFixed(2) }}</span>
+                }}{{ (singDetails.nowPrice - singDetails.preclose_px).toFixed(2) }}</span> -->
+                <span v-else>
+                  {{ (singDetails.nowPrice - singDetails.preclose_px).toFixed(2) || 0 }}</span>
               </div>
-              <div class="tew" :class="singDetails.nowPrice - singDetails.preclose_px < 0 ? 'number green' : 'number red'">
-                <span v-if="singDetails.nowPrice == 0">-</span>
-                <span v-else>({{ singDetails.nowPrice - singDetails.preclose_px > 0 ? '+' : '' }}
+              <div class="tew"
+                :class="singDetails.hcrate > 0 ? 'number green' : 'number red'">
+                <span v-if="singDetails.nowPrice === 0">-</span>
+                <!-- <span v-else>({{ singDetails.nowPrice - singDetails.preclose_px > 0 ? '+' : '' }}
+                  {{ singDetails.hcrate ? singDetails.hcrate : '0' }}%)</span> -->
+                  <span v-else>({{ singDetails.hcrate > 0 ? '+' : '' }}
                   {{ singDetails.hcrate ? singDetails.hcrate : '0' }}%)</span>
               </div>
             </div>
@@ -80,28 +91,40 @@
           <div class="right_ets">
             <div class="tops">
               <div class="lefts topes">
-                <span class="titles">{{ '今开' }}</span>
-                <span :class="singDetails.nowPrice - singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+                <span class="titles">{{ $t('hj72') }}</span>
+                <!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+                    singDetails.open_px
+                }}</span> -->
+                <span :class="singDetails.hcrate > 0 ? 'number green' : 'number red'">{{
                     singDetails.open_px
                 }}</span>
               </div>
               <div class="rights topes">
-                <span class="titles">{{ '最高' }}</span>
-                <span :class="singDetails.nowPrice - singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+                <span class="titles">{{ $t('hj73') }}</span>
+                <!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+                    singDetails.today_max
+                }}</span> -->
+                <span :class="singDetails.hcrate > 0 ? 'number green' : 'number red'">{{
                     singDetails.today_max
                 }}</span>
               </div>
             </div>
             <div class="bottoms">
               <div class="lefts bots">
-                <span class="titles">{{ '昨收' }}</span>
-                <span :class="singDetails.nowPrice - singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+                <span class="titles">{{ $t('hj74') }}</span>
+                <!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+                    singDetails.preclose_px
+                }}</span> -->
+                <span :class="singDetails.hcrate > 0 ? 'number green' : 'number red'">{{
                     singDetails.preclose_px
                 }}</span>
               </div>
               <div class="rights bots">
-                <span class="titles">{{ '最低' }}</span>
-                <span :class="singDetails.nowPrice - singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+                <span class="titles">{{ $t('hj75') }}</span>
+                <!-- <span :class="singDetails.preclose_px < 0 ? 'number green' : 'number red'">{{
+                    singDetails.today_min
+                }}</span> -->
+                <span :class="singDetails.hcrate > 0 ? 'number green' : 'number red'">{{
                     singDetails.today_min
                 }}</span>
               </div>
@@ -110,16 +133,17 @@
         </div>
       </div>
       <div class="k_line_detail">
-        <Kline />
+        <Kline :type="singDetails.type" />
       </div>
-      <div class="priect_top_bottom">
+      <div class="priect_top_bottom" style="display: none"
+        v-if="(kLineDetails.if_us != 1 && kLineDetails.type != 'hk') && kLineDetails.type != 'hk' && kLineDetails.if_zhishu == 0">
         <div class="t_title">
-          <span>{{ '五档' }}</span>
+          <span>{{ $t('hj76') }}</span>
         </div>
         <div class="charts">
           <div class="left_s">
             <div class="t_ma">
-              <span>{{ '买' }}</span>
+              <span>{{ $t('hj77') }}</span>
             </div>
             <div class="ets">
               <div class="left_sell1">
@@ -164,7 +188,7 @@
           </div>
           <div class="right_h">
             <div class="t_ma">
-              <span>{{ '卖' }}</span>
+              <span>{{ $t('hj78') }}</span>
             </div>
             <div class="ets">
               <div class="left_sell1">
@@ -197,7 +221,6 @@
               <div class="right_sell1">
                 <span>{{ singDetails.buy4_num }}</span>
 
-
               </div>
             </div>
             <div class="ets">
@@ -211,15 +234,100 @@
           </div>
         </div>
       </div>
-      <div class="jianjie" :class="acseFlag ? 'isjj' : ''" ref="isjj" id="isjj">
+      <div class="priect_top_bottom" v-if="kLineDetails.if_us == 1">
+        <div class="t_title">
+          <span>{{ $t('hj79') }}</span>
+        </div>
+        <div class="charts">
+          <div class="left_s">
+            <div class="t_ma">
+              <span>{{ $t('hj80') }}</span>
+            </div>
+            <div class="ets" v-for="(item, i) in timedata.data.details" :key="i">
+              <div class="left_sell1">
+                <span>{{ item.split(',')[0] }}</span>
+              </div>
+              <div class="right_sell1">
+                <!-- <span>{{ }}</span> -->
+              </div>
+            </div>
+
+          </div>
+          <div class="right_h">
+            <div class="t_ma">
+              <span>{{ $t('hj81') }}</span>
+            </div>
+            <div class="ets" v-for="(item, i) in timedata.data.details" :key="i">
+              <div class="left_sell1">
+                <span>{{ item.split(',')[1] }}</span>
+              </div>
+              <div class="right_sell1">
+                <!-- <span>{{ }}</span> -->
+              </div>
+            </div>
+
+          </div>
+          <div class="right_h">
+            <div class="t_ma">
+              <span>{{ $t('hj82') }}</span>
+            </div>
+            <div class="ets" v-for="(item, i) in timedata.data.details" :key="i">
+              <div class="left_sell1">
+                <span>{{ item.split(',')[2] }}</span>
+              </div>
+              <div class="right_sell1">
+                <!-- <span>{{ }}</span> -->
+              </div>
+            </div>
+
+          </div>
+        </div>
+      </div>
+      <div class="jianjie" v-if="!(kLineDetails.if_zhishu != '0' && singDetails.gid.indexOf('hk') > -1)"
+        :class="acseFlag ? 'isjj' : ''" ref="isjj" id="isjj">
         <div class="top_jj">
-          <span>{{ '简介' }}</span>
+          <span>{{ $t('hj83') }}</span>
         </div>
         <div class="jet">
           <span>{{ jianjie }}</span>
         </div>
       </div>
-      <div class="border_bottom"></div>
+      <div class="hknews" v-if="kLineDetails.if_zhishu != '0' && singDetails.gid.indexOf('hk') > -1">
+
+        <div class="news-tab">
+          <div class="t_title">
+            <span>{{ $t('hj6') }}</span>
+          </div>
+          <mt-tab-container v-model="news" :swipeable="false" style="padding-top: 0.5rem;">
+            <mt-tab-container-item id="tab_2">
+              <div class="news-content">
+                <div class="item-out" v-for="(item, inde) in newsdetailList" :key="inde" >
+                  <div class="item-times">{{ item.Art_ShowTime | utc2beijing }}</div>
+                  <div class="titContent" style="-webkit-box-orient: vertical;">{{ item.Art_Title }}</div>
+                </div>
+              </div>
+            </mt-tab-container-item>
+          </mt-tab-container>
+        </div>
+      </div>
+      <div class="hknews" v-else>
+        <div class="news-tab">
+          <div class="t_title">
+            <span>{{ $t('hj6') }}</span>
+          </div>
+          <mt-tab-container v-model="news" :swipeable="false" style="padding-top: 0.5rem;">
+            <mt-tab-container-item id="tab_2">
+              <div class="news-content">
+                <div class="item-out" v-for="(item, inde) in newsdetailList" :key="inde" @click="godetail(item)">
+                  <div class="item-times">{{ item.addTime | gettime }}</div>
+                  <div class="titContent" style="-webkit-box-orient: vertical;">{{ item.title }}</div>
+                </div>
+              </div>
+            </mt-tab-container-item>
+          </mt-tab-container>
+        </div>
+      </div>
+      <!-- <div class="border_bottom"></div> -->
     </div>
     <div class="btns">
       <div class="lefts">
@@ -228,13 +336,13 @@
           <img src="../../assets/img/shoucangle.png" alt v-else />
         </div>
         <div class="right_xx" @click="handleJj()">
-          <a href="#isjj"><img src="../../assets/img/xiaoxi.png" alt /></a>
+          <a href="#"><img src="../../assets/img/xiaoxi.png" alt /></a>
         </div>
       </div>
       <div class="rights">
         <div class="buy_btn">
           <div class="top_buy" @click="goBuy(0)">
-            <span>{{ '卖出' }}</span>
+            <span>{{ $t('hj84') }}</span>
           </div>
           <div class="bottom_buy">
             <span>{{ singDetails.nowPrice }}</span>
@@ -242,7 +350,7 @@
         </div>
         <div class="sell_btn" @click="goBuy(1)">
           <div class="top_sell">
-            <span>{{ '买入' }}</span>
+            <span>{{ $t('hj85') }}</span>
           </div>
           <div class="bottom_sell">
             <span>{{ singDetails.nowPrice }}</span>
@@ -254,135 +362,386 @@
 </template>
 
 <script>
-import Kline from "./components/kLine.vue";
-import * as api from "@/axios/api";
+import Kline from './components/kLine.vue'
+import * as api from '@/axios/api'
+import { Toast } from 'vant'
 
 export default {
-  name: "kline",
-  data() {
+  name: 'kline',
+  data () {
     return {
+      news: 'tab_2',
       kLineDetails: {}, // K线图详情数据
       singDetails: {},
       scFlag: false,
       acseFlag: false,
-      jianjie: "",
-      optionBtn:false,
-      isOptionOpt:false,
-      dialogFlag:false,
-    };
+      jianjie: '',
+      optionBtn: false,
+      isOptionOpt: false,
+      dialogFlag: false,
+      timedata: [],
+      newsdetailList: [],
+      bayType: '',
+      timer:null,
+    }
   },
   components: {
     Kline
   },
-  created() {
-    const { query } = this.$route;
-    this.kLineDetails = query;
-    this.getOpation();
+
+  created () {
+    const { query } = this.$route
+    this.kLineDetails = query
+    if (query.if_us === '1') {
+      this.getSingDetailUs()
+    } else {
+      this.timer = setInterval(()=>{
+        this.getSingDetails()
+      },500)
+    }
+    this.getOpation()
     // this.$Lazyload();
-    this.getSingDetails();
-    this.getUserInfo();
+    this.getUserInfo()
+    this.getNohknews()
   },
+  beforeDestroy() {
+      this.clearInterval(this.timer); // 在组件销毁前清除定时器
+  },
+  // beforeDestroy() {
+  //   this.Klinetype = false;
+  //   window.clearInterval()
+  // },
   methods: {
-    async option() {
-      if(this.optionBtn){
+    async getHknews () {
+      await api.queryIndexNews().then(res => {
+        if (res.status === 0) {
+          this.newsdetailList = res.data.data
+        }
+      })
+    },
+    async getNohknews () {
+      let data = await api.queryNewsList(4)
+      this.newsdetailList = data.data.list
+    },
+    async option () {
+      if (this.optionBtn) {
         return
       };
-      this.optionBtn = true;
+      this.optionBtn = true
       if (this.isOptionOpt) {
-        let data = await api.delOption({ code: this.kLineDetails.code });
+        let data = await api.delOption({ code: this.kLineDetails.code })
         if (data.status === 0) {
-          this.getOpation();
-          this.optionBtn = false;
+          this.getOpation()
+          this.optionBtn = false
+          this.$message({
+            message: this.$t('hj97'),
+            type: 'success'
+          })
         } else {
-          this.optionBtn = false;
-          console.log(data.msg);
-         
+          this.optionBtn = false
+          this.$message({
+            message: data.msg,
+            type: 'warning'
+          })
         }
       } else {
-        let data = await api.addOption({ code: this.kLineDetails.code });
+        let data = await api.addOption({ code: this.kLineDetails.code })
         if (data.status === 0) {
-          this.getOpation();
-          this.optionBtn = false;
+          this.getOpation()
+          this.optionBtn = false
+          this.$message({
+            message: this.$t('hj96'),
+            type: 'success'
+          })
         } else {
-          console.log(data.msg);
-          this.optionBtn = false;
+          this.$message({
+            message: data.msg,
+            type: 'warning'
+          })
+          this.optionBtn = false
         }
       }
+      if (navigator.vibrate) {
+        // 支持
+        navigator.vibrate([55])
+      }
     },
-    async getUserInfo() {
+    async getUserInfo () {
       // 获取用户信息
       //   let showcookie = this.getCookie('USER_TOKEN');
-      let data = await api.getUserInfo();
+      let data = await api.getUserInfo()
       if (data.status === 0) {
         // this.getProductSetting()
-        this.$store.state.userInfo = data.data;
+        this.$store.state.userInfo = data.data
       } else {
-        Toast(data.msg);
+        Toast(data.msg)
       }
-      this.$store.state.user = this.user;
+      this.$store.state.user = this.user
     },
     async getOpation () {
-        let opts = {
-          code: this.$route.query.code
-        }
-        let data = await api.isOption(opts)
-        if (data.status === 0) {
-          // 0 --> 未添加
-          this.isOptionOpt = false
-        } else {
-          this.isOptionOpt = true
-        }
-      },
-    async getSingDetails() {
+      let opts = {
+        code: this.$route.query.code
+      }
+      let data = await api.isOption(opts)
+      if (data.status === 0) {
+        // 0 --> 未添加
+        this.isOptionOpt = false
+      } else {
+        this.isOptionOpt = true
+      }
+    },
+    async getSingDetails () {
       let opts = {
         code: this.kLineDetails.code,
         stockType: this.kLineDetails.type
-      };
+      }
       await api.getSingleStock(opts).then(res => {
         if (res.status === 0) {
-          this.singDetails = res.data.stock;
+          this.singDetails = res.data.stock
+          this.bayType = res.data.stock.type
+
           if (res.data.introduction) {
-            this.jianjie = res.data.introduction.result.data.fareArea;
+            this.jianjie = res.data.introduction
           } else {
-            this.jianjie = res.data.indexintroduction;
+            this.jianjie = res.data.indexintroduction
           }
-          console.log(this.singDetails);
+          const obj = {
+            pid: res.data.stock.code,
+            type: res.data.stock.type
+          }
+          window.localStorage.setItem('kLine', JSON.stringify(obj))
+          // console.log(this.singDetails)
+          // if (this.kLineDetails.if_zhishu !== '0' && this.singDetails.gid.indexOf('hk') > -1) {
+          //   this.getHknews()
+          // } else {
+          //   this.getNohknews()
+          // }
+          // this.timer = setTimeout(() => {
+          //       this.getSingDetails(); // 再次调用自身,形成递归效果
+          // }, 500);
         }
-      });
+      })
     },
-    handleJj() {
-      this.acseFlag = true;
+    async getSingDetailUs () {
+      let opts = {
+        code: this.kLineDetails.code,
+        stockType: this.kLineDetails.type
+      }
+      await api.getUsDetail(opts).then(res => {
+        // console.log(res,1111123);
+        // var that = this
+        // if(!res){
+        //   setTimeout(() => {
+        //     that.getSingDetailUs()
+        //   }, 3000);
+
+        // }
+        if (res.status === 0) {
+          this.singDetails = res.data.stock
+          this.timedata = res.data.timedata
+          if (res.data.introduction) {
+            this.jianjie = res.data.introduction
+          } else {
+            this.jianjie = res.data.indexintroduction
+          }
+          this.getNohknews()
+          console.log(this.singDetails)
+        }
+      })
+    },
+    handleJj () {
+      this.acseFlag = true
       setTimeout(() => {
-        this.acseFlag = false;
-      }, 1000);
+        this.acseFlag = false
+      }, 1000)
+      if (navigator.vibrate) {
+        // 支持
+        navigator.vibrate([55])
+      }
     },
-    handleBack() {
-      this.$router.go(-1);
+    handleBackaa () {
+
+      clearInterval(this.timer);
+      window.localStorage.removeItem('kLine')
+      this.$router.go(-1)
     },
-    handleSc() {
-      this.scFlag = !this.scFlag;
+    handleSc () {
+      this.scFlag = !this.scFlag
     },
-    goBuy(index) {
+    godetail(item){
       this.$router.push({
-        path: "/TradingBuy",
+        path: '/newPage',
         query: {
-          t:index,
-          code:this.kLineDetails.code,
-          m:this.singDetails.nowPrice,
-          type:this.kLineDetails.if_zhishu,
-          name:this.kLineDetails.name,
+          listid: item.id
         }
-      });
+      })
+    },
+    goBuy (index) {
+      clearInterval(this.timer);
+      this.$router.push({
+        path: '/TradingBuy',
+        query: {
+          t: index,
+          code: this.kLineDetails.code,
+          m: this.singDetails.nowPrice,
+          type: this.kLineDetails.if_zhishu,
+          id: this.singDetails.id,
+          name: this.kLineDetails.name,
+          if_us: this.kLineDetails.if_us,
+          bayType: this.bayType
+        }
+      })
+      if (navigator.vibrate) {
+        // 支持
+        navigator.vibrate([55])
+      }
+    }
+  },
+  filters: {
+    getName (spell) {
+      // if (name.length > 15) {
+      //   return name.substring(0, 14)
+      // } else {
+        return spell
+      // }
+    },
+    gettime (time) {
+      if (!time) {
+        return ''
+      }
+      var nd = new Date(time)
+      var y = nd.getFullYear()
+      var mm = nd.getMonth() + 1
+      var d = nd.getDate()
+      var h = nd.getHours()
+      var m = nd.getMinutes()
+      var c = nd.getSeconds()
+      if (mm < 10) {
+        mm = '0' + mm
+      }
+      if (d < 10) {
+        d = '0' + d
+      }
+      if (h < 10) {
+        h = '0' + h
+      }
+      if (m < 10) {
+        m = '0' + m
+      }
+      if (c < 10) {
+        c = '0' + c
+      }
+      // 17:35:2922-06-2022
+      return d + '/' + mm + '/' + y + ' ' + h + ':' + m + ':' + c  //日月年时分秒
+      // return y + '-' + mm + '-' + d + ' ' + h + ':' + m + ':' + c
+    },
+    utc2beijing (utcDatetime) {
+      // 转为正常的时间格式 年-月-日 时:分:秒
+      var tPos = utcDatetime.indexOf('T')
+      // var Z_pos = utcDatetime.indexOf('Z')
+      var yearMonthDay = utcDatetime.substr(0, tPos)
+      var hourMinuteSecond = utcDatetime.substr(tPos + 1, tPos - tPos - 1)
+      var newDatetime = yearMonthDay + ' ' + hourMinuteSecond // 2017-03-31 08:02:06
+
+      // 处理成为时间戳
+      var timestamp = new Date(Date.parse(newDatetime))
+      timestamp = timestamp.getTime()
+      timestamp = timestamp / 1000
+
+      // 增加8个小时,北京时间比utc时间多八个时区
+      var timestamp2 = timestamp + 8 * 60 * 60
+
+      // 时间戳转为时间
+      var beijingDatetime = new Date(parseInt(timestamp2) * 1000).toLocaleString().replace(/年|月/g, '-').replace(/日/g, ' ')
+      return beijingDatetime // 2017-03-31 16:02:06
     }
   }
-};
+}
 </script>
 
 <style scoped lang="less">
+.news-tab {
+  width: 100%;
+  position: relative;
+  left: 0;
+  right: 0;
+  margin: auto;
+  margin-top: 0.2rem;
+  border-radius: 0.4rem 0.4rem 0 0;
+  padding-top: 0.3rem;
+
+  .t_title {
+    width: 100%;
+    font-size: 0.4546rem;
+    margin-top: 0.2rem;
+    padding: 0 0.3rem;
+
+    span {
+      font-weight: 700;
+    }
+  }
+
+  /deep/.is-selected .tab-name {
+    position: relative;
+  }
+
+  /deep/.mint-navbar .mint-tab-item.is-selected {
+    border: 0 !important;
+    border-bottom: none;
+  }
+
+  /deep/.is-selected .tab-name:after {
+    position: absolute;
+    display: block;
+    content: '';
+    height: .07rem;
+    background-color: #1381A4;
+    width: 100%;
+    left: 0;
+    bottom: -.25rem;
+  }
+}
+
+.news-content {
+  position: relative;
+  padding: 0.3rem;
+}
+
+.item-out {
+  position: relative;
+  border-left: 0.01rem solid rgba(192, 192, 192, 0.8);
+  padding: 0 0.25rem 1rem 0.25rem;
+}
+
+.item-out::before {
+  content: "●";
+  position: absolute;
+  top: -0.1rem;
+  left: -0.128rem;
+  margin: auto;
+}
+
+.item-times {
+  color: #999;
+  margin-bottom: 0.15rem;
+}
+
+.titContent {
+  position: relative;
+  width: 100%;
+  font-size: .35rem;
+  line-height: .46rem;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  -webkit-line-clamp: 2;
+  display: -webkit-box;
+}
+
 .ti_cont {
   width: 100%;
   display: flex;
 }
+
 .kline_detail_page {
   width: 100%;
   height: calc(100% - 1.7rem);
@@ -394,6 +753,7 @@
     position: relative;
   }
 }
+
 .sss {
   width: 50%;
   height: 1.2rem;
@@ -401,9 +761,10 @@
   justify-content: flex-end;
   align-items: center;
 }
+
 .detail_title {
   width: 100%;
-  height: 3.2rem;
+  // height: 3.2rem;
   padding: 0 0.3rem;
   background: #fff;
 
@@ -463,22 +824,23 @@
 
 .real_time_detail {
   width: 100%;
-  height: 2rem;
+  // height: 2rem;
   display: flex;
   justify-content: space-between;
+  flex-wrap: wrap;
+  align-items: center;
+  padding: 0.3rem 0;
 
   .left_now_price {
-    width: 35%;
+    // width: 35%;
     height: 100%;
 
     .top_now {
       width: 100%;
-      height: 65%;
+      // height: 65%;
       font-size: 0.741rem;
       display: flex;
       align-items: center;
-      padding-left: 0.1rem;
-      padding-top: 0.3rem;
 
       span {
         font-weight: 500;
@@ -487,9 +849,10 @@
 
     .bottom_now {
       width: 100%;
-      height: 35%;
+      // height: 35%;
       display: flex;
       padding-left: 0.1rem;
+      padding-top: 0.1rem;
     }
 
     .tew {
@@ -498,20 +861,25 @@
   }
 
   .right_ets {
-    width: 65%;
+    max-width: 60%;
     height: 100%;
 
     >div {
       width: 100%;
-      height: 50%;
+      padding: 0.15rem 0;
       display: flex;
+      align-items: center;
 
       >div {
-        width: 50%;
+        // width: 50%;
         height: 100%;
         display: flex;
         justify-content: space-between;
+        align-items: center;
         padding: 0 0.1rem;
+        .titles{
+          padding-right: 0.1rem;
+        }
       }
     }
   }
@@ -520,14 +888,14 @@
 .topes {
   span {
     display: inline-block;
-    padding-top: 0.6rem;
+    // padding-top: 0.6rem;
   }
 }
 
 .bots {
   span {
     display: inline-block;
-    padding-top: 0.2rem;
+    // padding-top: 0.2rem;
   }
 }
 
@@ -752,12 +1120,12 @@
 
 .jianjie {
   width: 100%;
-  height: 5rem;
+  // height: 5rem;
   background: rgb(255, 255, 255);
   margin-top: 0.2rem;
-  border-radius: 0.3rem 0.3rem 0 0;
-  margin-bottom: 1.7rem;
-  padding: 0 0.3rem;
+  border-radius: 0.3rem;
+  margin-bottom: 0.3rem;
+  padding: 0.4rem 0.3rem;
 
   .top_jj {
     width: 100%;
@@ -780,7 +1148,7 @@
   }
 }
 
-  @-webkit-keyframes zy{
+@-webkit-keyframes zy {
   10% {
     transform: rotate(15deg);
   }
@@ -813,10 +1181,12 @@
   animation: zy 2.5s 0.15s linear infinite;
   animation: zy 2.5s 0.15s linear infinite;
 }
+
 .content_money {
   width: 80%;
   height: 80%;
 }
+
 .sanjiao {
   width: 0.4rem;
   height: 0.4rem;
@@ -829,14 +1199,16 @@
     height: 0.4rem;
   }
 }
+
 .top_price {
   width: 100%;
   height: 70%;
   display: flex;
   align-items: center;
   justify-content: flex-end;
+
   .left {
-    width: 0.8rem;
+    // width: 0.8rem;
     height: 0.4103rem;
     border-radius: 0.1rem;
     background: #4d73b1;
@@ -863,12 +1235,14 @@
     margin-left: 0.1rem;
     margin-right: 0.1rem;
     min-width: 1.9rem;
+
     span {
       font-weight: 600;
       text-align: right;
     }
   }
 }
+
 .bottom_balance {
   width: 100%;
   height: 30%;
@@ -880,4 +1254,5 @@
   margin-left: 0.2rem;
   padding-right: 0.68rem;
 }
-</style>
\ No newline at end of file
+
+</style>

--
Gitblit v1.9.3