csnsel 交易原型页面开发

src/config/CodeTable/index.js

@@ -10111,6 +10111,11 @@ const CodeTable = {
       {label:"NCK",value:"N" },
       {label:"已丢弃",value:"G" },
     ],
+    csntyp:[
+      {label:"撤销",value:"2" },
+      {label:"新增",value:"1" },
+      {label:"变更",value:"3" },
+    ],
 
 };
 export default CodeTable;

src/page/Frontend/Csnsel/event/index.js

+import Api from "~/service/Api";
+import moment from "moment";
+
+export default {
+  methods: {
+    async handleSearch() {
+    },
+    async handleReset() {
+
+    },
+    // pageSize改变
+    handleSizeChange(val) {
+      this.pagination.pageNum = 1;
+      this.pagination.pageSize = val;
+      this.handleSearch();
+    },
+    // 页码改变
+    handleCurrentChange(val) {
+      this.pagination.pageNum = val;
+      this.handleSearch();
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    }
+  },
+};

src/page/Frontend/Csnsel/model/check.js

+export default {
+  "csnp.begdat": [
+    { type: "date", required: false, message: "输入正确的日期" }
+  ],
+  "csnp.enddat": [
+    { type: "date", required: false, message: "输入正确的日期" }
+  ],
+  "csnp.bnkbic": [
+    { type: "string", required: false, message: "必输项" },
+    { max: 0, message: "长度不能超过0" }
+  ],
+  "csngrp.csn.subtyp": [
+    { type: "string", required: false, message: "必输项" },
+    { max: 0, message: "长度不能超过0" }
+  ],
+  "csnp.typ": [
+    { type: "string", required: false, message: "必输项" },
+    { max: 0, message: "长度不能超过0" }
+  ],
+
+  "csnp.chgbic": [
+    { type: "string", required: false, message: "必输项" },
+    { max: 0, message: "长度不能超过0" }
+  ],
+}
\ No newline at end of file

src/page/Frontend/Csnsel/model/index.js

+export default class Csnsel {
+  constructor() {
+    this.data = {
+      csnp: {
+        bnkbic: "",			//  发报行：		.csnp.bnkbic
+        begdat: "",			//  起始时间：		.csnp.begdat
+        enddat: "",			//  截止时间：		.csnp.enddat
+        chgbic: "",			//  变更参与机构行号		.csnp.chgbic
+        chgtxt: "",			//  变更机构文本		.csnp.chgtxt
+        typ: "",			//  业务类型：		.csnp.typ
+        chgtp: "",			//  变更类型：		.csnp.chgtp
+        dypanel: "",			//  动态面板		.csnp.dypanel
+      },
+      csngrp: {
+        csn: {
+          csntyp: "",			//  变更类型：		.csngrp.csn.csntyp
+          subtyp: "",			//  报文类型：		.csngrp.csn.subtyp
+        },
+      },
+      mtabut: {
+        exp: "",			//  导出		.mtabut.exp
+      },
+    }
+  }
+}

src/page/Frontend/Csnsel/views/Mainpl.vue

+<template>
+  <div class="eibs-tab">
+    <c-list-search @form-reset="handleReset" @form-search="formSubmit">
+      <!-- 持续展示区 -->
+      <template v-slot="searchSlot">
+        <el-row>
+          <c-col :span="8">
+            <el-form-item label="发报行" prop="csnp.bnkbic">
+              <c-input v-model="model.csnp.bnkbic" maxlength="20"></c-input>
+            </el-form-item>
+          </c-col>
+          <c-col :span="8">
+            <el-form-item label="变更类型" prop="csngrp.csn.csntyp">
+              <c-select v-model="model.csngrp.csn.csntyp" style="width:100%">
+                <el-option v-for="item in codes.csntyp" :key="item.value" :label="item.label" :value="item.value">
+                </el-option>
+              </c-select>
+            </el-form-item>
+          </c-col>
+          <c-col :span="8">
+            <el-form-item label="起始时间" prop="csnp.begdat" style="width: 100%">
+              <c-col :span="11">
+                <c-date-picker type="date" v-model="model.csnp.begdat" style="width:100%"></c-date-picker>
+              </c-col>
+              <c-col :span="2" style="text-align: center">
+                <label style="display: inline-block; width: 100%">-</label>
+              </c-col>
+              <c-col :span="11">
+                <c-date-picker type="date" v-model="model.csnp.enddat" style="width:100%"></c-date-picker>
+              </c-col>
+            </el-form-item>
+          </c-col>
+        </el-row>
+
+        <!-- 可控展示区 -->
+        <el-row v-show="searchSlot.searchToggle">
+          <c-col :span="24">
+            <c-col :span="8">
+              <el-form-item label="报文类型" prop="csngrp.csn.subtyp">
+                <c-input v-model="model.csngrp.csn.subtyp" maxlength="8"></c-input>
+              </el-form-item>
+            </c-col>
+            <c-col :span="8">
+              <el-form-item label="业务类型" prop="csnp.typ">
+                <c-input v-model="model.csnp.typ" maxlength="20"></c-input>
+              </el-form-item>
+            </c-col>
+            <c-col :span="8">
+              <el-form-item label="变更参与机构行号" prop="csnp.chgbic">
+                <c-input v-model="model.csnp.chgbic" maxlength="60"></c-input>
+              </el-form-item>
+            </c-col>
+          </c-col>
+        </el-row>
+      </template>
+    </c-list-search>
+    <el-col :span="24" style="margin-top: 10px">
+      <c-col :span="24">
+        <el-table id='infgidBSTableRef' v-loading="load" :data="tableData" style="width:100%" size="small"
+          :border="true" height="calc(100vh - 250px)" :highlight-current-row="true">
+          <el-table-column prop="gendat" label="创建时间" width="150">
+          </el-table-column>
+          <el-table-column prop="bnkbic" label="发起节点" width="150">
+          </el-table-column>
+          <el-table-column prop="csntyp" label="最新操作" width="150">
+          </el-table-column>
+          <el-table-column prop="cn" label="证书CN域" width="150">
+          </el-table-column>
+          <el-table-column prop="sn" label="证书SN域" width="110">
+          </el-table-column>
+          <el-table-column prop="subtyp" label="报文类型" width="150">
+          </el-table-column>
+          <el-table-column prop="sta" label="处理状态" width="150">
+            <template slot-scope="scope">
+              <template slot-scope="scope">
+                <c-select-value-to-label v-model="scope.row.sta" :code="codes.stacod"></c-select-value-to-label>
+              </template>
+            </template>
+          </el-table-column>
+          <el-table-column prop="rem" label="备注" width="150">
+          </el-table-column>
+          <el-table-column prop="bnknam" label="行名" width="150">
+          </el-table-column>
+          <el-table-column prop=" lstdat" label="数字证书到期日" width="150">
+          </el-table-column>
+        </el-table>
+      </c-col>
+    </el-col>
+  </div>
+</template>
+<script>
+export default {
+  inject: ["root"],
+  props: ["model", "codes"],
+  mixins: [],
+  components: {
+  },
+  data() {
+    return {
+      load: false,
+      tableData: []
+    };
+  },
+  watch: {
+
+  },
+  computed: {},
+
+  mounted() {
+
+  },
+  methods: {
+    handleReset() {
+
+    },
+    formSubmit() {
+
+    },
+  }
+};
+</script>
+<style scoped lang="less">
+.eibs-tabs /deep/ {
+  .m-table-search {
+    padding: 20px 0px 10px 0px;
+  }
+}
+
+.header-wrap {
+  height: 36px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  .title {
+    font-size: 16px;
+    color: #000;
+  }
+
+  .close-btn {
+    padding: 3px;
+    cursor: pointer;
+  }
+}
+
+.m-list-btns {
+  height: 300px;
+  overflow: auto;
+}
+
+.medium_bcs {
+  border-radius: 5px;
+}
+</style>
\ No newline at end of file

