Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
af53e3d4 by renchao@pashanhoo.com
Options

style:材料目录

1 parent 0694d334
Inline Side-by-side
Showing 4 changed files with 269 additions and 388 deletions
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-05-06 10:24:46
* @LastEditTime: 2023-05-16 09:50:40
-->
<!DOCTYPE html>
<html>
......@@ -19,7 +19,6 @@
</head>
<script>
window.baseUrl = location.origin || location.protocol + '//' + location.host
window.timeout = 5000
const authorization = "bearer AT-4-MxSrO29Coe7VTazx8uuixtqqgO-hvCB6"
fetch('<%= BASE_URL %>config.json')
.then(response => response.json())
......
......@@ -22,7 +22,8 @@
accept=".JPG, .PNG, .JPEG,.jpg, .png, .jpeg" :before-upload="beforeUpload">
<el-button icon="el-icon-upload" type="primary" v-if="!this.$route.query.viewtype">上传</el-button>
</el-upload>
<el-button type="primary" icon="el-icon-delete-solid" @click="handleDelete" v-if="!this.$route.query.viewtype">删除</el-button>
<el-button type="primary" icon="el-icon-delete-solid" @click="handleDelete"
v-if="!this.$route.query.viewtype && thumbnailImages.length>0">删除</el-button>
</div>
<ul>
<li v-for="(img, index) in thumbnailImages" :key="index" :class="{ active: previewImg.index === index }"
......
......@@ -24,13 +24,13 @@
</div>
</div>
<clxxAddDialog v-model="isDialog" />
<clxxDetailDialog v-model="detailDialog" :data="tableData" />
<!-- <clxxDetailDialog v-model="detailDialog" :data="tableData" /> -->
</div>
</template>
<script>
import { mapGetters } from "vuex";
import clxxAddDialog from "./dialog/clxxAddDialog.vue";
import clxxDetailDialog from "./clxxDetailDialog.vue";
import clxxDetailDialog from "./dialog/clxxDetailDialog.vue";
import imagePreview from '@/views/components/imagePreview.vue'
import { InitClml, saveClml, deleteSjClml, moveClml } from "@/api/clxx.js";
import { popupDialog } from "@/utils/popup.js";
......@@ -39,7 +39,6 @@
data () {
return {
isDialog: false,
detailDialog: false,
iclass: "",
// 材料目录选中
treeCheckIndex: 0,
......@@ -185,15 +184,17 @@
if (data) {
data.map((item) => {
if (item.dcode == val) {
name = item.dname;
name = item.dname
}
});
return name;
return name
}
},
//查看明细
viewDetail () {
this.detailDialog = true;
this.$popupDialog("查看明细", "workflow/components/dialog/clxxDetailDialog", {
data: this.tableData
}, "60%")
},
//设置tableData
setTableData (tableData) {
......
<template>
<dialogBox title="材料明细" width="60%" v-model="value" @closeDialog="closeDialog" :isButton="false">
<div class="clxx">
<div class="right">
<!-- 材料目录明细 -->
<div class="clmlmx-box">
<div class="title">申请材料目录</div>
<lb-table :column="column" :key="key" :heightNum="150" :pagination="false" :data="data">
</lb-table>
</div>
</div>
<div class="clmlmx-box">
<div class="title">申请材料目录</div>
<lb-table :column="column" :key="key" :heightNum="150" :pagination="false" :data="formData.data">
</lb-table>
<div class="text-center">
<el-button @click="$popupCacel">取消</el-button>
</div>
</dialogBox>
</div>
</template>
<script>
import { mapGetters } from "vuex";
import {InitClml,saveClml,deleteSjClml,moveClml} from "@/api/clxx.js";
export default {
components: { },
props: {
value: { type: Boolean, default: false },
data: { type: Array, default: () => {} },
},
data () {
return {
isDialog: false,
iclass: "",
column: [
{
width: "50",
renderHeader: (h, scope) => {
return (
<div>
{
''
}
</div>
)
},
render: (h, scope) => {
return (
<div>
{
this.$route.query.viewtype || scope.row.sfxjcl == '0' ? <span>{}</span> :
<i class="el-icon-minus pointer"
onClick={() => {
this.handleDelete(scope.$index, scope.row);
}}
></i>
}
</div>
)
}
},
{
width: "50",
label: '序号',
render: (h, scope) => {
return <span>{scope.$index + 1}</span>
}
},
{
prop: "isrequired",
label: "是否必选",
width: "50",
render: (h, scope) => {
if (scope.row.sfxjcl === "1") {
import { mapGetters } from "vuex";
import { InitClml, saveClml, deleteSjClml, moveClml } from "@/api/clxx.js";
export default {
props: {
formData: {
type: Object,
default: () => {
return {}
}
}
},
data () {
return {
column: [
{
width: "50",
renderHeader: (h, scope) => {
return (
<div>
<span>可选</span>
{
''
}
</div>
);
}
else {
)
},
render: (h, scope) => {
return (
<div>
<span>必选</span>
{
this.$route.query.viewtype || scope.row.sfxjcl == '0' ? <span>{ }</span> :
<i class="el-icon-minus pointer"
onClick={() => {
this.handleDelete(scope.$index, scope.row);
}}
></i>
}
</div>
);
)
}
},
},
{
prop: "sjmc",
label: "材料名称",
},
{
prop: "sjlx",
label: "材料类型",
width: "80",
render: (h, scope) => {
return (
<div>
<span>{this.dicStatus(scope.row.sjlx, "A40")}</span>
</div>
);
},
},
{
prop: "sjsl",
label: "份数",
width: "50"
},
{
prop: "smzt",
label: "扫描状态",
width: "80",
render: (h, scope) => {
if (scope.row.children && scope.row.children.length > 0) {
return (
<div>
<span>已扫描</span>
</div>
);
} else {
return (
<div>
<span>未扫描</span>
</div>
);
{
width: "50",
label: '序号',
render: (h, scope) => {
return <span>{scope.$index + 1}</span>
}
},
},
{
label: "扫描页数",
width: "50",
render: (h, scope) => {
if (scope.row.children && scope.row.children.length > 0) {
{
prop: "isrequired",
label: "是否必选",
width: "50",
render: (h, scope) => {
if (scope.row.sfxjcl === "1") {
return (
<div>
<span>可选</span>
</div>
);
}
else {
return (
<div>
<span>必选</span>
</div>
);
}
},
},
{
prop: "sjmc",
label: "材料名称",
},
{
prop: "sjlx",
label: "材料类型",
width: "80",
render: (h, scope) => {
return (
<div>
<span>{scope.row.children.length}</span>
<span>{this.dicStatus(scope.row.sjlx, "A40")}</span>
</div>
);
} else {
},
},
{
prop: "sjsl",
label: "份数",
width: "50"
},
{
prop: "smzt",
label: "扫描状态",
width: "80",
render: (h, scope) => {
if (scope.row.children && scope.row.children.length > 0) {
return (
<div>
<span>已扫描</span>
</div>
);
} else {
return (
<div>
<span>未扫描</span>
</div>
);
}
},
},
{
label: "扫描页数",
width: "50",
render: (h, scope) => {
if (scope.row.children && scope.row.children.length > 0) {
return (
<div>
<span>{scope.row.children.length}</span>
</div>
);
} else {
return (
<div>
<span>0</span>
</div>
);
}
},
},
{
label: "操作",
width: "80",
render: (h, scope) => {
return (
<div>
<span>0</span>
<el-button
type="text"
disabled={scope.$index == 0}
onClick={() => {
this.moveUpward(scope.$index, scope.row);
}}
>
上移
</el-button>
<el-button
type="text"
disabled={scope.$index + 1 == this.tableData.length}
onClick={() => {
this.moveDown(scope.$index, scope.row);
}}
>
下移
</el-button>
</div>
);
}
},
},
{
label: "操作",
width: "80",
render: (h, scope) => {
return (
<div>
<el-button
type="text"
disabled={scope.$index == 0}
onClick={() => {
this.moveUpward(scope.$index, scope.row);
}}
>
上移
</el-button>
<el-button
type="text"
disabled={scope.$index + 1 == this.tableData.length}
onClick={() => {
this.moveDown(scope.$index, scope.row);
}}
>
下移
</el-button>
</div>
);
},
},
},
],
key: 0,
tableData: [],
}
},
computed: {
...mapGetters(["dictData"])
},
created () {
},
methods: {
// 材料目录明细初始化
clmlInitList () {
return new Promise(resolve => {
this.unitData = this.$parent.unitData;
var formdata = new FormData();
formdata.append("bsmSldy", this.unitData[0]?.bsmSldy);
formdata.append("bsmSlsq", this.$route.query.bsmSlsq);
InitClml(formdata).then((res) => {
if(res.code == 200){
resolve(res.code)
if(res.result && res.result.length > 0){
this.data = res.result;
}else{
this.data = []
}
}else{
this.$message.error(res.message)
}
})
})
],
key: 0,
tableData: []
}
},
// 上移
moveUpward (index, row) {
let obj = {
xh: row.xh,
bsmSlsq: row.bsmSlsq,
moveDirection: "UP",
};
// 接口待调
moveClml(obj).then(async (res) => {
if (res.code == 200) {
let res = await this.clmlInitList()
if (res == 200) {
this.$message({
message: '上移成功',
type: 'success'
})
this.$parent.setTableData(this.data)
}
} else {
this.$message.error(res.message);
}
})
computed: {
...mapGetters(["dictData"])
},
// 下移
moveDown (index, row) {
let obj = {
xh: row.xh,
bsmSlsq: row.bsmSlsq,
moveDirection: "DOWN",
}
// 接口待调
moveClml(obj).then(async (res) => {
if (res.code == 200) {
let res = await this.clmlInitList()
if (res == 200) {
methods: {
// 材料目录明细初始化
clmlInitList () {
return new Promise(resolve => {
this.unitData = this.$parent.unitData;
var formdata = new FormData();
formdata.append("bsmSldy", this.unitData[0]?.bsmSldy);
formdata.append("bsmSlsq", this.$route.query.bsmSlsq);
InitClml(formdata).then((res) => {
if (res.code == 200) {
resolve(res.code)
if (res.result && res.result.length > 0) {
this.data = res.result;
} else {
this.data = []
}
} else {
this.$message.error(res.message)
}
})
})
},
// 上移
moveUpward (index, row) {
let obj = {
xh: row.xh,
bsmSlsq: row.bsmSlsq,
moveDirection: "UP",
};
// 接口待调
moveClml(obj).then(async (res) => {
if (res.code == 200) {
let res = await this.clmlInitList()
if (res == 200) {
this.$message({
message: '下移成功',
type: 'success'
})
this.$parent.setTableData(this.data)
message: '上移成功',
type: 'success'
})
this.$parent.setTableData(this.data)
}
} else {
this.$message.error(res.message);
}
} else {
this.$message.error(res.message);
})
},
// 下移
moveDown (index, row) {
let obj = {
xh: row.xh,
bsmSlsq: row.bsmSlsq,
moveDirection: "DOWN",
}
})
},
// 材料目录删除
handleDelete (index, row) {
let that = this
this.$confirm('此操作将永久删除该 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
deleteSjClml({ sjBsm: row.bsmSj }).then(async (res) => {
// 接口待调
moveClml(obj).then(async (res) => {
if (res.code == 200) {
let res = await that.clmlInitList()
let res = await this.clmlInitList()
if (res == 200) {
that.$message({
message: "删除成功",
type: "success",
this.$message({
message: '下移成功',
type: 'success'
})
this.$parent.setTableData(this.data)
}
} else {
this.$message.error(res.message);
}
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
},
// 材料目录删除
handleDelete (index, row) {
let that = this
this.$confirm('此操作将永久删除该 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
deleteSjClml({ sjBsm: row.bsmSj }).then(async (res) => {
if (res.code == 200) {
let res = await that.clmlInitList()
if (res == 200) {
that.$message({
message: "删除成功",
type: "success",
})
this.$parent.setTableData(this.data)
}
}
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
})
},
// 字典
dicStatus (val, code) {
let data = this.$store.getters.dictData[code],
name = "暂无";
if (data) {
data.map((item) => {
if (item.dcode == val) {
name = item.dname;
}
});
return name;
}
},
closeDialog(){
this.$emit("input", false);
},
},
};
</script>
<style scoped lang='scss'>
@import "~@/styles/mixin.scss";
.active {
background: $light-blue !important;
color: #fff;
}
.required {
font-size: 12px;
color: $pink;
float: left;
}
.cl_number {
float: right;
}
.clxx {
width: 100%;
display: flex;
padding-left: 5px;
height: calc(100vh - 125px);
.left {
display: flex;
flex-direction: column;
justify-content: space-between;
.item {
width: 28px;
height: 49%;
@include flex-center;
background-color: #E4E7ED;
border-bottom-right-radius: 10px;
padding: 5px;
cursor: pointer;
transition: all 0.3s;
&:hover {
@extend .active;
},
// 字典
dicStatus (val, code) {
let data = this.$store.getters.dictData[code],
name = "暂无";
if (data) {
data.map((item) => {
if (item.dcode == val) {
name = item.dname;
}
});
return name;
}
}
}
}
</script>
<style scoped lang='scss'>
@import "~@/styles/mixin.scss";
.clmlmx-box {
margin: 0 auto;
.right {
width: 100%;
height: 100%;
.clmlmx-box {
margin: 0 auto;
.title {
text-align: center;
height: 60px;
line-height: 60px;
border: 1px solid #dfe6ec;
font-size: 20px;
background: #81d3f81a;
margin-bottom: -1px;
}
}
.clyl-box {
width: 100%;
height: 100%;
display: flex;
.menu-tree {
width: 20%;
min-width: 160px;
height: 100%;
margin-right: 10px;
border-right: 1px dotted #d9d9d9;
padding: 0 15px;
.item {
line-height: 30px;
padding-top: 5px;
border-bottom: 1px solid #e8e8e8;
font-size: 16px;
text-align: center;
color: $light-blue;
.itemIcon {
float: right;
line-height: 60px;
cursor: pointer;
}
.child {
line-height: 32px;
border-bottom: 1px solid #e8e8e8;
padding-left: 10px;
color: #6b6b6b;
cursor: pointer;
box-sizing: border-box;
border-radius: 6px;
line-height: 20px;
transition: all 0.3s;
padding: 8px 0;
}
.child:hover {
color: $light-blue;
transform: scale(1.1);
}
.checked {
border: 1px solid $light-blue;
color: $light-blue;
}
}
}
.clyl-img {
width: 75%;
height: 100%;
background: #f3f4f7;
margin: 0 auto;
position: relative;
}
.title {
text-align: center;
height: 60px;
line-height: 60px;
border: 1px solid #dfe6ec;
font-size: 20px;
background: #81d3f81a;
margin-bottom: -1px;
}
}
}
</style>
\ No newline at end of file
......