Skip to content

P
pt-tobacco-lims-web
Commit a0f46d00 by lichengming
Options

修改了登录页面和首页

parent ea8d7376
Showing with 742 additions and 0 deletions
api/drug/drugStatistics.js 0 → 100644
import http from '../http'
export default {
getPersonalData: data =>
http.post('/v1/statistic/list_data', data).then(res => res),
getSampleRank: data =>
http.post('/v1/statistic/sample_rank', data).then(res => res),
getItemFail: data =>
http.post('/v1/statistic/item_fail', data).then(res => res),
pageItemFail: data =>
http.post('/v1/statistic/page_item_fail', data).then(res => res),
getSampleItemNum: data =>
http.post('/v1/statistic/get_sample_item_num', data).then(res => res)
}
api/homePage.js 0 → 100644
function test() {
console.log(123)
}
function waveImg(dataPersonal) {
const xData = []
const yData = []
const sevenList = dataPersonal
for (let i = 0; i < sevenList.length; i++) {
const obj = sevenList[i]
xData.push(obj.dayIns)
yData.push(obj.insNum)
}
const echarts = require('echarts')
const myChart = echarts.init(document.getElementById('waveImg'))
myChart.setOption({
title: {
text: ''
},
tooltip: {},
xAxis: {
data: xData,
boundaryGap: false,
show: false,
splitLine: {
show: false
}
},
yAxis: {
show: false,
splitLine: {
show: false
}
},
series: [
{
name: '',
type: 'line',
smooth: true,
areaStyle: {},
itemStyle: {
normal: {
color: '#3398DB', // 圈圈的颜色
lineStyle: {
color: '#3398DB' // 线的颜色
}
}
},
data: yData
}
],
grid: {
top: 30,
// left: 0,
height: 60
}
})
// setTimeout(() => {
// myChart.resize()
// }, 1000)
}
function histogram(listSevenReceive) {
const xData = []
const yData = []
const sevenList = listSevenReceive
for (let i = 0; i < sevenList.length; i++) {
const obj = sevenList[i]
xData.push(obj.dayIns)
yData.push(obj.insNum)
}
console.log(xData)
console.log(yData)
const echarts = require('echarts')
const myChart = echarts.init(document.getElementById('histogram'))
myChart.setOption({
title: {
text: ''
},
tooltip: {},
xAxis: {
data: xData,
type: 'category',
boundaryGap: true,
show: false,
splitLine: {
show: false
}
},
yAxis: {
show: false,
splitLine: {
show: false
}
},
series: [
{
name: '',
type: 'bar',
smooth: true,
areaStyle: {},
itemStyle: {
normal: {
color: '#3398DB', // 圈圈的颜色
lineStyle: {
color: '#3398DB' // 线的颜色
}
}
},
data: yData
}
],
grid: {
top: 30,
// left: 0,
height: 60
}
})
}
function saleImg(itemNotOk) {
const xData = []
const yData = []
const sevenList = itemNotOk
for (let i = 0; i < sevenList.length; i++) {
const obj = sevenList[i]
xData.push(obj.name)
yData.push(obj.number)
}
const echarts = require('echarts')
const myChart = echarts.init(document.getElementById('saleImg'))
myChart.setOption({
color: ['#3398DB'],
tooltip: {
trigger: 'axis',
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
type: 'category',
data: xData,
axisTick: {
alignWithLabel: true
}
}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: '不合格数量',
type: 'bar',
barWidth: '60%',
data: yData
}
]
})
}
function salesTrendImg(sampleList) {
const xData = []
const yData = []
const sevenList = sampleList
for (let i = 0; i < sevenList.length; i++) {
const obj = sevenList[i]
xData.push(obj.name)
yData.push(obj.number)
}
const echarts = require('echarts')
const myChart = echarts.init(document.getElementById('salesTrendImg'))
myChart.setOption({
color: ['lightblue'],
tooltip: {
trigger: 'axis',
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
}
},
grid: {
top: 10,
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
type: 'category',
data: xData,
axisTick: {
alignWithLabel: true
}
}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: '',
type: 'bar',
barWidth: '60%',
data: yData
}
]
})
}
function visitImg(data) {
const xData = []
const yData = []
const zData = []
const sevenList = data.sampleRank
const sevenListItem = data.itemRank
for (let i = 0; i < sevenList.length; i++) {
const obj = sevenList[i]
xData.push(obj.name)
yData.push(obj.number)
}
for (let i = 0; i < sevenListItem.length; i++) {
const obj = sevenListItem[i]
zData.push(obj.number)
}
const echarts = require('echarts')
const myChart = echarts.init(document.getElementById('visitImg'))
myChart.setOption({
title: {
// text: '折线图堆叠'
},
tooltip: {
trigger: 'axis'
},
legend: {
data: ['报检量', '项目量']
},
grid: {
top: 20,
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
// height: 320
},
toolbox: {
feature: {
saveAsImage: {}
}
},
xAxis: {
type: 'category',
boundaryGap: false,
data: xData
},
yAxis: {
type: 'value'
},
series: [
{
name: '报检量',
type: 'line',
data: yData
},
{
name: '项目量',
type: 'line',
data: zData
}
]
})
console.log('js加载完成')
}
export { test, waveImg, histogram, saleImg, salesTrendImg, visitImg }
pages/drug-statistic/failItem.vue 0 → 100644
<template>
<div>
<div class="tabBox clearfix" style="position: relative;background-color: white;margin-bottom: 20px;margin-top: 20px;">
<el-tabs v-model="activeName">
<el-tab-pane label="不合格项目" name="first">
<div class="saleBox" style="padding-left: 20px;float: left;background-color: lightblue">
<p style="font-size: 14px;">
<!-- {{ range }}不合格数量-->
不合格数量
</p>
<div id="saleImg" style="width: 660px;height: 260px;" />
</div>
</el-tab-pane>
</el-tabs>
<div class="timeBox" style="float: right;position: absolute;right: 0px;top: 0px;">
<div style="float: left;line-height: 34px;">
<!-- <a @click="_rangeDayChange" :class="{actived:pitch=='_rangeDayChange'}">今日</a>-->
<!-- <a @click="_rangeWeekChange" :class="{actived:pitch=='_rangeWeekChange'}">本周</a>-->
<!-- <a @click="_rangeMonthChange" :class="{actived:pitch=='_rangeMonthChange'}">本月</a>-->
<!-- <a @click="_rangeYearChange" :class="{actived:pitch=='_rangeYearChange'}">本年</a>-->
<a>今日</a>
<a>本周</a>
<a>本月</a>
<a>本年</a>
</div>
<div class="calendar" style="overflow: hidden">
<div class="block">
<el-date-picker
v-model="value1"
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="['12:00:00']"
style="width: 200px;margin-left: 20px;"
/>
</div>
</div>
</div>
</div>
<div class="failTable">
<Form
v-show="searchOpen"
inline
onsubmit="return false"
:label-width="70"
class="search-form"
>
<label class="label-sign" />
<Form-item class="search-item" label="物料类型:">
<Input v-model="formObj.name" placeholder="请输入物料类型" clearable @on-enter="_formSearch" />
</Form-item>
<Form-item class="search-btn">
<Button type="primary" @click="_formSearch">
搜索
</Button>
</Form-item>
</Form>
<element-table
ref="pageTable"
:page-columns="pageColumns"
:table-height="tableHeight"
:get-page="getPage"
:opt-col-width="80"
@on-result-change="_tableResultChange"
>
<el-table-column
v-for="item in pageColumns"
:key="item.key"
show-overflow-tooltip
sortable
:prop="item.key"
:label="item.title"
:width="item.width"
:min-width="200"
:fixed="item.fixed?item.fixed:undefined"
>
<template slot-scope="scope">
<div v-if="item.dateTime">
{{ scope.row[item.key]?$dateformat(scope.row[item.key],'yyyy-mm-dd HH:MM:ss'):'' }}
</div>
<span v-else-if="item.type" class="blue-color">
{{ scope.row[item.key] === undefined ? '': scope.row[item.key].display }}
</span>
<div v-else>
{{ scope.row[item.key] }}
</div>
</template>
</el-table-column>
<!-- <el-table-column-->
<!-- slot="col"-->
<!-- label="操作"-->
<!-- align="center"-->
<!-- :width="100"-->
<!-- fixed="right"-->
<!-- >-->
<!-- <template slot-scope="scope">-->
<!-- <icon-list-->
<!-- :msg="iconMsg"-->
<!-- :row-data="scope.row"-->
<!-- @on-result-change="_iconClick"-->
<!-- />-->
<!-- </template>-->
<!-- </el-table-column>-->
</element-table>
</div>
</div>
</template>
<script>
import { drugStatistics } from '../../api'
import { saleImg } from '../../api/homePage'
export default {
name: 'FailItem',
data() {
return {
activeName: 'first',
value1: '',
pageColumns: [
{ title: '项目名称', key: 'name', width: '150' },
{ title: '样品编号', key: 'sampleCode', width: '120' },
{ title: '物料名称', key: 'sampleName', width: '130' },
{ title: '检测值', key: 'testValue', width: '100' },
{ title: '限量值', key: 'limitValue', width: '190' },
{ title: '检测依据', key: 'code', width: '350' },
{ title: '检测依据名称', key: 'standardName', width: '350' }
],
formObj: {
name: ''
},
getPage: {},
iconMsg: [
// { type: 'pt-a-edit', id: '', name: '编辑' },
// { type: 'pt-a-trash', id: '', name: '删除' }
]
}
},
computed: {
tableHeight: function() {
if (this.searchOpen) {
return this.$tableHeight('search')
} else {
return this.$tableHeight('noSearch')
}
}
},
mounted() {
this._getItemFail()
this._page()
},
methods: {
_getItemFail: async function() {
const result = await drugStatistics.getItemFail(this.queryRange)
if (result) {
console.log('getItemFail', result)
this.itemNotOk = result
saleImg(result)
}
},
_page: async function() {
Object.assign(this.formObj, this.$refs.pageTable._searchParams())
const result = await drugStatistics.pageItemFail(
this.$serializeForm(this.formObj)
)
if (result) {
this.getPage = result
this.$refs.pageTable._initTable()
}
},
_iconClick(res, data) {
switch (res) {
case '编辑':
this._editModal(data.id)
break
case '删除':
this._deleteById(data.id)
break
}
},
_tableResultChange(msg, data) {
switch (msg) {
case 'page':
this._page()
break
case 'iconClick':
this._iconClick(data.name, data.rowData)
break
}
}
}
}
</script>
<style scoped>
</style>
pages/drug-statistic/yearDeclara.vue 0 → 100644
<template>
<div>
<div class="dateBox">
<div class="block">
<span class="demonstration">签订日期</span>
<el-date-picker
v-model="dateValue"
type="year"
style="width: 150px;"
placeholder="选择年"
/>
</div>
</div>
<div class="chartBox clearfix">
<div class="barChartBox" style="width: 700px;height: 240px;margin-top: 20px;border: 1px solid lightgray;float: left">
<div class="barChartTitle" style="height: 32px;background-color: #f8f8f9;line-height: 32px;border-bottom: 1px solid lightgray">
<span style="font-size: 14px;color: #333333;font-weight: bold;">年度委托量统计</span>
</div>
<div class="barChartBody" style="padding: 15px;">
<div id="barChart" style="width: 100%;height: 180px;" />
</div>
</div>
<div class="pieChartBox" style="width: 350px;height: 240px;margin-top: 20px;border: 1px solid lightgray;float: left">
<div class="pieChartTitle" style="height: 32px;background-color: #f8f8f9;line-height: 32px;border-bottom: 1px solid lightgray">
<span style="font-size: 14px;color: #333333;font-weight: bold;">年度委托量统计</span>
</div>
<div class="pieChartBody" style="padding: 15px;">
<div id="pieChart" style="width: 100%;height: 180px;" />
</div>
</div>
</div>
<div class="tableBox">
<el-table
:data="tableData"
border
show-summary
style="width: 100%;"
>
<el-table-column
v-for="(item,index) in tableColumn"
:key="index"
:prop="item.key"
:label="item.title"
sortable
class="tablecolumn"
/>
</el-table>
</div>
</div>
</template>
<script>
export default {
name: 'YearDeclara',
data() {
return {
dateValue: ' ',
tableColumn: [
{ title: '签订日期', key: 'date' },
{ title: '委托数量', key: 'entrustNum' },
{ title: '委托额度', key: 'entrustLimit' },
{ title: '实收额度', key: 'chargedLImit' },
{ title: '未收额度', key: 'unchargedLImit' }
],
tableData: [
{
date: '2020-1',
entrustNum: 1,
entrustLimit: 1,
chargedLImit: 1,
unchargedLImit: 1
},
{
date: '2020-2',
entrustNum: 2,
entrustLimit: 2,
chargedLImit: 2,
unchargedLImit: 2
},
{
date: '2020-3',
entrustNum: 3,
entrustLimit: 3,
chargedLImit: 3,
unchargedLImit: 3
},
{
date: '2020-4',
entrustNum: 4,
entrustLimit: 4,
chargedLImit: 4,
unchargedLImit: 4
}
]
}
},
mounted() {
this.barChart()
this.pieChart()
},
methods: {
barChart() {
const echarts = require('echarts')
const myChart = echarts.init(document.getElementById('barChart'))
myChart.setOption({
// color: ['#3398DB'],
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
crossStyle: {
color: '#999'
}
}
},
grid: {
// left: '2%',
// right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
type: 'category',
splitLine: {
show: false
},
data: [
'2020-1',
'2020-2',
'2020-3',
'2020-4',
'2020-5',
'2020-6',
'2020-7',
'2020-8',
'2020-9',
'2020-10',
'2020-11',
'2020-12'
],
axisTick: {
alignWithLabel: true
}
}
],
yAxis: [
{
type: 'value',
splitLine: {
show: false
},
name: '委托量(份)'
},
{
type: 'value',
splitLine: {
show: false
},
name: '委托金额(元)'
}
],
series: [
{
name: '委托量',
type: 'bar',
barWidth: '60%',
data: [9, 16, 59, 39, 89],
itemStyle: {
normal: {
color: 'lightblue'
}
}
},
{
name: '委托金额',
type: 'line',
// barWidth: '60%',
yAxisIndex: 1,
data: [0, 0, 0, 100000, 2000],
itemStyle: {
normal: {
color: 'red'
}
}
}
]
})
},
pieChart() {
const echarts = require('echarts')
const myChart = echarts.init(document.getElementById('pieChart'))
myChart.setOption({
title: {
text: '委托总金额',
left: 'center'
},
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b}: {c} ({d}%)'
},
legend: {
orient: 'vertical',
left: 'right',
data: ['2020-1', '2020-2', '2020-3', '2020-4', '2020-5']
},
series: [
{
name: '委托金额',
type: 'pie',
radius: ['50%', '70%'],
avoidLabelOverlap: false,
label: {
show: false,
position: 'center'
},
labelLine: {
show: false
},
data: [
{ value: 0, name: '2020-1' },
{ value: 0, name: '2020-2' },
{ value: 0, name: '2020-3' },
{ value: 100000, name: '2020-4' },
{ value: 2000, name: '2020-5' }
]
}
]
})
}
}
}
</script>
<style scoped>
</style>
router/drug-statistic-routes.js 0 → 100644
/**
* 系统管理地址路由
*/
import failItem from '../pages/drug-statistic/failItem'
import yearDeclara from '../pages/drug-statistic/yearDeclara'
export default [
{
path: 'fail_item_statistics',
component: failItem,
meta: { title: '不合格项目查询' }
},
{
path: 'year_declara_count',
component: yearDeclara,
meta: { title: '年度报检量统计' }
}
]
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment