widget.html
4.92 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta zblx="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="/frontweb/libs/element-ui-2.13.0/lib/theme-chalk/index.css" />
<link rel="stylesheet" href="/frontweb/libs/layui-v2.5.5/css/layui.css">
<link rel="stylesheet" href="./css/style.css">
<script src="/frontweb/libs/vue/vue.js"></script>
<script src="/frontweb/libs/element-ui/lib-master/index.js"></script>
<script src="/frontweb/libs/jquery/jquery.min.js"></script>
<script src="/frontweb/libs/layui-v2.5.5/layui.js"></script>
<script src="/frontweb/libs/echarts/echarts.min.js"></script>
<script src="/frontweb/libs/axios/axios.min.js"></script>
<script src="/frontweb/common/js/config.js"></script>
</head>
<body>
<div id="zbgl">
<div class="zbgl_top">
<div class="zbgl_title">
<span>指标概况</span>
</div>
<div class="zbgl-top-content">
<div class="zbgl-chart" :id="id[index]" v-for="(item,index) in zbgk" :key='index' v-cloak>
<el-progress :show-text='false' :text-inside='true' type="dashboard" :width="180" :percentage="item.count" :color="color[index]"
:stroke-width="22">
</el-progress>
<div class="tips">
<span>{{item.zb}}</span> 项</div>
<div class="mc">{{item.zblx}}</div>
</div>
</div>
</div>
<div class="zbgl_bottom">
<div class="zbgl_title">
指标列表
<div class="buttons">
<el-button type="primary" size="medium" icon="el-icon-circle-plus-outline">新增指标</el-button>
<el-button type="primary" size="medium" icon="el-icon-sell" @click='exportmb'>导出模板</el-button>
<el-button type="primary" size="medium" icon="el-icon-folder-opened" @click='batexport'>批量导出</el-button>
<el-input placeholder="请输入内容" v-model="inputVal" class="input" style="background: #FFFFFF;border: 1px solid #D9D9D9;border-radius: 2px;">
<i slot="prefix" class="el-input__icon el-icon-search" @click="searchVal"></i>
</el-input>
</div>
</div>
<div class="zbgl_bottom_content">
<el-table :header-cell-style="{background:'#f2f2f2'}" border ref="filterTable" :data="tableData.slice((currentPage-1)*pagesize,currentPage*pagesize)"
width="99vw" height="50.2vh" size="small">
<el-table-column :cell-style="{'text-align':'center'}" prop="xh" type="index" :index="indexMethod" label="序号" sortable width="80"
column-key="xh">
</el-table-column>
<el-table-column prop="zblx" label="指标类型" width="150" :formatter="zblxFormat">
</el-table-column>
<el-table-column prop="zbmc" label="指标名称">
</el-table-column>
<el-table-column prop="dw" label="指标单位" width="400" :formatter="dwFormat">
</el-table-column>
<el-table-column prop="zbhqzt" label="指标获取状态" width="360" :formatter="zbztFormat">
<template v-slot='scope'>
<span style="color:#FF3000;" v-if="scope.row.zbhqzt === '0' " class='zt1before'>逾期未更新</span>
<span style="color:#52C41A;" v-if="scope.row.zbhqzt === '1' " class='zt2before'>正常</span>
<span style="color:#9D9D9D;" v-if="scope.row.zbhqzt === '2' " class='zt3before'>异常</span>
</template>
</el-table-column>
<el-table-column label="操作" width="180">
<template slot-scope="scope">
<span style='color:#1890FF;padding-right:10px;border-right:1px solid #E9E9E9;cursor:pointer' @click="detail(scope.row)">详情</span>
<span style='color:#1890FF;padding-left:10px;cursor:pointer' @click="del(scope.$index, scope.row)">删除</span>
</template>
</el-table-column>
</el-table>
<div class="pagenation">
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
:page-sizes="[10, 20, 30, 40]" :page-size="pagesize" layout="total, prev, pager, next, jumper" :total="total">
</el-pagination>
</div>
</div>
</div>
</div>
</body>
<script src="./js/widget.js"></script>
</html>