广期所数据-暂存

src/routes/modules/dataRoutes.js

@@ -132,6 +132,13 @@ export default [
           keepAlive: false,
         },
       },
+      {
+        path: "guangzhoushop",
+        component: () =>
+          import("@/views/dataEntry_manage/thirdBase/gqExchangeData.vue"),
+        name: "广期所",
+        hidden: false
+      },
       {
         path: "chineseCoal",
         component: () => import("@/views/dataEntry_manage/coal/index.vue"),

src/views/dataEntry_manage/thirdBase/gqExchangeData.vue

@@ -0,0 +1,265 @@
+<template>
+    <div class="exchangedata-wrap">
+        <span
+            class="slide-btn-icon"
+            :class="{'slide-left':isLeftWrapShow,'slide-right':!isLeftWrapShow}"
+            @click="isLeftWrapShow = !isLeftWrapShow"
+        >
+            <i :class="{'el-icon-d-arrow-left':isLeftWrapShow,'el-icon-d-arrow-right':!isLeftWrapShow}"></i>
+        </span>
+        <div class="left-wrap box" v-show="isLeftWrapShow">
+            <el-date-picker 
+                style="width:100%" 
+                v-model="time" 
+                type="date" 
+                placeholder="选择日期"
+                value-format="yyyy-MM-dd"
+                :clearable="false"
+                @change="handleTimeChange"
+            >
+            </el-date-picker>
+            <!-- @click="handleChangeType(item)" -->
+            <div class="scroll-wrap">
+                <el-tree
+                ref="treeRef"
+                class="target_tree custom-tree"
+                :data="typeList"
+                node-key="ClassifyId"
+                :default-expanded-keys="defaultShowNodes"
+                :props="{
+                    label: 'ClassifyName',
+                    children: 'Children',
+                }"
+                :current-node-key="type"
+                empty-text="暂无分类"
+                @current-change="handleChangeType">
+                    <span slot-scope="{ node, data }">{{ data.ClassifyName }}</span>
+                </el-tree>
+            </div>
+        </div>
+        <div class="right-wrap box" v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading">
+            <div class="content" style="height:90%" v-if="list.length>0">
+                <table width="auto" border="0">
+                    <thead class="border-head">
+                        <tr>
+                            <td v-for="(val,index) in labelArr" :key="`${val}_${index}`">
+                                {{ val }}
+                            </td>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr v-for="item in list" :key="item.Rank">
+                            <td v-for="(val,key) in labelArr" :key="key">{{item.Rank==999&&key=='Rank'?'合计':item[key]}}</td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+            <div class="empty-wrap" style="height:90%" v-else>
+                <tableNoData text="暂无数据"/>
+            </div>
+            <div class="num-warp">
+                <div 
+                    v-for="item in numList" 
+                    :key="item" 
+                    :class="['num-box',num===item&&'num-active']"
+                    @click="handleChangeNum(item)"
+                >{{item}}</div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+// 广期所数据
+import { dataInterence } from "@/api/api.js";
+import http from "@/api/http.js";
+export default {
+    name: "gqExchangeData",
+    data() {
+        return {
+            isLeftWrapShow:true,
+            labelArr: {
+                Rank: "指标ID",
+                DealShortName: "指标名称",
+                DealCode: "数值",
+                DealValue: "单位",
+                DealChange: "频度",
+                BuyShortName: "起始日期",
+                BuyCode: "最新日期",
+                // BuyValue: "持买仓量",
+                // BuyChange: "增减量",
+                // SoldShortName: "会员简称",
+                // SoldCode: "指标ID",
+                // SoldValue: "持卖仓量",
+                // SoldChange: "增减量",
+                // Rank: "名次",
+                // DealShortName: "会员简称",
+                // DealCode: "指标ID",
+                // DealValue: "成交量（手）",
+                // DealChange: "增减量",
+                // BuyShortName: "会员简称",
+                // BuyCode: "指标ID",
+                // BuyValue: "持买仓量",
+                // BuyChange: "增减量",
+                // SoldShortName: "会员简称",
+                // SoldCode: "指标ID",
+                // SoldValue: "持卖仓量",
+                // SoldChange: "增减量",
+            },
+            time:'',
+            type:'',
+            typeList:[],
+            defaultShowNodes:[],
+            numList:[],
+            num:'',
+            list:[],
+            loading:false,
+        };
+    },
+    created () {
+        this.getClassifyList()  
+    },
+    methods: {
+
+        handleChangeNum(e){
+            this.num=e
+            this.getData()
+        },
+
+        // 时间切换
+        handleTimeChange(){
+            // this.getData();
+            // this.getClassifyList()
+        },
+
+        // 计算合计
+        handleValCount(key){
+            let count=0
+            this.list.forEach(item=>{
+                count=count+Number(item[key])
+            })
+            return count
+        },
+
+        // 获取分类
+        async getClassifyList(){
+            // const res=await dataInterence.getResearcherClassifyList({
+            //     Exchange:'dalian',
+            //     DataTime:this.time
+            // })
+            // if(res.Ret===200){
+            //     this.typeList=res.Data&&res.Data[0]||[]
+            //     if(!this.time){
+            //         // 第一次取 后端返回的最新日期
+            //         this.time=res.Data&&res.Data[1][0]||''
+            //     }
+            //     this.type=this.typeList[0]
+            //     this.getNumList()
+            // }
+            // TODO: 分类接口对接
+            this.typeList=[{ClassifyId:1,ClassifyName:'300系不锈钢',Children:[{ClassifyId:11,ClassifyName:'300系不锈钢-1'},{ClassifyId:12,ClassifyName:'300系不锈钢-2'}]},
+            {ClassifyId:2,ClassifyName:'原生镍',Children:[{ClassifyId:21,ClassifyName:'原生镍-1'},{ClassifyId:22,ClassifyName:'原生镍-2'}]}]
+            this.type=this.typeList[0].Children[0].ClassifyId
+            this.defaultShowNodes=[this.typeList[0].ClassifyId,this.typeList[0].Children[0].ClassifyId]
+            this.getNumList()
+        },
+        handleChangeType(data, node) {
+            if (data.ClassifyId === this.type) return;
+            this.getNumList()
+        },
+        // 获取合约号
+        async getNumList(){
+            // const res=await dataInterence.getExchangeClassifyContract({
+            //     Exchange:'dalian',
+            //     Classify:this.type,
+            //     DataTime:this.time
+            // })
+            // if(res.Ret===200){
+            //     this.numList=res.Data||[]
+            //     this.num=this.numList[0]||''
+            //     this.getData()
+            // }
+            // TODO: 合约接口对接
+            this.numList=['si2308','si23081','si23084','si23087','si23088','si23089']
+            this.num=this.numList[0]||''
+            this.getData()
+        },
+
+        async getData(){
+            $('.content').animate({scrollTop:0},0)
+            // this.loading=true
+            // const res=await dataInterence.getDlExchangeData({
+            //     Date: this.time,
+            //     ClassifyName:this.type,
+            //     ClassifyType:this.num
+            // })
+            
+            // if(res.Ret===200){
+            //     this.list=res.Data&&res.Data[0].ItemList&&res.Data[0].ItemList[0].Item||[]
+            // }
+            this.list=[{Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'},
+            {Rank:'Si2401open',DealShortName:'工业硅2401开盘价',DealCode:'13955',DealValue:'%',DealChange:'日度',BuyShortName:'2019-04-10',BuyCode:'2023-12-22'}]
+        }
+    }
+};
+</script>
+
+<style lang="scss" scoped>
+@import "../css/exchangedata.scss";
+
+.exchangedata-wrap{
+    .slide-btn-icon{
+        &.slide-left{
+            left:285px;
+        }
+        &.slide-right{
+            left: 0;
+        }
+      }
+    .left-wrap{
+        width: 300px;
+    }
+}
+
+.scroll-wrap {
+    margin: 20px 0;
+    height: calc(100vh - 250px);
+    overflow-y: auto;
+    .target_tree {
+        color: #333;
+    }
+}
+
+thead{
+    position: sticky;
+    top: 0;
+    left: 0;
+    border-top: 1px solid #dcdfe6;
+}
+</style>
+<style lang="scss">
+@import "../css/customtree.scss";
+
+</style>