统计
This commit is contained in:
liushuai
@@ -29,6 +29,7 @@
|
||||
"time-formater": "^1.0.3",
|
||||
"v-viewer": "^1.3.1",
|
||||
"vue": "2.5.17",
|
||||
"vue-count-to": "^1.0.13",
|
||||
"vue-router": "3.0.1",
|
||||
"vuex": "3.0.1",
|
||||
"xlsx": "^0.14.0",
|
||||
|
||||
@@ -44,6 +44,17 @@ export function searchTable(check, entryNameValue, check1, machine, check2, grou
|
||||
}
|
||||
})
|
||||
}
|
||||
export function searchTable22(check, entryNameValue, check1, machine, check2, groupNum, check3, year, check4, month, check5, time) {
|
||||
return request({
|
||||
url: '',
|
||||
method: 'post',
|
||||
data: {
|
||||
type: '1',
|
||||
name: '车间生产管理工艺_基本件成组配套_查询数据',
|
||||
param: '项目流水号_check=' + check + '=int&项目流水号=' + entryNameValue + '=int&机床流水号_check=' + check1 + '=int&机床流水号=' + machine + '=int&组件流水号_check=' + check2 + '=int&组件流水号=' + groupNum + '=int&年_check=' + check3 + '=int&年=' + year + '=string&月_check=' + check4 + '=int&月=' + month + '=int&入库时间_check=' + check5 + '=int&入库时间=' + time + '=string'
|
||||
}
|
||||
})
|
||||
}
|
||||
export function searchPurchaseTable(check, entryNameValue, check1, machine, check2, groupNum, check3, year, check4, month, check5, time, pageCurrent, pageSize) {
|
||||
return request({
|
||||
url: '',
|
||||
|
||||
56
src/api/WorkshopProcurement/costStatistics.js
Normal file
56
src/api/WorkshopProcurement/costStatistics.js
Normal file
@@ -0,0 +1,56 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
export function initProject() {
|
||||
return request({
|
||||
url: '',
|
||||
method: 'post',
|
||||
data: {
|
||||
type: '1',
|
||||
name: 'PDM_项目名称_查询数据_成本分析'
|
||||
}
|
||||
})
|
||||
}
|
||||
export function searchPurchase(num) {
|
||||
return request({
|
||||
url: '',
|
||||
method: 'post',
|
||||
data: {
|
||||
type: '1',
|
||||
name: 'PDM_项目名称_查询数据_成本分析',
|
||||
param: '项目流水号=' + num
|
||||
}
|
||||
})
|
||||
}
|
||||
export function searchOutsourcing(num) {
|
||||
return request({
|
||||
url: '',
|
||||
method: 'post',
|
||||
data: {
|
||||
type: '1',
|
||||
name: '车间生产管理工艺_外协成本统计_查询数据',
|
||||
param: '项目流水号=' + num
|
||||
}
|
||||
})
|
||||
}
|
||||
export function searchHome(num) {
|
||||
return request({
|
||||
url: '',
|
||||
method: 'post',
|
||||
data: {
|
||||
type: '1',
|
||||
name: '车间生产管理工艺_项目成本统计_查询数据',
|
||||
param: '项目流水号=' + num
|
||||
}
|
||||
})
|
||||
}
|
||||
export function searchWorkPurchase(num) {
|
||||
return request({
|
||||
url: '',
|
||||
method: 'post',
|
||||
data: {
|
||||
type: '1',
|
||||
name: '车间采购管理_项目总价_明细_查询数据_总价',
|
||||
param: '项目流水号=' + num
|
||||
}
|
||||
})
|
||||
}
|
||||
1
src/icons/svg/外协工时.svg
Normal file
1
src/icons/svg/外协工时.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1551435038594" class="icon" style="" viewBox="0 0 1201 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="820" xmlns:xlink="http://www.w3.org/1999/xlink" width="234.5703125" height="200"><defs><style type="text/css"></style></defs><path d="M718.73284854 844.17023779H120.38411622V91.1920581A29.01513691 29.01513691 0 1 0 62 91.1920581v781.99331661a29.01513691 29.01513691 0 0 0 29.01513691 29.01513603h627.71771163a29.01513691 29.01513691 0 0 0 0-58.38411621z" p-id="821" fill="#1296db"></path><path d="M179.12207568 797.10910156v-318.45881689h128.09121328v318.45881689zM372.32042451 797.10910156v-530.76469395h128.09121328v530.76469395zM565.51877334 797.10910156V419.55848281h128.09121328v377.55061875zM886.80833457 136.83782217v377.19677549l-128.0912124 35.38431299V136.83782217h128.0912124z" p-id="822" fill="#1296db"></path><path d="M886.45449219 962a231.41340703 231.41340703 0 1 0-231.41340703-231.41340703 231.41340703 231.41340703 0 0 0 231.41340703 231.41340703z m0-420.3656376a188.59838818 188.59838818 0 1 1-187.53685928 188.95223057 188.95223143 188.95223143 0 0 1 187.53685928-188.95223057z" p-id="823" fill="#1296db"></path><path d="M873.3622959 727.04816211V734.47886797l55.90721425 55.90721425a16.98447041 16.98447041 0 1 0 23.70748975-23.70748974l-50.24572383-50.24572471v-135.168075a16.63062714 16.63062714 0 0 0-28.66129365-13.79988193 16.63062714 16.63062714 0 0 0-4.9538039 9.90760694v144.36799716z" p-id="824" fill="#1296db"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
1
src/icons/svg/自家工时.svg
Normal file
1
src/icons/svg/自家工时.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1551435016050" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="558" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M767 512.031c0 140.833-114.167 255-255 255s-255-114.167-255-255 114.167-255 255-255 255 114.167 255 255z m-450 0c0 107.7 87.3 195 195 195s195-87.3 195-195-87.3-195-195-195-195 87.3-195 195z m225-110v80h80a30 30 0 0 1 0 60H512a30 30 0 0 1-30-30v-110a30 30 0 0 1 60 0zM512 959C265.129 959 65 758.871 65 512a445.261 445.261 0 0 1 108.837-292.333l-48.441 0.35a30.104 30.104 0 0 1-0.426-60.206l120.125-0.867a30.063 30.063 0 0 1 30.244 29.887l0.852 120.412a30.032 30.032 0 1 1-60.062 0.433l-0.329-46.72A385.421 385.421 0 0 0 125 511.995C125 725.731 298.266 899 512 899s387-173.269 387-387.005c0-213.524-172.924-386.653-386.366-387-0.213 0-0.42 0.032-0.634 0.032a30 30 0 0 1 0-60V65c246.871 0 447 200.128 447 447S758.871 959 512 959z" fill="#d81e06" p-id="559"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
1
src/icons/svg/车间采购.svg
Normal file
1
src/icons/svg/车间采购.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1551435081252" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1707" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M861 62.16H159a64.19 64.19 0 0 0-64 64v767.68a64.19 64.19 0 0 0 64 64h702a64.19 64.19 0 0 0 64-64V126.16a64.19 64.19 0 0 0-64-64z m0 831.58l-0.11 0.11H159.12l-0.11-0.11V126.27l0.11-0.11h701.76l0.11 0.11z" p-id="1708" fill="#1afa29"></path><path d="M317.06 286.24h383.27a32 32 0 0 0 0-64H317.06a32 32 0 1 0 0 64zM317.06 414.08h383.27a32 32 0 0 0 0-64H317.06a32 32 0 0 0 0 64zM445.09 479.29h-128a32 32 0 0 0 0 64h128a32 32 0 1 0 0-64zM785.11 739.4v-36.92h-98v-21.06h-25.24l27.3-9.88c-2.08-12.48-9.88-30.16-18.2-43.68l-34.32 12c6.76 13 13 29.64 15.34 41.6h-5.2v21.06h-95.93v36.88h67.86c-20.8 19.5-48.88 36.66-77.22 47.32 9.1 8.32 21.84 24.18 28.34 34.32 28.08-13.52 54.86-33.54 77-57.2v62.66h40.3v-64.22c22.36 23.92 49.66 44.46 77.74 57.72 6.5-10.4 19.24-26.26 28.34-34.32-27.87-10.68-56.22-27.3-77.53-46.28z" p-id="1709" fill="#1afa29"></path><path d="M562.81 633.32c69.16-1.82 149.24-7.54 214-18.46l-29.9-34.58c-49.92 8.84-125.06 15.08-193.44 17.16 3.63 8.85 8.53 25.49 9.34 35.88zM733.89 699.88c12.22-15.6 27.56-39.26 40.82-62.14l-39-14.82c-7.8 20.54-21.84 46.54-33.54 63.18zM591.41 697.8L626 683c-3.9-13.52-14.56-32.24-25.22-46.28l-32 13.52c10.15 14.76 19.78 34.56 22.63 47.56z" p-id="1710" fill="#1afa29"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
1
src/icons/svg/采购采购.svg
Normal file
1
src/icons/svg/采购采购.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1551435091802" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1958" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M844.8 1006.592H171.52c-14.336 0-25.6-11.264-25.6-25.6V173.056c0-14.336 11.264-25.6 25.6-25.6h178.176c12.288-76.288 78.848-134.656 158.72-134.656s145.92 58.368 158.208 134.656H844.8c14.336 0 25.6 11.264 25.6 25.6v807.936c0 14.336-11.264 25.6-25.6 25.6z m-647.68-51.2H819.2V198.656h-176.128c-14.336 0-25.6-11.264-25.6-25.6 0-59.904-49.152-109.056-109.056-109.056-60.416 0-109.568 49.152-109.568 109.056 0 14.336-11.264 25.6-25.6 25.6H197.12v756.736z" p-id="1959" fill="#515151"></path><path d="M508.416 139.264c18.432 0 33.792 15.36 33.792 33.792s-15.36 33.792-33.792 33.792-33.792-15.36-33.792-33.792 14.848-33.792 33.792-33.792zM671.232 501.76H347.648c-14.336 0-25.6-11.264-25.6-25.6s11.264-25.6 25.6-25.6h323.584c14.336 0 25.6 11.264 25.6 25.6s-11.264 25.6-25.6 25.6zM666.624 640H343.04c-14.336 0-25.6-11.264-25.6-25.6s11.264-25.6 25.6-25.6h323.584c14.336 0 25.6 11.264 25.6 25.6s-11.264 25.6-25.6 25.6z" p-id="1960" fill="#515151"></path><path d="M438.784 471.04c-7.68 0-15.36-3.584-19.968-9.728l-59.904-76.8c-8.704-11.264-6.656-27.136 4.608-35.84s27.136-6.656 35.84 4.608l59.904 76.8c8.704 11.264 6.656 27.136-4.608 35.84-4.608 3.584-10.24 5.12-15.872 5.12zM588.8 465.92c-4.608 0-8.704-1.024-12.8-3.584-12.288-7.168-16.384-23.04-9.216-34.816l48.128-81.92c7.168-12.288 23.04-16.384 34.816-9.216 12.288 7.168 16.384 23.04 9.216 34.816l-48.128 81.92c-4.608 8.192-13.312 12.8-22.016 12.8zM505.856 829.44c-14.336 0-25.6-11.264-25.6-25.6V476.16c0-14.336 11.264-25.6 25.6-25.6s25.6 11.264 25.6 25.6v327.68c0 14.336-11.264 25.6-25.6 25.6z" p-id="1961" fill="#515151"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
@@ -19,7 +19,7 @@ const service = axios.create({
|
||||
// baseURL: `http://192.168.1.149:8411/submit/MESCommonBase.ashx`,
|
||||
// baseURL: `http://localhost:8411/submit/MESCommonBase.ashx`,
|
||||
// baseURL: `http://localhost:8411/submit/MESCommonBase.ashx`,
|
||||
baseURL: `http://192.168.1.231:8411/submit/MESCommonBase.ashx`,
|
||||
baseURL: `http://localhost:8411/submit/MESCommonBase.ashx`,
|
||||
// baseURL: `http://localhost:8077/submit/MESCommonBase.ashx`,
|
||||
// baseURL: `http://192.168.0.112:8411/submit/MESCommonBase.ashx`,
|
||||
timeout: 1500000 // 请求超时时间
|
||||
|
||||
@@ -45,7 +45,7 @@
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
placeholder="选择日期"/>
|
||||
<el-button type="success" icon="el-icon-search" size="small" style="margin-top: 15px;margin-left: 10px" @click="searchData">查询</el-button>
|
||||
<el-button type="success" icon="el-icon-search" size="small" style="margin-top: 15px;margin-left: 10px" @click="total=0;pageSize=10;pageCurrent=1;searchData()">查询</el-button>
|
||||
</el-card>
|
||||
<el-card>
|
||||
<el-table
|
||||
@@ -388,7 +388,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { initProject, searchTable, searchmachine, searchgroup, searchPurchaseTable, searchTable1, processingStatus } from '@/api/ManufacturingCenter/GroupMatching'
|
||||
import { initProject, searchTable, searchmachine, searchgroup, searchPurchaseTable, searchTable1, processingStatus, searchTable22 } from '@/api/ManufacturingCenter/GroupMatching'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
@@ -524,7 +524,6 @@ export default {
|
||||
searchTable(this.check, this.entryNameValue, this.check1, this.machine, this.check2, this.groupNum, this.check3, this.year, this.check4, this.month, this.check5, this.time, this.pageCurrent, this.pageSize).then(response => {
|
||||
for (let i = 0; i < response.data.rows.length; i++) {
|
||||
if (response.data.rows[i].入库时间 !== '') {
|
||||
this.totalNum += 1
|
||||
response.data.rows[i].入库时间 = response.data.rows[i].入库时间.split(' ', 2)[0]
|
||||
}
|
||||
if (response.data.rows[i].计划完成时间 !== '') {
|
||||
@@ -535,6 +534,14 @@ export default {
|
||||
this.total = parseInt(response.data.total)
|
||||
this.loading = false
|
||||
})
|
||||
searchTable22(this.check, this.entryNameValue, this.check1, this.machine, this.check2, this.groupNum, this.check3, this.year, this.check4, this.month, this.check5, this.time, this.pageCurrent, this.pageSize).then(response => {
|
||||
for (let i = 0; i < response.data.length; i++) {
|
||||
console.log(response.data[i].入库时间, 123)
|
||||
if (response.data[i].入库时间 !== null) {
|
||||
this.totalNum += 1
|
||||
}
|
||||
}
|
||||
})
|
||||
searchPurchaseTable(this.check, this.entryNameValue, this.check1, this.machine, this.check2, this.groupNum, this.check3, this.year, this.check4, this.month, this.check5, this.time, this.pageCurrent, this.pageSize).then(response => {
|
||||
console.log(response)
|
||||
this.tableDataPurchase = response.data.rows
|
||||
@@ -628,7 +635,6 @@ export default {
|
||||
this.dialogFormVisible3 = false
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
this.totalNum = 0
|
||||
this.pageCurrent = 1
|
||||
this.pageSize = val
|
||||
if (this.entryNameValue !== null && this.entryNameValue !== '') {
|
||||
@@ -665,7 +671,6 @@ export default {
|
||||
searchTable(this.check, this.entryNameValue, this.check1, this.machine, this.check2, this.groupNum, this.check3, this.year, this.check4, this.month, this.check5, this.time, this.pageCurrent, this.pageSize).then(response => {
|
||||
for (let i = 0; i < response.data.rows.length; i++) {
|
||||
if (response.data.rows[i].入库时间 !== '') {
|
||||
this.totalNum += 1
|
||||
response.data.rows[i].入库时间 = response.data.rows[i].入库时间.split(' ', 2)[0]
|
||||
}
|
||||
if (response.data.rows[i].计划完成时间 !== '') {
|
||||
@@ -682,7 +687,6 @@ export default {
|
||||
}
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
this.totalNum = 0
|
||||
this.pageCurrent = val
|
||||
if (this.entryNameValue !== null && this.entryNameValue !== '') {
|
||||
if (this.entryNameValue !== null && this.entryNameValue !== '') {
|
||||
@@ -718,7 +722,6 @@ export default {
|
||||
searchTable(this.check, this.entryNameValue, this.check1, this.machine, this.check2, this.groupNum, this.check3, this.year, this.check4, this.month, this.check5, this.time, this.pageCurrent, this.pageSize).then(response => {
|
||||
for (let i = 0; i < response.data.rows.length; i++) {
|
||||
if (response.data.rows[i].入库时间 !== '') {
|
||||
this.totalNum += 1
|
||||
response.data.rows[i].入库时间 = response.data.rows[i].入库时间.split(' ', 2)[0]
|
||||
}
|
||||
if (response.data.rows[i].计划完成时间 !== '') {
|
||||
|
||||
281
src/views/WorkshopProcurement/costStatistics/index.vue
Normal file
281
src/views/WorkshopProcurement/costStatistics/index.vue
Normal file
@@ -0,0 +1,281 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-card>
|
||||
<span>项目名称:</span>
|
||||
<el-select v-model="projectValue" placeholder="项目名称" size="small" filterable clearable>
|
||||
<el-option
|
||||
v-for="item in project"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"/>
|
||||
</el-select>
|
||||
<el-button
|
||||
type="success"
|
||||
size="small"
|
||||
icon="el-icon-search"
|
||||
style="margin-left:10px"
|
||||
@click="total=0;pageCurrent=1;pageSize=10;searchTable()">查询</el-button>
|
||||
</el-card>
|
||||
<el-row :gutter="40" class="panel-group">
|
||||
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
|
||||
<div class="card-panel" style="padding: 0px">
|
||||
<div class="card-panel-icon-wrapper icon-people">
|
||||
<svg-icon icon-class="采购采购" class-name="card-panel-icon" />
|
||||
</div>
|
||||
<div class="card-panel-description">
|
||||
<div class="card-panel-text">采购部采购</div>
|
||||
<count-to :end-val="Purchase" :duration="1000" prefix="¥" class="card-panel-num"/>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
|
||||
<div class="card-panel">
|
||||
<div class="card-panel-icon-wrapper icon-message">
|
||||
<svg-icon icon-class="车间采购" class-name="card-panel-icon" />
|
||||
</div>
|
||||
<div class="card-panel-description">
|
||||
<div class="card-panel-text">制造部采购</div>
|
||||
<count-to :end-val="WorkPurchase" :duration="1000" prefix="¥" class="card-panel-num"/>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
|
||||
<div class="card-panel">
|
||||
<div class="card-panel-icon-wrapper icon-money">
|
||||
<svg-icon icon-class="外协工时" class-name="card-panel-icon" />
|
||||
</div>
|
||||
<div class="card-panel-description">
|
||||
<div class="card-panel-text">外协工时</div>
|
||||
<count-to :end-val="Outsourcing" :duration="1000" prefix="¥" class="card-panel-num"/>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
|
||||
<div class="card-panel">
|
||||
<div class="card-panel-icon-wrapper icon-shopping">
|
||||
<svg-icon icon-class="自家工时" class-name="card-panel-icon" />
|
||||
</div>
|
||||
<div class="card-panel-description">
|
||||
<div class="card-panel-text">自家工时</div>
|
||||
<count-to :end-val="Home" :duration="1000" prefix="¥" class="card-panel-num"/>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-card>
|
||||
<div style="height: 500px;width: 100%">
|
||||
<div class="div-a">
|
||||
<div id="pie" style="width:70%;height:450px; display: block; margin-right: auto;margin-left: auto"/>
|
||||
</div>
|
||||
<div class="div-b">
|
||||
<div id="bar" style="width:85%;height:450px; display: block; float: left"/>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>import { initProject, searchOutsourcing, searchHome } from '@/api/WorkshopProcurement/costStatistics'
|
||||
import echarts from 'echarts'
|
||||
import CountTo from 'vue-count-to'
|
||||
export default {
|
||||
components: {
|
||||
CountTo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Purchase: 18040,
|
||||
WorkPurchase: 5308,
|
||||
Outsourcing: 3240,
|
||||
Home: 35806,
|
||||
projectValue: 1,
|
||||
project: [],
|
||||
data: [
|
||||
{ value: 28040, name: '采购部采购' },
|
||||
{ value: 15308, name: '制造部采购' }
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.drawLine()
|
||||
this.drawLine1()
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
fetchData() {
|
||||
this.getSelect(initProject, ['项目名称', '项目流水号'], 'project')
|
||||
},
|
||||
searchTable() {
|
||||
this.data = []
|
||||
searchOutsourcing(this.projectValue).then(response => {
|
||||
this.Outsourcing = parseFloat(response.data[0].外协总价)
|
||||
return this.Outsourcing
|
||||
}).then(data => {
|
||||
this.data.push({
|
||||
value: data,
|
||||
name: '外协工时'
|
||||
})
|
||||
}).then(() => {
|
||||
searchHome(this.projectValue).then(response => {
|
||||
this.Home = parseFloat(response.data[0].项目工时)
|
||||
return this.Home
|
||||
}).then(data => {
|
||||
this.data.push({
|
||||
value: data,
|
||||
name: '自家工时'
|
||||
})
|
||||
this.drawLine()
|
||||
this.drawLine1()
|
||||
})
|
||||
})
|
||||
},
|
||||
drawLine() {
|
||||
const pie = echarts.init(document.getElementById('pie'))
|
||||
pie.setOption({
|
||||
title: {
|
||||
// text: '损失工时分析',
|
||||
x: 'center'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
formatter: '{a} <br/>{b} : {c} ({d}%)'
|
||||
},
|
||||
legend: {
|
||||
type: 'scroll',
|
||||
orient: 'vertical',
|
||||
right: 15,
|
||||
top: 50,
|
||||
bottom: 25
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '各项成本占比',
|
||||
type: 'pie',
|
||||
radius: '57%',
|
||||
center: ['50%', '50%'],
|
||||
data: [{ value: 18040, name: '采购部采购' },
|
||||
{ value: 5308, name: '制造部采购' },
|
||||
{ value: 3240, name: '外协工时' },
|
||||
{ value: 35806, name: '自家工时' }
|
||||
],
|
||||
itemStyle: {
|
||||
emphasis: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
}
|
||||
},
|
||||
label: {
|
||||
normal: {
|
||||
show: true,
|
||||
position: 'outside',
|
||||
formatter: '{b} ({d}%)'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
})
|
||||
setTimeout(function() {
|
||||
window.onresize = function() {
|
||||
pie.resize()
|
||||
}
|
||||
}, 200)
|
||||
},
|
||||
drawLine1() {
|
||||
const bar = echarts.init(document.getElementById('bar'))
|
||||
// 指定图表的配置项和数据
|
||||
bar.setOption({
|
||||
tooltip: {},
|
||||
legend: {
|
||||
data: {
|
||||
name: ['外协工时', '自家工时', '采购部采购', '制造部采购']
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
data: ['外协工时', '自家工时', '采购部采购', '制造部采购'],
|
||||
show: true
|
||||
},
|
||||
yAxis: {},
|
||||
series: [{
|
||||
name: '销量',
|
||||
type: 'bar',
|
||||
data: [18040, 5308, 3240, 35806]
|
||||
}]
|
||||
})
|
||||
setTimeout(function() {
|
||||
window.onresize = function() {
|
||||
bar.resize()
|
||||
}
|
||||
}, 200)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
.panel-group {
|
||||
margin-top: 18px;
|
||||
.card-panel-col{
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
.card-panel {
|
||||
height: 140px;
|
||||
cursor: pointer;
|
||||
font-size: 12px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
color: #666;
|
||||
background: #fff;
|
||||
box-shadow: 4px 4px 40px rgba(0, 0, 0, .20);
|
||||
border-color: rgba(0, 0, 0, .05);
|
||||
.icon-people {
|
||||
color: #40c9c6;
|
||||
background: #40c9c6;
|
||||
}
|
||||
.icon-message {
|
||||
color: #36a3f7;
|
||||
background: #36a3f7;
|
||||
}
|
||||
.icon-money {
|
||||
color: #f4516c;
|
||||
background: #f4516c;
|
||||
}
|
||||
.icon-shopping {
|
||||
color: #34bfa3;
|
||||
background: #34bfa3;
|
||||
}
|
||||
.card-panel-icon-wrapper {
|
||||
float: left;
|
||||
margin: 14px 0 0 14px;
|
||||
padding: 20px;
|
||||
transition: all 0.38s ease-out;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.card-panel-icon {
|
||||
float: left;
|
||||
color: white;
|
||||
font-size: 48px;
|
||||
}
|
||||
.card-panel-description {
|
||||
float: right;
|
||||
font-weight: bold;
|
||||
margin: 26px;
|
||||
margin-left: 0px;
|
||||
.card-panel-text {
|
||||
text-align: right;
|
||||
line-height: 18px;
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
font-size: 20px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.card-panel-num {
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.div-a{ float:left;width:45%;margin-right: 4%}
|
||||
.div-b{ float:left;width:45%;margin-left: 4%}
|
||||
</style>
|
||||
Reference in New Issue
Block a user