Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
7c396b41 by 田浩浩
Options

111

1 parent dc814a88
Inline Side-by-side
Showing 1 changed file with 270 additions and 63 deletions
......@@ -14,46 +14,33 @@
{{ item.nodename }}
</li>
</ul>
<el-collapse v-model="activeName" accordion>
<el-collapse-item title="业务详情" name="1">
<el-form
:model="form"
v-show="n == 0"
:rules="rules"
label-width="135px"
ref="ruleForm"
>
<el-row>
<el-col :span="8">
<el-form-item label="权利类型编码">
<el-input v-model="form.ywDetail.qllxbm" disabled></el-input>
</el-form-item>
</el-col>
<!-- <el-col :span="8">
<el-form-item label="权利类型名称">
<el-input v-model="form.ywDetail.qllxmc" disabled></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="申请分类">
<el-select v-model="form.ywDetail.sqfl" disabled placeholder="请选择" class="width100">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col> -->
</el-row>
<!-- <el-row>
</el-col>
<el-col :span="8">
<el-form-item label="登记类型编码">
<el-input v-model="form.ywDetail.djlxbm" disabled></el-input>
<el-form-item label="登记业务编码">
<el-input v-model="form.ywDetail.djywbm" disabled></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="登记类型名称">
<el-input v-model="form.ywDetail.djlxmc" disabled></el-input>
<el-form-item label="登记业务名称">
<el-input v-model="form.ywDetail.djywmc" disabled></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="发起业务单元类型">
<el-select v-model="form.ywDetail.fqywdylx" disabled placeholder="请选择" class="width100">
......@@ -62,20 +49,6 @@
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="登记业务编码">
<el-input v-model="form.ywDetail.djywbm" disabled></el-input>
</el-form-item>
</el-col>
<el-col :span="16">
<el-form-item label="登记业务名称">
<el-input v-model="form.ywDetail.djywmc" disabled></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="是否启用" prop="enabled">
<el-radio-group v-model="form.ywDetail.enabled">
......@@ -84,14 +57,23 @@
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="16">
<el-col :span="8">
<el-form-item label="业务流程ID" prop="flowid">
<el-input v-model="form.ywDetail.flowid"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="登记原因设置" prop="sfqydjyymb">
<el-radio-group v-model="form.ywDetail.sfqydjyymb">
<el-radio label="1">启用</el-radio>
<el-radio label="0">禁用</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="登记情形及材料">
<el-input v-model="form.ywDetail.djqxcl" placeholder="仅支持execl文件导入"></el-input>
</el-form-item>
......@@ -104,47 +86,52 @@
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="登记原因设置" prop="sfqydjyymb">
<el-radio-group v-model="form.ywDetail.sfqydjyymb">
<el-radio label="1">启用</el-radio>
<el-radio label="0">禁用</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="登记原因模板" prop="djyy">
<el-input type="textarea" :rows="4" placeholder="请输入内容" v-model="form.ywDetail.djyy">
</el-input>
</el-form-item>
</el-col>
</el-row> -->
</el-row>
</el-form>
<el-collapse accordion>
<el-collapse-item title="登记情形设置" name="1">
<lb-table :column="djqxCol" border :pagination="false" heightNumSetting :data="form.djqx">
</lb-table>
</el-collapse-item>
<el-collapse-item title="登记情形设置" name="2">
<div>
控制反馈：通过界面样式和交互动效让用户可以清晰的感知自己的操作；
</div>
<div>页面反馈：操作后，通过页面元素的变化清晰地展现当前状态。</div>
<el-collapse-item title="材料信息设置" name="2">
<lb-table :column="clxxCol" border heightNumSetting :pagination="false" :data="form.clxx">
</lb-table>
</el-collapse-item>
<el-collapse-item title="材料信息设置" name="3">
<div>简化流程：设计简洁直观的操作流程；</div>
<el-collapse-item title="刷选条件设置" name="3">
<div v-if="form.ywDetail.sfsxql != '0'">
<div class="dyztsd-title">
<b>请勾选需要查询的权利信息</b>
<div>
清晰明确：语言表达清晰且表意明确，让用户快速理解进而作出决策；
<el-button type="text" @click="handleSelectall">选择全部 </el-button>
<el-button type="text" @click="handleInvert">清除全部</el-button>
</div>
<div>
帮助用户识别：界面简单直白，让用户快速识别而非回忆，减少用户记忆负担。
</div>
</el-collapse-item>
<el-collapse-item title="刷选条件设置" name="4">
<div>
用户决策：根据场景可给予用户操作建议或安全提示，但不能代替用户进行决策；
<el-divider></el-divider>
<ul class="qlxx-list">
<li v-for="(item, index) in form.sxql" :key="index">
<el-checkbox v-model="item.checked">{{ item.sxzdmc }}</el-checkbox>
</li>
</ul>
</div>
<div>
结果可控：用户可以自由的进行操作，包括撤销、回退和终止当前操作等。
<b>限制办理状态</b>
<ul class="screen-list">
<li v-for="(item, index) in form.sxzt" :key="index">
<div class="screen-list-left">
<el-switch v-model="item.checked" @change="handleSelect(item)">
</el-switch>
{{ item.sxzdmc }}
</div>
<el-radio-group v-model="item.selected" :disabled="!item.checked">
<el-radio :label="obj.sxzdz" v-for="(obj, index) in item.children" :key="index">{{ obj.sxzdmc }}</el-radio>
</el-radio-group>
</li>
</ul>
</el-collapse-item>
</el-collapse>
<div slot="footer" class="dialog-footer">
......@@ -154,6 +141,8 @@
</el-dialog>
</template>
<script>
import { mapGetters } from 'vuex';
import { upward, down } from '@/utils/operation'
import { getDjlxInfo, getSqdjywDetail } from "@/api/system.js";
export default {
//父组件 传 过来的 值
......@@ -171,7 +160,7 @@ export default {
immediate: true,
},
},
components: {},
components: { },
name: "componentDialog",
data() {
return {
......@@ -181,12 +170,224 @@ export default {
title: "",
activeName: "1",
form: {},
djqxCol: [
{
width: '60',
renderHeader: (h, scope) => {
return <i class="el-icon-plus pointer" onClick={() => { this.handleAdd() }} style="color:#409EFF"></i>
},
render: (h, scope) => {
return (
<i class="el-icon-minus pointer" onClick={() => { this.handleMinus(scope.$index, scope.row) }}></i>
)
}
},
{
width: '60',
label: '序号',
type: 'index'
},
{
prop: 'nodecode',
width: '105',
label: '登记情形编码',
render: (h, scope) => {
return (
<div>
<el-input placeholder="登记情形编码" class={{ repeat: scope.row.repeat }} disabled={scope.row.sftsdjqx == '1'}
value={scope.row[scope.column.property]}
onInput={(val) => { scope.row[scope.column.property] = val }} onBlur={() => { this.nodecodeBlur(scope.$index, scope.row) }} maxlength="8">
</el-input>
</div>
)
}
},
{
prop: 'nodename',
label: '登记情形名称',
render: (h, scope) => {
return (
<div>
<el-input placeholder="登记情形名称" disabled={scope.row.sftsdjqx == '1'}
value={scope.row[scope.column.property]}
onInput={(val) => { scope.row[scope.column.property] = val }}></el-input>
</div>
)
}
},
{
label: '是否启用登记情形',
width: '140',
render: (h, scope) => {
return (
<el-radio-group v-model={scope.row.enabled} disabled={scope.row.sftsdjqx == '1'} onChange={(val) => { scope.row[scope.column.property] = val }}>
<el-radio label={'1'}>启用</el-radio>
<el-radio label={'0'}>禁用</el-radio>
</el-radio-group>
)
}
},
{
prop: 'djyy',
label: '登记原因模板',
render: (h, scope) => {
return (
<div>
<el-input placeholder="登记原因模板" disabled={scope.row.sftsdjqx == '1'} value={scope.row[scope.column.property]}
onInput={(val) => { scope.row[scope.column.property] = val }}></el-input>
</div>
)
}
},
{
label: '是否启用模板',
width: '140',
render: (h, scope) => {
return (
<el-radio-group v-model={scope.row.sfqydjyymb} disabled={scope.row.sftsdjqx == '1'} onChange={(val) => { scope.row[scope.column.property] = val }}>
<el-radio label={'1'}>启用</el-radio>
<el-radio label={'0'}>禁用</el-radio>
</el-radio-group>
)
}
},
{
label: '移动',
width: '100',
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.form.djqx.length} onClick={() => { this.moveDown(scope.$index, scope.row) }}>下移</el-button >
</div>
)
}
}
],
clxxCol: [
{
width: '60',
renderHeader: (h, scope) => {
return <i class="el-icon-plus pointer" onClick={() => { this.handleAdd() }} style="color:#409EFF"></i>
},
render: (h, scope) => {
return (
<i class="el-icon-minus pointer" onClick={() => { this.handleMinus(scope.$index, scope.row) }}></i>
)
}
},
{
width: '60',
label: '序号',
type: 'index'
},
{
label: '是否必填',
width: '100',
render: (h, scope) => {
return (
<el-radio-group v-model={scope.row.isrequired} onChange={(val) => { scope.row[scope.column.property] = val }}>
<el-radio label={'1'}>是</el-radio>
<el-radio label={'0'}>否</el-radio>
</el-radio-group>
)
}
},
{
prop: 'clbm',
label: '材料编码',
width: '100',
render: (h, scope) => {
return (
<el-input placeholder="材料编码" value={scope.row[scope.column.property]}
onInput={(val) => { scope.row[scope.column.property] = val }} maxlength="8"></el-input>
)
}
},
{
prop: 'clmc',
label: '材料名称',
render: (h, scope) => {
return (
<el-input placeholder="材料名称" value={scope.row[scope.column.property]}
onInput={(val) => { scope.row[scope.column.property] = val }}></el-input>
)
}
},
{
prop: 'cllx',
label: '材料类型',
width: '115',
render: (h, scope) => {
return (
<el-select value={scope.row[scope.column.property]}
onChange={(val) => { scope.row[scope.column.property] = val }} clearable>
{
this.dictData['A40'].map(option => {
return (
<el-option label={option.dname} value={option.dcode}></el-option>
)
})
}
</el-select>
)
}
},
{
label: '是否公共材料',
width: '100',
render: (h, scope) => {
return (
<el-radio-group v-model={scope.row.sfggcl} onChange={(val) => { scope.row[scope.column.property] = val; this.handleSelectGgcl(scope.row) }}>
<el-radio label={'1'}>是</el-radio>
<el-radio label={'0'}>否</el-radio>
</el-radio-group>
)
}
},
{
prop: 'djqxbm',
label: '登记情形',
width: '180',
render: (h, scope) => {
return (
<el-select disabled={scope.row.sfggcl == '1'} value={scope.row[scope.column.property]}
onChange={(val) => { scope.row[scope.column.property] = val }} clearable>
{
this.form.djqx.map(option => {
return (
<el-option label={option.nodename} value={option.nodecode}></el-option>
)
})
}
</el-select>
)
}
},
{
label: '移动',
width: '90',
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.form.clxx.length} onClick={() => { this.moveDown(scope.$index, scope.row) }}>下移</el-button >
</div>
)
}
}
],
};
},
computed: {
...mapGetters(['dictData'])
},
mounted() {},
methods: {
//页面初始化
init() {
this.tn = 0;
getDjlxInfo(this.sqqlRule.bsmSqyw).then((res) => {
let { result } = res;
this.djlxList = result ? result : [];
......@@ -218,6 +419,12 @@ export default {
</script>
<style lang='scss' scoped>
@import "~@/styles/mixin.scss";
/deep/ .el-dialog {
margin: auto !important;
height: 90%;
width: 80%;
overflow: auto;
}
.form {
background: #eee;
padding: 0 10px;
......