Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
f5d3e134 by 任超
Options

style:wolkflow

1 parent e332135c
Expand all
Inline Side-by-side
Showing 7 changed files with 185 additions and 279 deletions
const getters = {
sidebar: state => state.app.sidebar,
size: state => state.app.size,
flag: state => state.app.splitScreen,
visitedViews: state => state.tagsView.visitedViews,
cachedViews: state => state.tagsView.cachedViews,
token: state => state.user.token,
......
......@@ -2,7 +2,8 @@ import Cookies from 'js-cookie'
const state = {
size: 'small',
theme: '#409EFF'
theme: '#409EFF',
splitScreen: false
}
const mutations = {
......@@ -13,6 +14,9 @@ const mutations = {
UPDATE_THEME (state, val) {
state.theme = val;
},
SET_SCREEN (state, val) {
state.splitScreen = val;
}
}
const actions = {
......@@ -21,6 +25,9 @@ const actions = {
},
updateTheme ({ commit }, val) {
commit('UPDATE_THEME', val)
},
settScreen ({ commit }, val) {
commit('SET_SCREEN', val)
}
}
......
......@@ -349,8 +349,8 @@ export default {
.clxx {
width: 100%;
display: flex;
padding-left: 15px;
height: calc(100vh - 150px);
padding-left: 5px;
height: calc(100vh - 90px);
.left {
display: flex;
......@@ -358,12 +358,12 @@ export default {
justify-content: space-between;
.item {
width: 42px;
width: 28px;
height: 49%;
@include flex-center;
background-color: #E4E7ED;
border-bottom-right-radius: 10px;
padding: 15px;
padding: 5px;
cursor: pointer;
transition: all 0.3s;
......@@ -376,8 +376,6 @@ export default {
.right {
width: 100%;
height: 100%;
padding: 0 15px;
.clmlmx-box {
margin: 0 auto;
......
<template>
<div class="slxx">
<el-form
:model="ruleForm"
:rules="rules"
ref="ruleForm"
:label-position="flagTop"
:inline="flag"
label-width="120px"
>
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" :label-position="flagTop" :inline="flag"
label-width="120px">
<div class="slxx_con">
<div class="slxx_title">受理信息</div>
<el-row :gutter="10">
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="业务号："
prop="ywh"
>
<el-form-item :class="flag ? 'marginBot0' : ''" label="业务号：" prop="ywh">
<el-input disabled v-model="ruleForm.ywh"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="受理人员："
prop="slry"
>
<el-form-item :class="flag ? 'marginBot0' : ''" label="受理人员：" prop="slry">
<el-input disabled v-model="ruleForm.slry"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="受理时间："
prop="slsj"
>
<el-form-item :class="flag ? 'marginBot0' : ''" label="受理时间：" prop="slsj">
<el-input disabled v-model="ruleForm.slsj"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="10">
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="权利类型："
prop="qllx"
>
<el-select
disabled
v-model="ruleForm.qllx"
filterable
clearable
placeholder="请选择权利类型"
>
<el-option
v-for="item in dictData['A8']"
:key="item.dcode"
:label="item.dname"
:value="item.dcode"
>
<el-form-item :class="flag ? 'marginBot0' : ''" label="权利类型：" prop="qllx">
<el-select disabled v-model="ruleForm.qllx" filterable clearable placeholder="请选择权利类型">
<el-option v-for="item in dictData['A8']" :key="item.dcode" :label="item.dname" :value="item.dcode">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="登记类型："
prop="djlx"
>
<el-select
disabled
v-model="ruleForm.djlx"
filterable
clearable
placeholder="请选择登记类型"
>
<el-option
v-for="item in dictData['A21']"
:key="item.dcode"
:label="item.dname"
:value="item.dcode"
>
<el-form-item :class="flag ? 'marginBot0' : ''" label="登记类型：" prop="djlx">
<el-select disabled v-model="ruleForm.djlx" filterable clearable placeholder="请选择登记类型">
<el-option v-for="item in dictData['A21']" :key="item.dcode" :label="item.dname" :value="item.dcode">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="登记情形："
prop="djqx"
>
<el-form-item :class="flag ? 'marginBot0' : ''" label="登记情形：" prop="djqx">
<el-input disabled v-model="ruleForm.djqxmc"></el-input>
</el-form-item>
</el-col>
......@@ -99,52 +47,32 @@
<div class="slxx_title">查封不动产情况</div>
<el-row :gutter="10">
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="不动产权证号："
prop="bdcqzh"
>
<el-form-item :class="flag ? 'marginBot0' : ''" label="不动产权证号：" prop="bdcqzh">
<el-input disabled v-model="ruleForm.bdcqzh"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="不动产单元号："
prop="bdcdyh"
>
<el-form-item :class="flag ? 'marginBot0' : ''" label="不动产单元号：" prop="bdcdyh">
<el-input disabled v-model="ruleForm.bdcdyh"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="权利人："
prop="qlrmc"
>
<el-form-item :class="flag ? 'marginBot0' : ''" label="权利人：" prop="qlrmc">
<el-input disabled v-model="ruleForm.qlrmc"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="10">
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="面积："
prop="mj"
>
<el-form-item :class="flag ? 'marginBot0' : ''" label="面积：" prop="mj">
<el-input disabled v-model="ruleForm.mj"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="用途："
prop="ytmc"
>
<el-form-item :class="flag ? 'marginBot0' : ''" label="用途：" prop="ytmc">
<el-input disabled v-model="ruleForm.ytmc"></el-input>
</el-form-item>
</el-col>
</el-col>
</el-row>
<div class="slxx_title">不动产权利人信息</div>
<!-- <el-row :gutter="10">
......@@ -186,16 +114,8 @@
<div class="slxx_title">登记原因</div>
<el-row :gutter="10">
<el-col>
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="登记原因："
prop="djyy"
>
<el-input
class="textArea"
type="textarea"
v-model="ruleForm.djyy"
></el-input>
<el-form-item :class="flag ? 'marginBot0' : ''" label="登记原因：" prop="djyy">
<el-input class="textArea" type="textarea" v-model="ruleForm.djyy"></el-input>
</el-form-item>
</el-col>
</el-row>
......@@ -213,7 +133,7 @@ import InformationTable from "./InformationTable";
import { Init, fristReg } from "@/api/cfdjFlow.js";
import { mapGetters } from "vuex";
export default {
data() {
data () {
return {
disabled: true,
flagTop: this.flag ? "top" : "",
......@@ -247,13 +167,13 @@ export default {
czr: "",
},
rules: {},
//传递参数
//传递参数
propsParam: {},
};
},
created() {
created () {
// console.log(1111111111111111);
this.propsParam = this.$attrs;
this.propsParam = this.$attrs;
var formdata = new FormData();
formdata.append("bsmSldy", this.propsParam.bsmSldy);
Init(formdata).then((res) => {
......@@ -283,9 +203,9 @@ export default {
computed: {
...mapGetters(["dictData"]),
},
methods: {
list(bsmSldy) {
list (bsmSldy) {
var formdata = new FormData();
formdata.append("bsmSldy", bsmSldy);
Init(formdata).then((res) => {
......@@ -299,7 +219,7 @@ export default {
}
});
},
onSubmit() {
onSubmit () {
fristReg(this.ruleForm).then((res) => {
if (res.code === 200 && res.result) {
console.log(res);
......@@ -335,11 +255,9 @@ export default {
.slxx {
box-sizing: border-box;
padding-right: 15px;
}
.slxx_con {
height: calc(100vh - 190px);
overflow-y: auto;
overflow-x: hidden;
}
......
.containerFrame {
height: 100%;
width: 100%;
position: sticky;
top: 80px;
//background-color: #ffffff;
border: 1px solid #ebeef5;
z-index: 100;
@include flex;
}
#ContainerFrame {
height: 100%;
width: 100%;
position: sticky;
top: 80px;
//background-color: #ffffff;
border: 1px solid #ebeef5;
z-index: 100;
@include flex;
.leftmenu {
flex: 0 0 260px;
border-right: 1px solid #ebeef5;
position: relative;
box-sizing: border-box;
padding-right: 5px;
.title {
line-height: 36px;
padding-left: 10px;
}
#leftmenu {
width: 250px;
border-right: 1px solid #ebeef5;
ul {
position: relative;
box-sizing: border-box;
ul {
position: relative;
.xian {
background: #f2f2f2;
padding: 2px;
}
.title {
padding: 5px;
text-align: center;
}
li {
padding: 5px;
font-size: 14px;
color: #606266;
line-height: 20px;
}
li:hover {
color: #0f93f6;
cursor: pointer;
}
.xian {
background: #f2f2f2;
padding: 2px;
}
}
#rightContainer {
.tabDiv {
width: 100%;
height: 100%;
.title {
padding: 5px;
text-align: center;
}
li {
padding: 5px;
font-size: 14px;
color: #606266;
line-height: 20px;
cursor: pointer;
}
li:hover {
color: #0f93f6;
cursor: pointer;
}
// .fenpin {
// min-width: 50%;
// border-right: 1px solid #ebeef5;
// }
//padding:5px 0 0 15px;
background-color: #ffffffe7;
width: 100%;
height: 100%;
z-index: 100;
@include flex;
}
.svg-icon {
width: 2.5em;
height: 2.5em;
}
.iconName {
line-height: 24px;
font-size: 12px;
}
.container {
width: 100%;
height: 100%;
padding: 0;
box-sizing: border-box;
background-color: #ffffff;
overflow: hidden;
}
.topButton {
}
.leftCon {
flex: 1;
width: calc(100% - 260px);
display: flex;
}
.splitScreen-con {
flex: 1;
}
.rightContainer {
flex: 1;
width: 0;
height: calc(100vh - 80px);
}
/deep/.el-tabs {
box-sizing: border-box;
padding: 0 5px;
width: 100%;
}
.svg-icon {
width: 2.5em;
height: 2.5em;
}
.iconName {
line-height: 24px;
font-size: 12px;
}
.container {
width: 100%;
height: 100%;
padding: 0;
box-sizing: border-box;
background-color: #ffffff;
overflow: hidden;
}
.topButton {
@include flex;
width: 100%;
height: 80px;
background-color: #3498db;
color: #ffffff;
justify-content: space-between;
padding-left: 15px;
position: sticky;
top: 0;
z-index: 100;
ul {
@include flex;
width: 100%;
height: 80px;
background-color: #3498db;
color: #ffffff;
justify-content: space-between;
padding-left: 15px;
position: sticky;
top: 0;
z-index: 100;
ul {
@include flex;
li {
@include flex-center;
cursor: pointer;
flex-direction: column;
margin-right: 15px;
box-sizing: border-box;
width: 70px;
margin: 0 5px;
}
li:hover {
border: 1px solid #ffffff;
border-radius: 5px;
//color: $light-blue ;
.svg-icon {
//color: $light-blue ;
}
}
li {
@include flex-center;
cursor: pointer;
flex-direction: column;
margin-right: 15px;
box-sizing: border-box;
width: 70px;
margin: 0 5px;
}
}
\ No newline at end of file
li:hover {
border: 1px solid #ffffff;
border-radius: 5px;
}
}
}
\ No newline at end of file
......
......@@ -4,71 +4,46 @@
<div class="topButton">
<!-- 左侧业务功能按钮 -->
<ul>
<li
@click="operation(index, item)"
v-for="(item, index) in leftButtonList"
:key="index"
>
<li @click="operation(index, item)" v-for="(item, index) in leftButtonList" :key="index">
<svg-icon :icon-class="item.icon" />
<span class="iconName">{{ item.name }}</span>
</li>
</ul>
<!-- 右侧流程按钮 -->
<ul>
<li
@click="operation(index, item)"
v-for="(item, index) in rightButtonList"
:key="index"
>
<li @click="operation(index, item)" v-for="(item, index) in rightButtonList" :key="index">
<svg-icon class="icon" :icon-class="item.icon" />
<span class="iconName">{{ item.name }}</span>
</li>
</ul>
</div>
<!-- 内容框架 -->
<div id="ContainerFrame">
<div class="containerFrame">
<!-- 左侧菜单栏 -->
<div id="leftmenu">
<div class="leftmenu">
<div class="title">申请单元列表({{ unitData.length }})</div>
<el-menu default-active="0" @select="unitClick">
<el-menu-item
v-for="(item, index) in unitData"
:index="index.toString()"
:key="index"
>
<i>
<p>{{ item.bdcdyh }}</p>
<p>{{ item.zl }}</p>
</i>
<el-menu-item v-for="(item, index) in unitData" :index="index.toString()" :key="index">
<p>{{ item.bdcdyh }}</p>
<p>{{ item.zl }}</p>
</el-menu-item>
</el-menu>
</div>
<!-- 分屏左侧预览 -->
<div v-if="splitScreen" class="splitScreen-con">
<component :is="clxxForm" v-bind="currentSelectProps" :key="fresh" />
</div>
<!-- 表单内容区域 -->
<div id="rightContainer">
<div class="tabDiv">
<div class="leftCon">
<!-- 分屏左侧预览 -->
<div v-if="splitScreen" class="splitScreen-con">
<component :is="clxxForm" v-bind="currentSelectProps" :key="fresh" />
</div>
<!-- 表单内容区域 -->
<div class="rightContainer">
<el-tabs v-model="tabName" @tab-click="tabClick">
<el-tab-pane
:label="item.name"
:name="item.value"
v-for="(item, index) in tabList"
:key="index"
>
<el-tab-pane :label="item.name" :name="item.value" v-for="(item, index) in tabList" :key="index">
</el-tab-pane>
<component
:key="fresh"
:is="componentTag"
v-bind="currentSelectProps"
/>
</el-tabs>
<component :key="fresh" :is="componentTag" v-bind="currentSelectProps" />
</div>
</div>
</div>
<!-- <zslqDialog ref="zslqDialog" v-model="zslqDialog" /> -->
</div>
</template>
......@@ -87,13 +62,8 @@ import {
} from "@/api/fqsq.js";
import { getForm } from "./flowform.js";
import axios from "axios";
// import zc from "./components/zc.vue";
// import thDialog from "./components/th.vue";
// import zsylDialog from "./components/zsyl";
// import zslqDialog from "./components/zslq";
export default {
// components: { zc, thDialog, zsylDialog, comMsg,zslqDialog},
data() {
data () {
return {
//受理申请标识码
bsmSlsq: this.$route.query.bsmSlsq,
......@@ -125,13 +95,13 @@ export default {
clxxTab: {},
};
},
mounted() {
mounted () {
this.loadBdcdylist();
this.flowInitParam();
},
methods: {
//加载流程初始参数
flowInitParam() {
flowInitParam () {
var formdata = new FormData();
formdata.append("bsmSlsq", this.bsmSlsq);
formdata.append("bestepid", this.bestepid);
......@@ -156,7 +126,7 @@ export default {
});
},
//流程环节操作按钮
operation(index, item) {
operation (index, item) {
let that = this;
switch (item.value) {
case "zsyl":
......@@ -164,6 +134,7 @@ export default {
break;
case "clfp": //材料分屏按钮
this.splitScreen = this.splitScreen ? false : true;
this.$store.dispatch('app/settScreen', this.splitScreen)
if (this.splitScreen) {
//如果当前选项卡为材料信息内容，递减到上一个选项卡内容
if (this.tabName == this.clxxTab.value) {
......@@ -176,10 +147,6 @@ export default {
}
break;
case "th": //退回按钮
// this.thflag = true;
// this.$nextTick(() => {
// this.$refs.thdialogRef.tablelistFn();
// });
break;
case "zc": //转件按钮
getNextLinkInfo({
......@@ -218,7 +185,7 @@ export default {
}
},
//读取申请单元信息
loadBdcdylist() {
loadBdcdylist () {
var formdata = new FormData();
formdata.append("bsmSlsq", this.bsmSlsq);
formdata.append("bestepid", this.bestepid);
......@@ -230,27 +197,27 @@ export default {
});
},
//申请单元点击事件
unitClick(index) {
unitClick (index) {
if (this.currentSelectProps.bsmSldy != this.unitData[index].bsmSldy) {
this.currentSelectProps = this.unitData[index];
this.fresh += 1;
}
},
//表单选项卡事件
tabClick(tab, event) {
tabClick (tab, event) {
//this.$alert(tab.name);
this.getFromRouter(tab.name);
},
//切换选项卡内容组件
getFromRouter(tabname) {
getFromRouter (tabname) {
this.componentTag = getForm(tabname);
},
//发送下一个环节
send(obj) {
send (obj) {
const h = this.$createElement;
this.$msgbox({
title: "您确定转出吗？",
message: h("div", { style: "margin: auto" }, [
message: h("div", { style: "margin: auto" }, [
h("span", null, "下个环节名称："),
h("i", { style: "color: teal" }, obj.taskName),
h("div", null, ""),
......@@ -265,9 +232,9 @@ export default {
instance.confirmButtonLoading = true;
instance.confirmButtonText = "执行中...";
completeTask({
bsmSlsq: this.bsmSlsq,
shyj: "this.bestepid",
}).then((res) => {
bsmSlsq: this.bsmSlsq,
shyj: "this.bestepid",
}).then((res) => {
if (res.code === 200) {
instance.confirmButtonLoading = false;
this.$message.success("转件成功");
......