- -
+
+
{{ reportSettings[2].title }}
+
+

#

+

{{ item.name }}

+
+ +
    +
  • +
    +
    {{index}}
    +
    +
    +
    • +
+ +
+
+
{{ reportSettings[3].title }}
+
+

#

+

{{ item.name }}

+
+ +
    +
  • +
    +
    {{index}}
    +
    +
    + {{ item[i.key] }} +
    +
    • +
+ +
+
-
+
+
+
{{ reportSettings[4].title }}
+
+

#

+

{{ item.name }}

+
+ +
    +
  • +
    +
    {{index}}
    +
    +
    + {{ item[i.key] }} +
    +
    • +
+ +
+
+ +
+
+
+ + +
+
- +
Loading... @@ -46,6 +106,8 @@ import scrollBoardBottom from './scrollBoardBottom' import cards from './cards' import rightTotal from './rightTotal.vue' import barChart from './barChart.vue' +import vueSeamlessScroll from 'vue-seamless-scroll' + export default { name: 'DataView', components: { @@ -58,15 +120,14 @@ export default { scrollBoardBottom, cards, rightTotal, - barChart + barChart, + vueSeamlessScroll }, data () { return { + Aid:'', type: '', setting: {}, - chartData1:null, - chartData2:null, - chartData3:null, totalData: [], todayData: [], showData: { @@ -75,6 +136,7 @@ export default { leftData: [], reportedList: [], scrollList: [], + scrollWidth: '20%', scrollList2: [], listName2:'', todayData: [], @@ -82,6 +144,137 @@ export default { allNum: 0, reportedNum: 0 }, + listData: [{ + 'title': '无缝滚动第一行无缝滚动第一行', + 'date': '2017-12-16' + }, { + 'title': '无缝滚动第二行无缝滚动第二行', + 'date': '2017-12-16' + }, { + 'title': '无缝滚动第三行无缝滚动第三行', + 'date': '2017-12-16' + }, { + 'title': '无缝滚动第四行无缝滚动第四行', + 'date': '2017-12-16' + }, { + 'title': '无缝滚动第五行无缝滚动第五行', + 'date': '2017-12-16' + }, { + 'title': '无缝滚动第六行无缝滚动第六行', + 'date': '2017-12-16' + }, { + 'title': '无缝滚动第七行无缝滚动第七行', + 'date': '2017-12-16' + }, { + 'title': '无缝滚动第八行无缝滚动第八行', + 'date': '2017-12-16' + }, { + 'title': '无缝滚动第九行无缝滚动第九行', + 'date': '2017-12-16' + }], + reportSettings:[], + rankHeader1:[ + { + name:'员工', + key:'employee_name', + width: '25%', + }, + { + name:'工序', + key:'proc_name', + width: '40%', + }, + { + name:'上报量', + key:'value', + width: '25%', + }, + ], + rankHeader2:[ + { + name:'业务单号', + key:'TSaleOrderCode', + width: '17%', + }, + { + name:'质检时间', + key:'QC_date', + width: '12%', + }, + { + name:'产品', + key:'Inventoryname', + width: '40%', + }, + { + name:'质检人员', + key:'QC_emp', + width: '10%', + }, + { + name:'缺陷名', + key:'proc01_name', + width: '8%', + }, + { + name:'缺陷数', + key:'proc01_QXL', + width: '8%', + }, + + ], + rankHeader3:[ + { + name:'业务订单号', + key:'TSaleOrderCode', + width: '13%', + }, + { + name:'产品名', + key:'Inventoryname', + width: '30%', + }, + { + name:'总布产数', + key:'Productionquantity', + width: '10%', + }, + { + name:'合格数', + key:'proc01_SJ', + width: '6%', + }, + { + name:'合格率', + key:'proc01_SJv', + width: '6%', + }, + { + name:'不良数', + key:'proc02_SJ', + width: '6%', + }, + { + name:'不良率', + key:'proc02_SJv', + width: '6%', + }, + { + name:'废品数', + key:'proc03_SJ', + width: '5%', + }, + { + name:'废品率', + key:'proc03_SJv', + width: '5%', + }, + { + name:'最迟货期', + key:'SaleOrder_LastDate', + width: '10%', + }, + ], loadingDone: false } }, @@ -89,6 +282,7 @@ export default { console.log(window.location.href.split('?')[1]) let params = window.location.href.split('?')[1]; let Aid = params.split('=')[1]; + this.Aid = Aid; this.createdData(Aid) }, methods: { @@ -98,19 +292,12 @@ export default { this.$api.post2('/api/web/GetScreenReport?category='+Aid).then(res => { if (res.code === '200') { let data = res.data; - this.chartData1 = data.reportSettings[0]; - this.chartData2 = data.reportSettings[1]; - this.chartData3 = data.reportSettings[2]; + this.reportSettings = data.reportSettings; if(data.reportSettings.length>0){ data.reportSettings.forEach(item=>{ if(item.setting.reportType != 'rank'){ this.totalData.push(item) } - if(item.code == 'BI_ProcessFlowSheet_Person_Report'){ - this.showData.scrollList = data.reportSettings[3].data.map(item => { - return [item.employee_name,item.proc_name,item.value] - }); - } if(item.code == 'BI_ProduceQuality_KH_Report'){ this.showData.listName2 = item.title; this.showData.scrollList2 = item.data.map(item => { @@ -119,9 +306,7 @@ export default { } }) } - if(data.reportSettings[3].data.length>0){ - } this.showData.name = '永盛大屏数据看板' this.loadingDone = true } @@ -215,8 +400,9 @@ export default { .block-left-right-content { // flex: 1; - height: 65%; + height: 100%; display: flex; + flex-wrap: wrap; margin-top: 0.2rem; } @@ -235,5 +421,44 @@ export default { box-sizing: border-box; // padding-bottom: 20px; } + .rankHeader{ + font-size: 0.2rem; + font-weight: bold; + color: #fff; + p{ + margin: 0; + height: 0.5rem; + line-height: 0.5rem; + background-color: #1e80ff; + &:last-child{ + flex: 1; + } + } + } + .warp { + height: 100%; + width: 100%; + margin: 0 auto; + overflow: hidden; + ul { + list-style: none; + padding: 0; + margin: 0 auto; + li,a { + display: block; + // height: 0.5rem; + line-height: 0.5rem; + display: flex; + justify-content: space-between; + font-size: 0.2rem; + } + .rowStyle1{ + background-color: rgba(10, 29, 50, 0.8); + } + .rowStyle2{ + background-color: rgba(0, 44, 81, 0.8); + } + } + } } diff --git a/src/components/datav/scrollBoard.vue b/src/components/datav/scrollBoard.vue index 99299a1..a977707 100644 --- a/src/components/datav/scrollBoard.vue +++ b/src/components/datav/scrollBoard.vue @@ -1,5 +1,5 @@ @@ -7,10 +7,11 @@