Skip to content

V
vue-gjjs
Commit 3fd5fc77 by fukai
Options

完成office调整

parent f7e52a4e
Showing with 222 additions and 306 deletions
src/App.vue
...@@ -20,4 +20,11 @@ export default { ...@@ -20,4 +20,11 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
.e-table-wrapper{
display: flex;
flex-direction: column;
}
.e-table-wrapper .el-table {
flex:1;
}
</style> </style>
src/index.html
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
height: 100%; height: 100%;
width: 100%; width: 100%;
margin: 0; margin: 0;
overflow: hidden;
} }
</style> </style>
</head> </head>
......
src/main.js
...@@ -11,11 +11,13 @@ import RootRouter from './routers' ...@@ -11,11 +11,13 @@ import RootRouter from './routers'
import store from "./store" import store from "./store"
import CustomComponent from "./components" import CustomComponent from "./components"
import VueFunc from "./utils/vuefunc"
window.SUCCESS="00000" window.SUCCESS="00000"
Vue.use(ElementUI) Vue.use(ElementUI)
Vue.use(CustomComponent) Vue.use(CustomComponent)
Vue.use(VueFunc)
new Vue({ new Vue({
el: '#app', el: '#app',
......
src/service/Api.js
import axios from 'axios' import axios from 'axios'
import { MessageBox } from 'element-ui' import { MessageBox } from 'element-ui'
export const BASE_HOST = "/reactremit/" export const BASE_HOST = "/gjjs/"
export const BASE_URI=BASE_HOST+"service/"; export const BASE_URI=BASE_HOST+"";
const instance = axios.create({ const instance = axios.create({
baseURL: BASE_URI, baseURL: BASE_URI,
...@@ -24,22 +24,22 @@ export default class Api ...@@ -24,22 +24,22 @@ export default class Api
{ {
let token = window.sessionStorage.token let token = window.sessionStorage.token
let userId = window.sessionStorage.userId let userId = window.sessionStorage.userId
let headers = {userId,token}; let headers = {userId,token,"terminal":"WEB"};
if(url!= `${BASE_URI}login` && token) if(url!= `${BASE_URI}login` && token)
headers.token = token; headers.token = token;
return new Promise( (resolve, reject) =>{ return new Promise( (resolve, reject) =>{
axios.post(url,data,{ axios.post(url,data,{
headers, headers,
method, method,
timeout: 5000, timeout: 50000,
}) })
.then(response=>{ .then(response=>{
const {data} = response; const {data} = response;
if(data && data.retcod != SUCCESS) if(data && data.code != SUCCESS)
{ {
console.log("错误码："+data.retcod+" 错误信息："+data.retmsg) console.log("错误码："+data.code+" 错误信息："+data.message)
} }
if(data && data.retcod == 'L0003'){ if(data && data.code == 'L0003'){
window.sessionStorage.removeItem("token") window.sessionStorage.removeItem("token")
window.sessionStorage.removeItem("userId") window.sessionStorage.removeItem("userId")
MessageBox.alert({ MessageBox.alert({
......
src/store/I18NStore.js
const I18N = { const I18N = {
namespaced: true,
state:{ state:{
lang:"cn" lang:"cn"
}, },
......
src/store/UserContext.js
const UserContext={ const UserContext={
namespaced: true,
state:{ state:{
userName:"", userName:"",
userId:"", userId:"",
...@@ -15,6 +16,9 @@ const UserContext={ ...@@ -15,6 +16,9 @@ const UserContext={
state.menu = info.menu state.menu = info.menu
state.state = "LOGIN" state.state = "LOGIN"
state.token = info.token state.token = info.token
window.sessionStorage.userId = info.userId
window.sessionStorage.userName = info.userName
window.sessionStorage.token = info.token
}, },
setLogout(state){ setLogout(state){
state.userName = "" state.userName = ""
......
src/store/index.js
...@@ -7,8 +7,8 @@ Vue.use(Vuex) ...@@ -7,8 +7,8 @@ Vue.use(Vuex)
const store = new Vuex.Store({ const store = new Vuex.Store({
modules: { modules: {
i18n: I18NStore, I18n: I18NStore,
userContext: UserContext UserContext: UserContext
} }
}) })
......
src/utils/vuefunc.js 0 → 100644
export function findCodeLabel(codes,val)
{
if(!codes)
return val;
let item = codes.find(item=>item.value==val)
if(!item)
return val;
return item.label
}
export default {
install(Vue){
Vue.prototype.findCodeLabel = findCodeLabel
}
}
src/views/Business/Office/TodoItem.vue 0 → 100644
<template>
<div class="e-table-wrapper" style="height:100%">
<el-table
:data="todolist"
style="width: 100%"
>
<el-table-column
prop="typ"
label="操作类型"
sortable
>
<template slot-scope="scope">
<span>{{ findCodeLabel(codes.oratyp,scope.row.typ) }}</span>
</template>
</el-table-column>
<el-table-column
prop="inifrm"
label="交易码"
sortable
>
</el-table-column>
<el-table-column
prop="ownref"
label="业务编号"
sortable
>
</el-table-column>
<el-table-column
prop="nam"
label="概要描述"
sortable
>
</el-table-column>
<el-table-column
prop="usr"
label="经办柜员"
sortable
>
</el-table-column>
<el-table-column
prop="cur"
label="币种"
sortable
>
</el-table-column>
<el-table-column
prop="amt"
label="金额"
sortable
width="100">
</el-table-column>
</el-table>
<el-pagination
layout="prev, pager, next"
:total="pager.total">
</el-pagination>
</div>
</template>
<script>
import CodeTable from "~/config/CodeTable"
import Api from "~/service/Api"
export default {
props:['todoType'],
data(){
return {
codes:{
oratyp:CodeTable.oratyp,
},
todolist:[],
pager:{total:0,curIdx:0}
}
},
methods:{
async onOffpTodo(){
let rtnmsg = await Api.post("office/offp_todo",{data:{'offp_todotyp':this.todoType}})
if(rtnmsg.code == SUCCESS)
{
//TODO 处理数据逻辑
this.todolist = rtnmsg.data.offp_todolst
}
else
{
this.$notify.error({title: '错误',message: '服务请求失败！'});
}
}
},
mounted(){
this.onOffpTodo()
}
}
</script>
src/views/Business/Office/index.vue
<template> <template>
<div class="eContainer"> <el-form :model="model" :rules="rules" ref="modelForm" label-width="100px" size="small" style="height:100%;">
<el-form :model="model" :rules="rules" ref="modelForm" label-width="100px" size="small"> <el-container style="height:100%;">
<el-main style="padding:0">
<el-col :span="12">
<el-form-item label="待办类型"> <el-container style="height:100%">
<el-select v-model="model.offp.todotyp" style="width:100%" placeholder="请选择待办类型"> <el-main style="padding:0">
<el-option <el-tabs class="fulltab" v-model="todoActive" type="card" @tab-click="handleClick">
v-for="item in codes.todo"
:key="item.value" <el-tab-pane v-for="item in codes.todo" :key="item.value" :label="item.label" :name="item.value">
:label="item.label" <s-todo :todoType="item.value"/>
:value="item.value"> </el-tab-pane>
</el-option> </el-tabs>
</el-select> </el-main>
</el-form-item> </el-container>
</el-col>
<el-col :span="12"> </el-main>
<el-button size="small" type="primary" @click="onOffpTodo"> <div style="width:8px;background-color:#E8E8E8;"></div>
查询 <el-aside>
</el-button> <div class="rightPanel">
</el-col> <c-page title="牌价">
<el-col :span="12">
<el-form-item label="">
<el-select v-model="model.offp.selten" style="width:100%" placeholder="请选择">
<el-option
v-for="item in codes.selten"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="24">
<div class="e-table-wrapper">
<el-table
:data="model.offp.todolst"
style="width: 100%"
>
<el-table-column
prop="typ"
label="操作类型"
sortable
width="100">
<template slot-scope="scope">
<span>{{ this.codes.oratyp.find(item=>item.value==scope.row.typ).label }}</span>
</template>
</el-table-column>
<el-table-column
prop="inifrm"
label="交易码"
sortable
width="100">
</el-table-column>
<el-table-column
prop="ownref"
label="业务编号"
sortable
width="100">
</el-table-column>
<el-table-column
prop="nam"
label="概要描述"
sortable
width="100">
</el-table-column>
<el-table-column
prop="usr"
label="经办柜员"
sortable
width="100">
</el-table-column>
<el-table-column
prop="cur"
label="币种"
sortable
width="100">
</el-table-column>
<el-table-column
prop="amt"
label="金额"
sortable
width="100">
</el-table-column>
<el-table-column
prop="objtyp"
label=""
sortable
width="100">
</el-table-column>
<el-table-column
prop="objinr"
label=""
sortable
width="100">
</el-table-column>
</el-table>
<el-pagination
layout="prev, pager, next"
:total="pager.offp_todolst.total">
</el-pagination>
</div>
</el-col>
<el-col :span="12">
<el-button size="small" type="primary" @click="onOffpTstcal">
接口测试
</el-button>
</el-col>
<el-col :span="12">
<el-form-item label="用户ID">
<el-input v-model="model.sysmod.usr.nam" maxlength="8" placeholder="请输入用户ID"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="用户名称">
<el-input v-model="model.sysmod.usr.dspnam" maxlength="40" placeholder="请输入用户名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="机构编码">
<el-input v-model="model.sysmod.bch.branch" maxlength="8" placeholder="请输入机构编码"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="中文名称">
<el-input v-model="model.sysmod.bch.namcn" maxlength="40" placeholder="请输入中文名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
<div class="e-table-wrapper"> <div class="e-table-wrapper">
<el-table <el-table
:data="model.offp.xrtlst" :data="model.offp.xrtlst"
...@@ -145,37 +29,36 @@ ...@@ -145,37 +29,36 @@
prop="cur" prop="cur"
label="币种" label="币种"
sortable sortable
width="100"> >
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ this.codes.curtxt.find(item=>item.value==scope.row.cur).label }}</span> <span>{{
findCodeLabel(codes.curtxt,scope.row.cur)
}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="buyrat" prop="buyrat"
label="买入价" label="买入价"
sortable sortable
width="100"> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="midrat" prop="midrat"
label="中间价" label="中间价"
sortable sortable
width="100"> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="selrat" prop="selrat"
label="卖出价" label="卖出价"
sortable sortable
width="100"> >
</el-table-column> </el-table-column>
</el-table> </el-table>
<el-pagination
layout="prev, pager, next"
:total="pager.offp_xrtlst.total">
</el-pagination>
</div> </div>
</el-col> </c-page>
<el-col :span="24"> <div style="height:16px;background-color:#E8E8E8"></div>
<c-page title="利率">
<div class="e-table-wrapper"> <div class="e-table-wrapper">
<el-table <el-table
:data="model.offp.iralst" :data="model.offp.iralst"
...@@ -185,85 +68,54 @@ ...@@ -185,85 +68,54 @@
prop="cur" prop="cur"
label="币种" label="币种"
sortable sortable
width="100"> >
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ this.codes.relflg.find(item=>item.value==scope.row.cur).label }}</span> <span>{{ findCodeLabel(codes.relflg,scope.row.cur)}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="iratyp" prop="iratyp"
label="类型" label="类型"
sortable sortable
width="100"> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="due" prop="due"
label="期限" label="期限"
sortable sortable
width="100"> >
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ this.codes.dbfmethod.find(item=>item.value==scope.row.due).label }}</span> <span>{{ findCodeLabel(codes.dbfmethod,scope.row.due) }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="basrat" prop="basrat"
label="利率" label="利率"
sortable sortable
width="100"> >
</el-table-column> </el-table-column>
</el-table> </el-table>
<el-pagination
layout="prev, pager, next"
:total="pager.offp_iralst.total">
</el-pagination>
</div>
</el-col>
<el-col :span="12">
<el-form-item label="原密码">
<el-input type="password" v-model="model.offp.oldpwd" maxlength="100" placeholder="请输入原密码"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="交易代码">
<el-input v-model="model.trncod" maxlength="6" placeholder="请输入交易代码"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-button size="small" type="primary" @click="onLaunch">
跳转
</el-button>
</el-col>
</div>
</c-page>
</div>
</el-aside>
<el-col :span="12">
<el-form-item label="新密码">
<el-input type="password" v-model="model.offp.newpwd" maxlength="100" placeholder="请输入新密码"></el-input>
</el-form-item>
</el-col>
<el-col :span="12"> </el-container>
<el-form-item label="确认新密码">
<el-input type="password" v-model="model.offp.newpwdcom" maxlength="100" placeholder="请输入确认新密码"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-button size="small" type="primary" @click="onOffpChgpaswod">
密码修改
</el-button>
</el-col>
</el-form> </el-form>
</div>
</template> </template>
<script> <script>
import Api from "~/service/Api" import Api from "~/service/Api"
import CodeTable from "~/config/CodeTable" import CodeTable from "~/config/CodeTable"
import s_todo from "./TodoItem"
export default { export default {
components:{"s-todo":s_todo},
data(){ data(){
return { return {
todoActive:"WAT",
codes:{ codes:{
dsp:CodeTable.dsp, dsp:CodeTable.dsp,
busflg:CodeTable.busflg, busflg:CodeTable.busflg,
...@@ -302,117 +154,32 @@ export default { ...@@ -302,117 +154,32 @@ export default {
}, },
model:{ model:{
offp:{ offp:{
todotyp:"", // 待办类型 .offp.todotyp todotyp:[], // 待办类型 .offp.todotyp
todolst:[], // .offp.todolst todolst:[], // .offp.todolst
selten:"", // .offp.selten selten:"", // .offp.selten
xrtlst:[], // .offp.xrtlst xrtlst:[], // .offp.xrtlst
iralst:[], // .offp.iralst iralst:[], // .offp.iralst
oldpwd:"", // 原密码 .offp.oldpwd
newpwd:"", // 新密码 .offp.newpwd
newpwdcom:"", // 确认新密码 .offp.newpwdcom
},
sysmod:{
usr:{
dspnam:"", // 用户名称 .sysmod.usr.dspnam
nam:"", // 用户ID .sysmod.usr.nam
}, },
bch:{
branch:"", // 机构编码 .sysmod.bch.branch
namcn:"", // 中文名称 .sysmod.bch.namcn
}, },
}, rules:{}
trncod:"", // 交易代码 .trncod
},
pager:{
"offp_todolst":{total:0,curIdx:0},
"offp_xrtlst":{total:0,curIdx:0},
"offp_iralst":{total:0,curIdx:0},
},
rules:{
"sysmod.usr.nam":[{type: "string", required: false, len: 8, message: "输入不合法"}],
"sysmod.usr.dspnam":[{type: "string", required: false, len: 40, message: "输入不合法"}],
"sysmod.bch.branch":[{type: "string", required: false, len: 8, message: "输入不合法"}],
"sysmod.bch.namcn":[{type: "string", required: false, len: 40, message: "输入不合法"}],
"offp.oldpwd":[{type: "string", required: true, len: 100, message: "输入不合法"}],
"trncod":[{type: "string", required: false, len: 6, message: "输入不合法"}],
"offp.newpwd":[{type: "string", required: true, len: 100, message: "输入不合法"}],
"offp.newpwdcom":[{type: "string", required: true, len: 100, message: "输入不合法"}],
}
}
},
methods:{
onOffpTodo(){
this.$refs.modelForm.validate(async valid => {
if(!valid)
return;
let rtnmsg = await Api.post("office/offp_todo",{data:this.model})
if(rtnmsg.retcod == SUCCESS)
{
//TODO 处理数据逻辑
} }
else
{
this.$notify.error({title: '错误',message: '服务请求失败！'});
}
})
}, },
onOffpTstcal(){ methods:{
this.$refs.modelForm.validate(async valid => { handleClick(){}
if(!valid)
return;
let rtnmsg = await Api.post("office/offp_tstcal",{data:this.model})
if(rtnmsg.retcod == SUCCESS)
{
//TODO 处理数据逻辑
}
else
{
this.$notify.error({title: '错误',message: '服务请求失败！'});
}
})
},
onLaunch(){
this.$refs.modelForm.validate(async valid => {
if(!valid)
return;
let rtnmsg = await Api.post("office/launch",{data:this.model})
if(rtnmsg.retcod == SUCCESS)
{
//TODO 处理数据逻辑
}
else
{
this.$notify.error({title: '错误',message: '服务请求失败！'});
}
})
}, },
onOffpChgpaswod(){ mounted:async function(){
this.$refs.modelForm.validate(async valid => {
if(!valid)
return;
let rtnmsg = await Api.post("office/offp_chgpaswod",{data:this.model})
if(rtnmsg.retcod == SUCCESS)
{
//TODO 处理数据逻辑
}
else
{
this.$notify.error({title: '错误',message: '服务请求失败！'});
}
})
},
},
created:async function(){
console.log("进入office交易"); console.log("进入office交易");
let rtnmsg = await Api.post("office/init",{params:{}}) let rtnmsg = await Api.post("office/init",{params:{}})
if(rtnmsg.retcod == SUCCESS) console.log(rtnmsg)
if(rtnmsg.code == SUCCESS)
{ {
//TODO 处理数据逻辑 //TODO 处理数据逻辑
this.model.offp.todolst = rtnmsg.data.offp_todolst || []
this.model.offp.iralst = rtnmsg.data.offp_iralst || []
this.model.offp.xrtlst = rtnmsg.data.offp_xrtlst || []
} }
else else
{ {
...@@ -422,5 +189,23 @@ export default { ...@@ -422,5 +189,23 @@ export default {
} }
</script> </script>
<style> <style>
.rightPanel{
display: flex;
height: 100%;
flex-direction: column;
}
.rightPanel .e-table-wrapper{
height: 100%;
}
.fulltab.el-tabs{
display: flex;
height: 100%;
flex-direction: column;
}
.fulltab.el-tabs .el-tabs__content{
flex:1;
}
.fulltab.el-tabs .el-tabs__content .el-tab-pane{
height: 100%;
}
</style> </style>
\ No newline at end of file
src/views/Layout/Header.vue
<template> <template>
<div class="self-header"> <div class="self-header">
<h2 class="self_header_label">新一代邮储银行国际结算系统</h2> <h2 class="self_header_label">新一代银行国际结算系统</h2>
</div> </div>
</template> </template>
......
src/views/Login/index.vue
<template> <template>
<div class="loginContainer"> <div class="loginContainer">
<div id="loginForamWrapper"> <div id="loginForamWrapper">
<h2>欢迎邮储银行国际结算系统</h2> <h2>欢迎银行国际结算系统</h2>
<div id="loginForm"> <div id="loginForm">
<p style="text-align:left;font-size:1.2em;color:#888">用户登录 / LOGIN IN</p> <p style="text-align:left;font-size:1.2em;color:#888">用户登录 / LOGIN IN</p>
<el-form :model="loginForm" status-icon :rules="rules" ref="loginForm" size="small" > <el-form :model="loginForm" status-icon :rules="rules" ref="loginForm" size="small" >
...@@ -23,6 +23,11 @@ ...@@ -23,6 +23,11 @@
</template> </template>
<script> <script>
import { createNamespacedHelpers } from 'vuex'
const { mapState, mapMutations,mapActions } = createNamespacedHelpers('UserContext')
export default { export default {
data() { data() {
return { return {
...@@ -44,6 +49,7 @@ ...@@ -44,6 +49,7 @@
submitForm(formName) { submitForm(formName) {
this.$refs[formName].validate((valid) => { this.$refs[formName].validate((valid) => {
if (valid) { if (valid) {
this.setLoginInfo({userId:this.loginForm.username})
this.$router.push("/business/office"); this.$router.push("/business/office");
} else { } else {
console.log('error submit!!'); console.log('error submit!!');
...@@ -53,7 +59,8 @@ ...@@ -53,7 +59,8 @@
}, },
resetForm(formName) { resetForm(formName) {
this.$refs[formName].resetFields(); this.$refs[formName].resetFields();
} },
...mapMutations(["setLoginInfo"])
} }
} }
</script> </script>
......
webpack.config.js
...@@ -58,11 +58,11 @@ module.exports = (options = {}) => ({ ...@@ -58,11 +58,11 @@ module.exports = (options = {}) => ({
host: '127.0.0.1', host: '127.0.0.1',
port: 8010, port: 8010,
proxy: { proxy: {
'/api/': { '/gjjs/': {
target: 'http://127.0.0.1:8080', target: 'http://127.0.0.1:8070',
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
'^/api': '' '^/gjjs': '/gjjs'
} }
} }
}, },
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment