From e806ecbf542ff0525ee53617328aa5802622a241 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=86=8A=E4=B8=BD=E5=90=9B?= <664953382@qq.com>
Date: Mon, 20 Dec 2021 11:01:26 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B4=A8=E9=87=8F=E7=AE=A1=E7=90=86=EF=BC=88?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0center1=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/chartList/page4/center1.vue | 177 ++++++++++++++++++++++++++
 src/views/chartList/page4/index.vue   |   8 +-
 src/views/chartList/page4/indexApi.js |   9 +-
 3 files changed, 185 insertions(+), 9 deletions(-)
 create mode 100644 src/views/chartList/page4/center1.vue

diff --git a/src/views/chartList/page4/center1.vue b/src/views/chartList/page4/center1.vue
new file mode 100644
index 0000000..01a6b9b
--- /dev/null
+++ b/src/views/chartList/page4/center1.vue
@@ -0,0 +1,177 @@
+<template>
+	<el-row :gutter="20">
+		<!--用户数据-->
+		<el-col :span="24" :xs="24">
+			<el-row :gutter="10" class="mb8 fr">
+				<el-col :span="1.5">
+					<el-button type="info" plain icon="el-icon-upload2" size="mini" @click="handleImport">导入</el-button>
+				</el-col>
+				<el-col :span="1.5">
+					<el-button
+						type="warning"
+						plain
+						icon="el-icon-download"
+						size="mini"
+						:loading="exportLoading"
+						@click="importTemplate"
+						>导出模板</el-button
+					>
+				</el-col>
+			</el-row>
+
+			<el-table v-loading="loading" :data="userList">
+				<el-table-column label="序号" align="center" prop="id" width="80" />
+				<el-table-column label="月份" align="center" prop="month" />
+				<el-table-column label="全厂质量体系问题总数" align="center" prop="factoryProblemTotal" />
+				<el-table-column label="全厂质量体系问题整改数" align="center" prop="factoryProblemRectificationTotal" />
+				<el-table-column label="一般性质量问题数" align="center" prop="commonlyProblemTotal" />
+				<el-table-column label="低层次质量问题数" align="center" prop="lowProblemTotal" />
+				<el-table-column label="产品错检率" align="center" prop="errorCheckTotal" />
+				<el-table-column label="产品漏检率" align="center" prop="leakCheckTotal" />
+				<el-table-column label="质量计划总数" align="center" prop="qualityPlanTotal" />
+				<el-table-column label="质量计划完成数" align="center" prop="qualityPlanCompleteTotal" />
+				<el-table-column label="质量通报总数" align="center" prop="qualityNotificationTotal" />
+				<el-table-column label="质量通报完成数" align="center" prop="qualityNotificationCompleteTotal" />
+			</el-table>
+
+			<pagination
+				v-show="total > 0"
+				:total="total"
+				:autoScroll="false"
+				:pageSizes="[2, 5, 10, 20]"
+				:page.sync="queryParams.pageNum"
+				:limit.sync="queryParams.pageSize"
+				@pagination="getList"
+			/>
+		</el-col>
+		<!-- 用户导入对话框 -->
+		<el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
+			<el-upload
+				ref="upload"
+				:limit="1"
+				accept=".xlsx, .xls"
+				:headers="upload.headers"
+				:action="upload.url"
+				:disabled="upload.isUploading"
+				:on-progress="handleFileUploadProgress"
+				:on-success="handleFileSuccess"
+				:auto-upload="false"
+				drag
+			>
+				<i class="el-icon-upload"></i>
+				<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+				<div class="el-upload__tip" slot="tip">
+					<!-- <div class="el-upload__tip" slot="tip">
+						<el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的用户数据
+					</div> -->
+					<span>仅允许导入xls、xlsx格式文件。</span>
+					<!-- <el-link
+						type="primary"
+						:underline="false"
+						style="font-size: 12px; vertical-align: baseline"
+						@click="importTemplate"
+						>下载模板</el-link
+					> -->
+				</div>
+			</el-upload>
+			<div slot="footer" class="dialog-footer">
+				<el-button type="primary" @click="submitFileForm">确 定</el-button>
+				<el-button @click="upload.open = false">取 消</el-button>
+			</div>
+		</el-dialog>
+	</el-row>
+</template>
+<script>
+import { centerOneList, centerOneImportTemplate } from './indexApi'
+import { getToken } from '@/utils/auth'
+export default {
+	data() {
+		return {
+			// 遮罩层
+			loading: true,
+			// 导出遮罩层
+			exportLoading: false,
+			// 查询参数
+			queryParams: {
+				pageNum: 1,
+				pageSize: this.page_size,
+			},
+			// 用户信息
+			userList: [],
+			// 总条数
+			total: 0,
+			// 用户导入参数
+			upload: {
+				// 是否显示弹出层（用户导入）
+				open: false,
+				// 弹出层标题（用户导入）
+				title: '',
+				// 是否禁用上传
+				isUploading: false,
+				// 是否更新已经存在的用户数据
+				updateSupport: 0,
+				// 设置上传的请求头部
+				headers: { Authorization: 'Bearer ' + getToken() },
+				// 上传的地址
+				url: process.env.VUE_APP_BASE_API + '/hx/qualityManage/importData',
+			},
+		}
+	},
+	methods: {
+		/** 查询用户列表 */
+		getList() {
+			this.loading = true
+			centerOneList(this.queryParams).then(res => {
+				this.userList = res.rows
+				this.total = res.total
+				this.loading = false
+			})
+		},
+		/** 导出按钮操作 */
+		handleExport() {
+			const queryParams = this.queryParams
+			this.$modal
+				.confirm('是否确认导出所有数据项？')
+				.then(() => {
+					this.exportLoading = true
+					return exportUser(queryParams)
+				})
+				.then(response => {
+					this.$download.name(response.msg)
+					this.exportLoading = false
+				})
+				.catch(() => {})
+		},
+		/** 导入按钮操作 */
+		handleImport() {
+			this.upload.title = '数据导入'
+			this.upload.open = true
+		},
+		/** 下载模板操作 */
+		importTemplate() {
+			centerOneImportTemplate().then(response => {
+				this.$download.name(response.msg)
+			})
+		},
+		// 文件上传中处理
+		handleFileUploadProgress(event, file, fileList) {
+			this.upload.isUploading = true
+		},
+		// 文件上传成功处理
+		handleFileSuccess(response, file, fileList) {
+			this.upload.open = false
+			this.upload.isUploading = false
+			this.$refs.upload.clearFiles()
+			this.$alert(response.msg, '导入结果', { dangerouslyUseHTMLString: true })
+			this.getList()
+		},
+		// 提交上传文件
+		submitFileForm() {
+			this.$refs.upload.submit()
+		},
+	},
+	created() {
+		this.getList()
+	},
+}
+</script>
diff --git a/src/views/chartList/page4/index.vue b/src/views/chartList/page4/index.vue
index c0a86f4..b299bfa 100644
--- a/src/views/chartList/page4/index.vue
+++ b/src/views/chartList/page4/index.vue
@@ -8,8 +8,8 @@
 		<left3 />
 		<el-divider content-position="left"><span class="text-bold-18">视频检验系统实况</span></el-divider>
 		<left4 />
