|
|
@@ -14,7 +14,7 @@
|
|
|
</el-date-picker>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="检测地点">
|
|
|
- <el-select v-model="formSearch.checkPosition" placeholder="检测地点">
|
|
|
+ <el-select :data="entityList" v-model="formSearch.checkPosition" placeholder="检测地点">
|
|
|
<el-option label="区域一" value="shanghai"></el-option>
|
|
|
<el-option label="区域二" value="beijing"></el-option>
|
|
|
</el-select>
|
|
|
@@ -33,54 +33,65 @@
|
|
|
|
|
|
<el-card class="box-card">
|
|
|
<el-table
|
|
|
- :data="tableData"
|
|
|
+ :data="entityList"
|
|
|
style="width: 100%"
|
|
|
- stripe>
|
|
|
+ size = "mini"
|
|
|
+ stripe
|
|
|
+ show-summary
|
|
|
+ :summary-method="getSummaries"
|
|
|
+ >
|
|
|
<el-table-column
|
|
|
- prop="address"
|
|
|
+ prop="ProjectType"
|
|
|
label="检测地点"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column
|
|
|
- prop="address"
|
|
|
+ prop="DeviceNum"
|
|
|
label="设备总量"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column
|
|
|
- prop="address"
|
|
|
+ prop="Tested"
|
|
|
label="检测率"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column
|
|
|
- prop="address"
|
|
|
+ prop="Tested"
|
|
|
label="合格率"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
+ <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentItemCount" style="float:right;margin: 0"
|
|
|
+ :page-sizes="[10, 15, 20, 25]" :page-size="size" layout="total, sizes, prev, pager, next, jumper" :total="currentItemCount">
|
|
|
+ </el-pagination>
|
|
|
</el-card>
|
|
|
|
|
|
- <el-card class="box-card" style="margin-top: 5px">
|
|
|
+ <el-card class="box-card" style="margin-top: 10px">
|
|
|
|
|
|
<el-table
|
|
|
:data="tableData"
|
|
|
style="width: 100%"
|
|
|
- stripe>
|
|
|
+ size = "mini"
|
|
|
+ stripe
|
|
|
+ show-summary
|
|
|
+ :summary-method="getSummaries"
|
|
|
+ >
|
|
|
<el-table-column
|
|
|
- prop="address"
|
|
|
+ prop="ProjectType"
|
|
|
label="检测地点">
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column
|
|
|
- prop="name"
|
|
|
+ prop="DeviceNum"
|
|
|
label="去年设备总量"
|
|
|
width="180">
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column
|
|
|
- prop="name"
|
|
|
+ prop="DeviceNum"
|
|
|
label="今年设备总量"
|
|
|
width="180">
|
|
|
</el-table-column>
|
|
|
@@ -92,18 +103,21 @@
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column
|
|
|
- prop="name"
|
|
|
+ prop="Tested"
|
|
|
label="去年检测率"
|
|
|
width="180">
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column
|
|
|
- prop="name"
|
|
|
+ prop="Tested"
|
|
|
label="今年检测率"
|
|
|
width="180">
|
|
|
</el-table-column>
|
|
|
|
|
|
</el-table>
|
|
|
+ <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentItemCount" style="float:right;margin: 0"
|
|
|
+ :page-sizes="[10, 15, 20, 25]" :page-size="size" layout="total, sizes, prev, pager, next, jumper" :total="currentItemCount">
|
|
|
+ </el-pagination>
|
|
|
</el-card>
|
|
|
|
|
|
<el-card class="box-card" style="margin-top: 5px">
|
|
|
@@ -111,12 +125,12 @@
|
|
|
<legend style="color:#436EEE"></legend>
|
|
|
<i class="icon icon-database"> 图表展示</i>
|
|
|
</div>
|
|
|
- <v-chart :forceFit="true" :height="height" :data="chartData" :scale="scale">
|
|
|
+ <v-chart :forceFit="true" :height="height" :data="chartData" :scale="scale" >
|
|
|
<v-tooltip />
|
|
|
<v-axis />
|
|
|
<v-bar position="year*sales" />
|
|
|
- <!--<v-line position="year*value" />
|
|
|
- <v-point position="year*value" shape="circle" />-->
|
|
|
+ <v-line position="year*value" />
|
|
|
+ <v-point position="year*value" shape="circle" />
|
|
|
</v-chart>
|
|
|
</el-card>
|
|
|
|
|
|
@@ -125,97 +139,152 @@
|
|
|
|
|
|
</template>
|
|
|
|
|
|
-<style>
|
|
|
- .el-table .warning-row {
|
|
|
- background: oldlace;
|
|
|
- }
|
|
|
|
|
|
- .el-table .success-row {
|
|
|
- background: #f0f9eb;
|
|
|
- }
|
|
|
-</style>
|
|
|
|
|
|
<script>
|
|
|
- const chartData = [
|
|
|
- { year: '1951 年', sales: 38 },
|
|
|
- { year: '1952 年', sales: 52 },
|
|
|
- { year: '1956 年', sales: 61 },
|
|
|
- { year: '1957 年', sales: 145 },
|
|
|
- { year: '1958 年', sales: 48 },
|
|
|
- { year: '1959 年', sales: 38 },
|
|
|
- { year: '1960 年', sales: 38 },
|
|
|
- { year: '1962 年', sales: 38 },
|
|
|
- ];
|
|
|
-
|
|
|
- const scale = [{
|
|
|
- dataKey: 'sales',
|
|
|
- tickInterval: 20,
|
|
|
- }];
|
|
|
-
|
|
|
- const lineData = [
|
|
|
- { year: '1991', value: 3 },
|
|
|
- { year: '1992', value: 4 },
|
|
|
- { year: '1993', value: 3.5 },
|
|
|
- { year: '1994', value: 5 },
|
|
|
- { year: '1995', value: 4.9 },
|
|
|
- { year: '1996', value: 6 },
|
|
|
- { year: '1997', value: 7 },
|
|
|
- { year: '1998', value: 9 },
|
|
|
- { year: '1999', value: 13 },
|
|
|
- ];
|
|
|
-
|
|
|
- const lineScale = [{
|
|
|
- dataKey: 'value',
|
|
|
- min: 0,
|
|
|
- },{
|
|
|
- dataKey: 'year',
|
|
|
- min: 0,
|
|
|
- max: 1,
|
|
|
- }];
|
|
|
-
|
|
|
- export default {
|
|
|
- created () {
|
|
|
+import leaderView from '@/api/lims/leader'
|
|
|
+
|
|
|
+const chartData = [
|
|
|
+ { year: '2018年11月', sales: 52 },
|
|
|
+ { year: '2018年12月', sales: 61 },
|
|
|
+ { year: '2019年01月', sales: 145 },
|
|
|
+ { year: '2019年02月', sales: 48 },
|
|
|
+ { year: '2019年03月', sales: 38 },
|
|
|
+ { year: '2019年05月', sales: 38 },
|
|
|
+ { year: '2019年06月', sales: 38 },
|
|
|
+ { year: '2019年07月', sales: 38 }
|
|
|
+]
|
|
|
+
|
|
|
+const scale = [{
|
|
|
+ dataKey: 'sales',
|
|
|
+ tickInterval: 20
|
|
|
+}]
|
|
|
+
|
|
|
+const lineData = []
|
|
|
|
|
|
+const lineScale = [{
|
|
|
+ dataKey: 'value',
|
|
|
+ min: 0
|
|
|
+}, {
|
|
|
+ dataKey: 'year',
|
|
|
+ min: 0,
|
|
|
+ max: 1
|
|
|
+}]
|
|
|
+
|
|
|
+export default {
|
|
|
+ created () {
|
|
|
+ this.initDatas()
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ formSearch: {
|
|
|
+ daterange: [],
|
|
|
+ checkPosition: '',
|
|
|
+ equipments: []
|
|
|
+ },
|
|
|
+ tableData: [],
|
|
|
+ // 列表数据
|
|
|
+ entityList: [],
|
|
|
+ PositionList: [],
|
|
|
+ // 分页参数
|
|
|
+ size: 10,
|
|
|
+ currentPage: 1,
|
|
|
+ currentItemCount: 0,
|
|
|
+ // 列表排序
|
|
|
+ Column: {
|
|
|
+ Order: '',
|
|
|
+ Prop: ''
|
|
|
+ },
|
|
|
+ // 查询时间
|
|
|
+ CreateOn: [new Date(new Date().getTime() - 30 * 24 * 60 * 60 * 1000), new Date()],
|
|
|
+ chartData,
|
|
|
+ scale,
|
|
|
+ lineData,
|
|
|
+ lineScale,
|
|
|
+ height: 400
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 合计
|
|
|
+ getSummaries (param) {
|
|
|
+ const { columns, data } = param
|
|
|
+ const sums = []
|
|
|
+ columns.forEach((column, index) => {
|
|
|
+ if (index === 0) {
|
|
|
+ sums[index] = '合计'
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const values = data.map(item => Number(item[column.property]))
|
|
|
+ if (!values.every(value => isNaN(value))) {
|
|
|
+ sums[index] = values.reduce((prev, curr) => {
|
|
|
+ const value = Number(curr)
|
|
|
+ if (!isNaN(value)) {
|
|
|
+ return prev + curr
|
|
|
+ } else {
|
|
|
+ return prev
|
|
|
+ }
|
|
|
+ }, 0)
|
|
|
+ sums[index] += ' '
|
|
|
+ } else {
|
|
|
+ sums[index] = 'N/A'
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ return sums
|
|
|
},
|
|
|
- data () {
|
|
|
- return {
|
|
|
- formSearch: {
|
|
|
- daterange: [],
|
|
|
- checkPosition: '',
|
|
|
- equipments: []
|
|
|
- },
|
|
|
-
|
|
|
- chartData,
|
|
|
- scale,
|
|
|
- lineData,
|
|
|
- lineScale,
|
|
|
- height: 400,
|
|
|
- tableData: [{
|
|
|
- precent: 70,
|
|
|
- date: '2016-05-02',
|
|
|
- name: 'A001',
|
|
|
- address: '漏电保护器',
|
|
|
- }, {
|
|
|
- precent: 60,
|
|
|
- date: '2016-05-04',
|
|
|
- name: 'B002',
|
|
|
- address: '防雷装置'
|
|
|
- }, {
|
|
|
- precent: 66,
|
|
|
- date: '2016-05-01',
|
|
|
- name: 'C003',
|
|
|
- address: '无游梁式抽油机',
|
|
|
- }, {
|
|
|
- precent: 80,
|
|
|
- date: '2016-05-03',
|
|
|
- name: 'D004',
|
|
|
- address: '呼吸阀'
|
|
|
- }]
|
|
|
- }
|
|
|
+
|
|
|
+ onSubmit () {
|
|
|
},
|
|
|
- methods: {
|
|
|
- onSubmit () {
|
|
|
+ // initdata () {
|
|
|
+ // leaderView.getLeadervview().then(function (res) {
|
|
|
+ //
|
|
|
+ // })
|
|
|
+ // },
|
|
|
+ initDatas () {
|
|
|
+ // 分页及列表条件
|
|
|
+ let params = {
|
|
|
+ _currentPage: this.currentPage,
|
|
|
+ _size: this.size,
|
|
|
+ Order: this.Column.Order,
|
|
|
+ Prop: this.Column.Prop
|
|
|
+ }
|
|
|
+ // 解析时间
|
|
|
+ if (this.CreateOn && this.CreateOn.length === 2) {
|
|
|
+ this.CreateOn[1].setHours(23)
|
|
|
+ this.CreateOn[1].setMinutes(59)
|
|
|
+ this.CreateOn[1].setSeconds(59)
|
|
|
+ // myCreateOn.push(this.formatDateTime(this.CreateOn[0]))
|
|
|
+ // myCreateOn.push(this.formatDateTime(this.CreateOn[1]))
|
|
|
}
|
|
|
+ // 访问接口
|
|
|
+ leaderView.getLeaderView(params, this.$axios).then(res => {
|
|
|
+ console.log(res)
|
|
|
+ this.entityList = res.data.items
|
|
|
+ this.tableData = res.data.items
|
|
|
+ this.currentItemCount = res.data.currentItemCount
|
|
|
+ }).catch(err => {
|
|
|
+ console.error(err)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleSizeChange (value) {
|
|
|
+ this.size = value
|
|
|
+ this.currentPage = 1
|
|
|
+ this.initDatas()
|
|
|
+ },
|
|
|
+ handleCurrentChange (value) {
|
|
|
+ this.currentPage = value
|
|
|
+ this.initDatas()
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+ .el-table .warning-row {
|
|
|
+ background: oldlace;
|
|
|
+ }
|
|
|
+ .el-table .success-row {
|
|
|
+ background: #f0f9eb;
|
|
|
+ }
|
|
|
+</style>
|