工房危险点大图录入

src/views/chartList/page2/one/center2.vue

@@ -0,0 +1,181 @@
+<template>
+	<div>
+		<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="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</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="type" >
+            <template slot-scope="scope">
+              <div v-if="scope.row.type=='1'">
+                危险点图
+              </div>
+              <div v-if="scope.row.type=='2'">
+                工房图
+              </div>
+            </template>
+          </el-table-column>
+					<el-table-column label="大图地址" align="center" prop="pic" >
+            <template slot-scope="scope">
+              <el-image style="width: 100px; height: 100px" fit="cover" :src="scope.row.pic"></el-image>
+            </template>
+          </el-table-column>
+					<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+						<template slot-scope="scope">
+							<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">修改</el-button>
+							<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除</el-button>
+						</template>
+					</el-table-column>
+				</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-row>
+
+		<!-- 添加或修改参数配置对话框 -->
+		<el-dialog :title="title" :visible.sync="open" width="40%" append-to-body>
+			<el-form ref="form" :model="form" :rules="rules" label-width="120px">
+				<el-row>
+					<el-col :span="12">
+						<el-form-item label="大图类型">
+							<el-radio v-model="form.type" label="1">危险点图</el-radio>
+              <el-radio v-model="form.type" label="2">工房图</el-radio>
+						</el-form-item>
+					</el-col>
+					<el-col :span="12">
+            <el-form-item label="大图" prop="pic">
+							<ImageUpload v-model="form.pic" :isShowTip="false" :limit="1" />
+						</el-form-item>
+					</el-col>
+				</el-row>
+			</el-form>
+			<div slot="footer" class="dialog-footer">
+				<el-button type="primary" @click="submitForm">确 定</el-button>
+				<el-button @click="cancel">取 消</el-button>
+			</div>
+		</el-dialog>
+	</div>
+</template>
+
+<script>
+import { centerTwoList, delVideo, addVideo, editVideo } from './indexApi'
+import { getToken } from '@/utils/auth'
+
+export default {
+	data() {
+		return {
+			// 遮罩层
+			loading: true,
+			// 总条数
+			total: 0,
+			// 用户表格数据
+			userList: null,
+			// 弹出层标题
+			title: '',
+			// 是否显示弹出层
+			open: false,
+			// 表单参数
+			form: {},
+			// 查询参数
+			queryParams: {
+				pageNum: 1,
+				pageSize: this.page_size,
+			},
+			// 表单校验
+			rules: {
+				pic: [{ required: true, message: '请上传大图', trigger: 'blur' }],
+			},
+		}
+	},
+	created() {
+		this.getList()
+	},
+	methods: {
+		/** 查询列表 */
+		getList() {
+			this.loading = true
+			centerTwoList(this.queryParams).then(response => {
+				this.userList = response.rows
+				this.total = response.total
+				this.loading = false
+			})
+		},
+		// 取消按钮
+		cancel() {
+			this.open = false
+			this.reset()
+		},
+		// 表单重置
+		reset() {
+			this.form = {
+				id: undefined,
+				type: '1',
+				videoName: undefined,
+				remark: undefined,
+			}
+			this.resetForm('form')
+		},
+		/** 新增按钮操作 */
+		handleAdd() {
+			this.reset()
+			this.open = true
+			this.title = '添加'
+		},
+		/** 修改按钮操作 */
+		handleUpdate(row) {
+			this.reset()
+			this.form = Object.assign({}, row)
+      this.form.videoFileName='http://192.168.0.115:1818/' + this.form.videoFileName
+			this.open = true
+			this.title = '修改装药量概况'
+		},
+		/** 提交按钮 */
+		submitForm: function () {
+			this.$refs['form'].validate(valid => {
+				if (valid) {
+					if (this.form.id != undefined) {
+						editVideo(this.form).then(response => {
+							this.$modal.msgSuccess('修改成功')
+							this.open = false
+							this.getList()
+						})
+					} else {
+						addVideo(this.form).then(response => {
+							this.$modal.msgSuccess('新增成功')
+							this.open = false
+							this.getList()
+						})
+					}
+				}
+			})
+		},
+		/** 删除按钮操作 */
+		handleDelete(row) {
+			this.$modal
+				.confirm('是否确认删除序号为"' + row.id + '"的数据项？')
+				.then(function () {
+					return delVideo({hxBigPicId:row.id})
+				})
+				.then(() => {
+					this.getList()
+					this.$modal.msgSuccess('删除成功')
+				})
+				.catch(() => {})
+		},
+	},
+}
+</script>

src/views/chartList/page2/one/index.vue

@@ -8,8 +8,8 @@
 		<left3 />
 		<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>
+		<el-divider content-position="left"><span class="text-bold-18">危险点、工房图片管理</span></el-divider>
-		<center2 /> -->
+		<center2 />
 		<el-divider content-position="left"><span class="text-bold-18">全厂作业明细</span></el-divider>
 		<right1 />
 		<el-divider content-position="left"><span class="text-bold-18">装药当前作业内容</span></el-divider>
@@ -23,7 +23,7 @@ import left1 from './left1.vue'
 import left2 from './left2.vue'
 import left3 from './left3.vue'
 import center1 from './center1.vue'
-// import center2 from './center2.vue'
+import center2 from './center2.vue'
 import right1 from './right1.vue'
 import right2 from './right2.vue'
 import right3 from './right3.vue'
@@ -33,7 +33,7 @@ export default {
 		left2,
 		left3,
 		center1,
-		// center2,
+		center2,
 		right1,
 		right2,
 		right3,

src/views/chartList/page2/one/indexApi.js

@@ -56,20 +56,38 @@ export function centerOneImportTemplate(data) {
 		url: '/hx/workHome/importTemplate',
 	})
 }
-// /** --------------- center2 --------------- */
+/** --------------- center2 --------------- */
-// //
+// 大图列表
-// export function centerTwoList(params) {
+export function centerTwoList(params) {
-// 	return request({
+	return request({
-// 		url: '/hx/todayDynamic/list',
+		url: '/hx/bigPic/list',
-// 		params,
+		params,
-// 	})
+	})
-// }
+}
-// //
+// 删除大图
-// export function centerTwoImportTemplate() {
+export function delVideo(params) {
-// 	return request({
+  return request({
-// 		url: '/hx/todayDynamic/importTemplate',
+    url: '/hx/bigPic',
-// 	})
+    method: 'delete',
-// }
+    params
+  })
+}
+// 新增大图
+export function addVideo(data) {
+	return request({
+		url: '/hx/bigPic',
+    method:'post',
+    data
+	})
+}
+// 修改大图
+export function editVideo(data) {
+	return request({
+		url: '/hx/bigPic',
+    method:'put',
+    data
+	})
+}
 /** --------------- right1 --------------- */
 // 全厂作业明细列表
 export function rightOneList(params) {