111

田浩浩
Showing 1 changed file with 270 additions and 63 deletions
src/views/system/sqywgz/sqywDetail.vue
--- a/src/views/system/sqywgz/sqywDetail.vue
View file @7c396b4
+++ b/src/views/system/sqywgz/sqywDetail.vue
View file @7c396b4
@@ -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-col>
-          </el-row>
-          <!-- <el-row>
             <el-col :span="8">
-              <el-form-item label="登记类型编码">
+              <el-form-item label="登记业务编码">
-                <el-input v-model="form.ywDetail.djlxbm" disabled></el-input>
+                <el-input v-model="form.ywDetail.djywbm" disabled></el-input>
              </el-form-item>
            </el-col>
              <el-col :span="8">
-              <el-form-item label="登记类型名称">
+              <el-form-item label="登记业务名称">
-                <el-input v-model="form.ywDetail.djlxmc" disabled></el-input>
+                <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">
+      <el-collapse-item title="材料信息设置" name="2">
-        <div>
+        <lb-table :column="clxxCol" border heightNumSetting :pagination="false" :data="form.clxx">
-          控制反馈：通过界面样式和交互动效让用户可以清晰的感知自己的操作；
+    </lb-table>
-        </div>
-        <div>页面反馈：操作后，通过页面元素的变化清晰地展现当前状态。</div>
      </el-collapse-item>
-      <el-collapse-item title="材料信息设置" name="3">
+      <el-collapse-item title="刷选条件设置" name="3">
-        <div>简化流程：设计简洁直观的操作流程；</div>
+        <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-divider></el-divider>
-      <el-collapse-item title="刷选条件设置" name="4">
+      <ul class="qlxx-list">
-        <div>
+        <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;