Files
Arbitrate-Frontend/src/views/officialSeal/components/sealManage.vue
T
2023-11-25 17:57:10 +08:00

117 lines
4.4 KiB
Vue

<template>
<div>
<el-dialog title="公章列表" :visible="sealVisable" @close="cancel" width="800px" center :distroy-on-close="true">
<el-table v-loading="loading" :data="dataList" style="width: 100%">
<el-table-column label="序号" type="index" align="center">
<template slot-scope="scope">
<span>{{
(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1
}}</span>
</template>
</el-table-column>
<el-table-column label="印章名称" align="center" prop="sealName"
:show-overflow-tooltip="true"></el-table-column>
<el-table-column label="印章图片" align="center" prop="annexPath">
<template slot-scope="scope">
<el-image style="width: 40px; height: 40px;" :src="imgUrl + scope.row.annexPath"
:preview-src-list="[imgUrl + scope.row.annexPath]">
</el-image>
<!-- <span>{{ imgUrl + scope.row.annexPath }}</span> -->
</template>
</el-table-column>
<el-table-column label="是否启用" align="center" prop="sealStatus">
<template slot-scope="scope">
<el-tag type="success" v-if="scope.row.isUse == 1">已启用</el-tag>
<el-tag type="info"
v-if="(scope.row.isUse == 0 || scope.row.isUse == null) && scope.row.sealStatus !== 0">未启用</el-tag>
<el-tag type="danger" v-if="scope.row.sealStatus == 0">审核中</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button size="mini" @click="isUseChange(scope.row.id, 1)" type="text" icon="el-icon-thumb"
v-if="(scope.row.isUse == 0 || scope.row.isUse == null) && scope.row.sealStatus !== 0">启用</el-button>
<el-button size="mini" @click="isUseChange(scope.row.id, 0)" type="text" icon="el-icon-thumb"
v-if="scope.row.isUse == 1">禁用</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" @pagination="sealListFn(queryParams)" />
</el-dialog>
</div>
</template>
<script>
import {
sealList,
updateSealLockStatus
} from "@/api/officialSeal/officialSeal.js";
export default {
props: ["sealVisable", "sealData"],
data() {
return {
loading: false,
srcList: [],
queryParams: {
pageNum: 1,
pageSize: 10,
},
dataList: [
],
total: 0,
imgUrl: ""
};
},
watch: {
sealVisable(val) {
if (val) {
this.queryParams.id = this.sealData.id;
this.sealListFn(this.queryParams)
}
}
},
created() {
this.UploadUrl()
},
methods: {
UploadUrl() {
this.imgUrl = window.location.origin + '/API';
},
// 查询列表数据
sealListFn(data) {
this.loading = true;
sealList(data).then(res => {
this.dataList = res.rows;
this.total = res.total;
this.loading = false;
})
},
// 更新公章状态
updateSealLockStatusFn(data) {
updateSealLockStatus(data).then(res => {
this.$message.success('更新状态成功');
this.sealListFn(this.queryParams);
})
},
// 启用或者禁用公章
isUseChange(id, type) {
let params = {
id: id,
isUse: type
}
this.$modal
.confirm("是否更改状态")
.then((res) => {
this.updateSealLockStatusFn(params);
})
},
cancel() {
this.$emit("cancelSeal");
},
},
};
</script>
<style lang="scss" scoped></style>