src/page/Frontend/Csnsel/views/index.vue

+<template>
+  <div class="eContainer-search">
+    <el-form :model="model" :rules="rules" ref="modelForm" label-width="150px" label-position="right" size="small"
+      :validate-on-rule-change="false">
+      <c-content>
+        <m-mainpl :model="model" :codes="codes" />
+      </c-content>
+    </el-form>
+  </div>
+</template>
+<script>
+import Api from "~/service/Api"
+import CodeTable from "~/config/CodeTable"
+import Bsnsel from "../model"
+import Mainpl from "./Mainpl"
+
+export default {
+  name: "Bsnsel",
+  components: {
+    "m-mainpl": Mainpl,
+  },
+  provide() {
+    return {
+      root: this
+    }
+  },
+  mixins: [],
+  data() {
+    return {
+      tabVal: "",
+      trnName: "bsnsel",
+      trnType: "",
+      model: new Bsnsel().data,
+      rules: null,
+      codes: {
+        rspsta: CodeTable.rspsta,
+        chncod: CodeTable.chncod,
+        stacod: CodeTable.stacod,
+        msgmst: CodeTable.msgmst,
+        dtlchg: CodeTable.dtlchg,
+      },
+    }
+  },
+  methods: {
+    
+  },
+  created: async function () {
+    
+  }
+}
+</script>
+<style></style>

src/page/Frontend/FTRouter.js

@@ -18,6 +18,7 @@ const BusRouter = [
   { path: 'dotopn', component: () => import("./Dotopn/views"), name: 'Dotopn', meta: { title: '待对账信息录入' }, module: 'frontend' },
   { path: 'fxdsdb', component: () => import("./Fxdsdb/views"), name: 'Fxdsdb', meta: { title: '人民币跨境基础数据查询' }, module: 'frontend' },
   { path: 'bsnsel', component: () => import("./Bsnsel/views"), name: 'Bsnsel', meta: { title: 'CIPS业务状态查询' }, module: 'frontend' },
+  { path: 'csnsel', component: () => import("./Csnsel/views"), name: 'Csnsel', meta: { title: '数字证书处理' }, module: 'frontend' },
   { path: 'jfdsel', component: () => import("./Jfdsel/views"), name: 'Jfdsel', meta: { title: '计费单查询' }, module: 'frontend' },
   { path: 'kpachk', component: () => import("./Kpachk/views"), name: 'Kpachk', meta: { title: '未成功记账记录查询' }, module: 'frontend' },
   { path: 'lmnsel', component: () => import("./Lmnsel/views"), name: 'Lmnsel', meta: { title: '流动性管理' }, module: 'frontend' },

src/utils/index.js

@@ -411,8 +411,21 @@ export default class Utils {
     }
     return arr
   }
+  static formatTableList(list) {
+    list.forEach((firstItem) => {
+      let dataKeys = Object.keys(firstItem)
+      dataKeys.map((key) => {
+        if (typeof firstItem[key] == "object") {
+          let secondDataKeys = Object.keys(firstItem[key])
+          secondDataKeys.map((secondKey) => {
+            firstItem[key + '_' + secondKey] = firstItem[key][secondKey]
+          })
+        }
+      })
+    })
+    return list;
+  }
 }
-
 export const SWIFTZ_CHARS = " *\r!\"#%&'()+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ_abcdefghijklmnopqrstuvwxyz{";
 
 export function convertLockMsg(rtnmsg,premsg){