<template>
|
<div class="signet_list_main">
|
<SearchCondition
|
:info="info"
|
ref="condRef"
|
:conForm="conForm"
|
:buttonsList="[1, 2]"
|
:isShowDetail="isShowDetail"
|
:screenWidth="screenWidth"
|
@handleOnSeach="handleOnSeach"
|
@handleOnRest="handleOnRest"
|
@handleClick="isShowDetail = !isShowDetail"
|
/>
|
<div />
|
<!-- <el-row class="add-button">
|
<el-col :span="24">
|
<el-button
|
type="primary"
|
size="small"
|
icon="el-icon-refresh"
|
@click="handleAddPage"
|
class="add-btn"
|
>生效配置</el-button
|
>
|
</el-col>
|
</el-row>-->
|
<ProTable
|
:pageInfo="pageInfo"
|
@doAction="doAction"
|
@handleCurrentChange="handleCurrentChange"
|
@handleSizeChange="handleSizeChange"
|
:isAutoIndex="true"
|
:list="records"
|
:header="tableHeader"
|
:loading="loading"
|
/>
|
<el-dialog
|
title="上传图片"
|
:visible.sync="dialogVisible"
|
:close-on-click-modal="false"
|
:close-on-press-escape="false"
|
:destroy-on-close="true"
|
:show-close="false"
|
width="450"
|
center
|
custom-class="upload_dialog"
|
>
|
<FileUpload
|
:fileInfo="fileInfo"
|
:isUpload="true"
|
:multiple="false"
|
:isShowTitle="'false'"
|
@beforeAvatarUpload="beforeAvatarUpload"
|
@handleUpload="handleUpload"
|
@handleCancle="handleCancle"
|
@handleDelete="handleDelete"
|
/>
|
<!-- <template slot="footer" class="dialog-footer">
|
<el-button @click="handleCancle">取 消</el-button>
|
<el-button type="primary" @click="saveHelpDoc">确 定</el-button>
|
</template>-->
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import {
|
SIGNETMANAGECOND,
|
SIGNETMANAGECONDDEF
|
} from "../config/condtion.config";
|
import { SIGNETMANAGECOLUMN } from "../config/column.config";
|
import ProTable from "../../components/ProTable";
|
import SearchCondition from "../../components/SearchCondition";
|
import FileUpload from "../../components/FileUpload";
|
import {
|
qrySignatureList,
|
qrySignatureImageInfo,
|
uploadImageForSignature
|
} from "@/http/api";
|
export default {
|
data() {
|
return {
|
info: [...SIGNETMANAGECOND],
|
restFormItems: [...SIGNETMANAGECOND],
|
tableHeader: [...SIGNETMANAGECOLUMN],
|
conForm: { ...SIGNETMANAGECONDDEF },
|
pageInfo: {
|
currentPage: 1,
|
pageSize: 10,
|
total: 0
|
},
|
fileInfo: {
|
required: false,
|
description: "",
|
count: 0,
|
images: [],
|
key: "signetInfo"
|
},
|
records: [],
|
newTypeno: "",
|
itemNo: "", //列表对应的签章编号
|
screenWidth: document.body.offsetWidth,
|
condtionValue: {}, // 表单value集合
|
isShowBorder: true,
|
isShowDetail: false, // 是否显示所有表单项
|
isView: false,
|
loading: false,
|
btnLoading: false,
|
dialogVisible: false
|
};
|
},
|
components: {
|
SearchCondition,
|
ProTable,
|
FileUpload
|
},
|
created() {},
|
mounted() {
|
window.addEventListener("resize", this.getScreenWidth);
|
this.getSignatureList();
|
},
|
destroyed() {
|
window.removeEventListener("resize", this.getScreenWidth);
|
},
|
methods: {
|
getScreenWidth() {
|
this.$set(this, "screenWidth", document.body.offsetWidth);
|
},
|
// 获取列表
|
async getSignatureList() {
|
const { currentPage, pageSize } = this.pageInfo;
|
const { itemname, itemno, updateuser } = this.condtionValue;
|
const loading = this.$loading({
|
lock: true,
|
text: "",
|
background: "hsla(0,0%,100%,.9)"
|
});
|
setTimeout(() => {
|
loading.close();
|
}, 1500);
|
const params = {
|
currentPage,
|
itemname,
|
updateuser,
|
itemno,
|
pageSize
|
};
|
const listRes = await qrySignatureList(params);
|
loading.close();
|
if (listRes.code && listRes.code === "00") {
|
const newList =
|
listRes.result &&
|
listRes.result.records.map(item => {
|
const newItem = { ...item };
|
newItem.operationOption = [
|
{ label: "上传图片", type: "upload", value: true }
|
];
|
return newItem;
|
});
|
this.$set(this, "records", newList);
|
this.$set(
|
this.pageInfo,
|
"total",
|
listRes.result && listRes.result.total
|
);
|
}
|
},
|
// 获取签章信息
|
async SignatureImageInfo() {
|
const params = {
|
itemno: this.itemNo
|
};
|
const signetInfoRes = await qrySignatureImageInfo(params);
|
if (!signetInfoRes || signetInfoRes.code !== "00") {
|
return false;
|
}
|
if (signetInfoRes.result.url) {
|
const { url, filename } = signetInfoRes.result;
|
this.$set(this.fileInfo, "images", [{ url, filename }]);
|
}
|
},
|
// 搜索列表
|
handleOnSeach() {
|
const conRef = this.$refs.condRef;
|
this.$set(this, "condtionValue", conRef.$refs["conform"].model);
|
this.$set(this, "pageInfo", { currentPage: 1, pageSize: 10, total: 0 });
|
this.getSignatureList();
|
},
|
|
// 获取筛选条件value
|
setValueInfo(condtions) {
|
this.$set(this, "condtionValue", condtions);
|
},
|
|
// 重置
|
handleOnRest() {
|
this.$set(this, "condtionValue", {});
|
// this.$set(this, 'pageInfo', { currentPage: 1, pageSize: 10, total: 0 })
|
// this.getProductList()
|
},
|
// 表单事件回调
|
async doAction(name, item, { type }) {
|
if (type === "upload") {
|
this.itemNo = item.itemno;
|
await this.SignatureImageInfo();
|
this.dialogVisible = true;
|
}
|
},
|
// 上传前事件
|
beforeAvatarUpload() {
|
const doclistRef = this.$refs.doclist;
|
doclistRef.$refs["createForm"].validate(async valid => {
|
if (valid) {
|
return true;
|
} else {
|
this.$message.error("请完必填项！");
|
return false;
|
}
|
});
|
},
|
// 上传文件
|
handleUpload(fileData) {
|
if (!fileData) {
|
return false;
|
}
|
const { itemNo } = this;
|
const formData = new FormData();
|
formData.append("file", fileData);
|
formData.append("itemNo ", itemNo);
|
uploadImageForSignature(formData).then(res => {
|
if (res.code === "00") {
|
this.$message.success("上传成功！");
|
this.SignatureImageInfo();
|
this.dialogVisible = false;
|
this.getSignatureList();
|
}
|
});
|
},
|
handleCancle() {
|
this.fileInfo.images = [];
|
this.getSignatureList();
|
this.dialogVisible = false;
|
},
|
// 删除文件
|
async handleDelete() {
|
this.fileInfo.images = [];
|
},
|
// 新增
|
handleAddPage() {},
|
// 保存文档
|
saveHelpDoc() {
|
this.handleCancle();
|
},
|
// 修改翻页条数
|
handleSizeChange(val) {
|
this.pageInfo.pageSize = val;
|
this.getSignatureList();
|
},
|
|
// 修改翻页数
|
handleCurrentChange(val) {
|
this.pageInfo.currentPage = val;
|
this.getSignatureList();
|
}
|
}
|
};
|
</script>
|
|
<style lang="less">
|
.signet_list_main {
|
padding: 16px 0px 0 20px;
|
& .upload_dialog {
|
width: 350px;
|
& .is-always-shadow {
|
box-shadow: none;
|
}
|
& .el-card__body {
|
padding: 0px;
|
}
|
& .images {
|
text-align: center;
|
& .imagesList {
|
position: relative;
|
& .img-item {
|
& .el-icon-error {
|
display: none;
|
position: absolute;
|
right: 0;
|
top: -2px;
|
}
|
& img {
|
width: auto;
|
height: auto;
|
}
|
& .real-images {
|
max-height: 151px;
|
max-width: 242px;
|
}
|
}
|
}
|
// & img {
|
// max-height: 151px;
|
// width: 242px;
|
// }
|
& .alone-upload {
|
margin-top: 20px;
|
& .button-upload {
|
margin-top: 5px;
|
display: flex;
|
justify-content: center;
|
& .el-upload-list__item-name {
|
display: none;
|
}
|
}
|
}
|
}
|
& .el-button--default {
|
width: 120px;
|
height: 30px;
|
line-height: 7px;
|
border-radius: 4px;
|
border: 1px solid rgba(204, 204, 204, 1);
|
}
|
& .el-button--primary {
|
width: 120px;
|
height: 30px;
|
line-height: 7px;
|
background: #0081f0;
|
border-color: #0081f0;
|
border-radius: 4px;
|
margin-left: 40px;
|
}
|
}
|
& .add-button {
|
padding: 2px 0 30px 0;
|
}
|
}
|
</style>
|