-		<!-- <el-divider content-position="left"><span class="text-bold-18">全年目标</span></el-divider>
-		<center1 /> -->
+		<el-divider content-position="left"><span class="text-bold-18">质量管理合格率</span></el-divider>
+		<center1 />
 		<el-divider content-position="left"><span class="text-bold-18">关键参数SPC分析</span></el-divider>
 		<center2 />
 		<el-divider content-position="left"><span class="text-bold-18">质量问题</span></el-divider>
@@ -25,7 +25,7 @@ import left1 from './left1.vue'
 import left2 from './left2.vue'
 import left3 from './left3.vue'
 import left4 from './left4.vue'
-// import center1 from './center1.vue'
+import center1 from './center1.vue'
 import center2 from './center2.vue'
 import right1 from './right1.vue'
 import right2 from './right2.vue'
@@ -36,7 +36,7 @@ export default {
 		left2,
 		left3,
 		left4,
-		// center1,
+		center1,
 		center2,
 		right1,
 		right2,
diff --git a/src/views/chartList/page4/indexApi.js b/src/views/chartList/page4/indexApi.js
index e8c2ac2..cc1aff0 100644
--- a/src/views/chartList/page4/indexApi.js
+++ b/src/views/chartList/page4/indexApi.js
@@ -59,15 +59,14 @@ export function leftFourImportTemplate() {
 /** --------------- center1 --------------- */
 export function centerOneList(params) {
 	return request({
-		url: '/hx/annualTarget/list',
+		url: '/hx/qualityManage/list',
 		params,
 	})
 }
-export function updateAnnualTarget(data) {
+// 导出模板
+export function centerOneImportTemplate() {
 	return request({
-		url: '/hx/annualTarget',
-		method: 'put',
-		data,
+		url: '/hx/qualityManage/importTemplate',
 	})
 }
 /** --------------- center2 --------------- */