luoJunYong.123
3 years ago
parent
e725ccbd18
commit
2da8aa4240
9 changed files with 101 additions and 480 deletions
@ -1,32 +0,0 @@ |
|||||||
export const saveData = { |
|
||||||
|
|
||||||
// 通过混入的方式可以保存数据 由于混入函数的created是先于引入混入的组件的created执行的，所以可以先拿到上次推出时的数据直接先一步渲染。
|
|
||||||
// 其实这个函数我写再tipsBefore里了 不过有些页面是不需要依赖前一个页面的，所以区分开了。
|
|
||||||
|
|
||||||
created() { |
|
||||||
if(sessionStorage.getItem(this.moduleName)) { |
|
||||||
const getBeforeData = JSON.parse(sessionStorage.getItem(this.moduleName)) |
|
||||||
for(const key in getBeforeData) { |
|
||||||
this.form[key] = Number(getBeforeData[key])? Number(getBeforeData[key]): getBeforeData[key] |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
// 清空这个组件所保存的数据
|
|
||||||
clearSaveData() { |
|
||||||
sessionStorage.removeItem(this.moduleName) |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
|
|
||||||
// 销毁组件之前将该组件中的数据保存起来
|
|
||||||
beforeDestroy() { |
|
||||||
let tmpForm = {} |
|
||||||
for(const key in this.form) { |
|
||||||
if(this.form[key] !== '') { |
|
||||||
tmpForm[key] = this.form[key] |
|
||||||
} |
|
||||||
} |
|
||||||
sessionStorage.setItem(this.moduleName, JSON.stringify(tmpForm)) |
|
||||||
} |
|
||||||
} |
|
||||||
@ -1,176 +1,74 @@ |
|||||||
const nameMap = { |
data() { |
||||||
sex: { |
var validateEveryData = (rule, value, callback) => { |
||||||
1: '男', |
// console.log("callback", callback);
|
||||||
2: '女' |
// console.log("校验某一项的规则对象", rule);
|
||||||
}, |
// console.log("用户输入的值", value);
|
||||||
idType: { |
|
||||||
82: '统一社会信用代码证', |
|
||||||
83: '身份证' |
|
||||||
}, |
|
||||||
certificateType: { |
|
||||||
83: '身份证', |
|
||||||
115: '转账支票', |
|
||||||
116: '现金支票' |
|
||||||
}, |
|
||||||
currency: { |
|
||||||
12: 'CNY人民币' |
|
||||||
}, |
|
||||||
goldLogo: { |
|
||||||
13: '钞户' |
|
||||||
}, |
|
||||||
accountQuality: { |
|
||||||
14: '个人结算户', |
|
||||||
101: '基本户', |
|
||||||
102: '一般户', |
|
||||||
103: '专用户', |
|
||||||
104: '临时户' |
|
||||||
}, |
|
||||||
accountQualitysTwo: { |
|
||||||
14: '个人结算户', |
|
||||||
101: '基本户', |
|
||||||
102: '一般户', |
|
||||||
103: '专用户', |
|
||||||
104: '临时户' |
|
||||||
}, |
|
||||||
accountQualitysThree: { |
|
||||||
14: '个人结算户', |
|
||||||
101: '基本户', |
|
||||||
102: '一般户', |
|
||||||
103: '专用户', |
|
||||||
104: '临时户' |
|
||||||
}, |
|
||||||
voucherType: { |
|
||||||
15: 'IC卡', |
|
||||||
115: '转账支票', |
|
||||||
116: '现金支票', |
|
||||||
123: '存单', |
|
||||||
127: '银行' |
|
||||||
}, |
|
||||||
accountType: { |
|
||||||
16: '一类户', |
|
||||||
17: '二类户', |
|
||||||
97: '结算户', |
|
||||||
98: '结算户', |
|
||||||
99: '委托保障金户', |
|
||||||
100: '资本临时户' |
|
||||||
}, |
|
||||||
drawWay: { |
|
||||||
18: '密码', |
|
||||||
93: '现金', |
|
||||||
94: '转账', |
|
||||||
114: '印鉴', |
|
||||||
125: '部分支取', |
|
||||||
126: '全部支取并销户' |
|
||||||
}, |
|
||||||
drawWayType: { |
|
||||||
133: '现金' |
|
||||||
}, |
|
||||||
accountQualitysTwo: { |
|
||||||
14: '个人结算户', |
|
||||||
101: '基本户', |
|
||||||
102: '一般户', |
|
||||||
103: '专用户', |
|
||||||
104: '临时户' |
|
||||||
}, |
|
||||||
voucherTypesTwo: { |
|
||||||
15: 'IC卡', |
|
||||||
115: '转账支票', |
|
||||||
116: '现金支票', |
|
||||||
123: '存单', |
|
||||||
127: '银行' |
|
||||||
}, |
|
||||||
voucherTypesThree: { |
|
||||||
15: 'IC卡', |
|
||||||
115: '转账支票', |
|
||||||
116: '现金支票', |
|
||||||
123: '存单', |
|
||||||
127: '银行' |
|
||||||
}, |
|
||||||
accountTypesTwo: { |
|
||||||
16: '一类户', |
|
||||||
17: '二类户', |
|
||||||
97: '结算户', |
|
||||||
98: '结算户', |
|
||||||
99: '委托保障金户', |
|
||||||
100: '资本临时户' |
|
||||||
}, |
|
||||||
accountTypesThree: { |
|
||||||
16: '一类户', |
|
||||||
17: '二类户', |
|
||||||
97: '结算户', |
|
||||||
98: '结算户', |
|
||||||
99: '委托保障金户', |
|
||||||
100: '资本临时户' |
|
||||||
}, |
|
||||||
|
|
||||||
drawWaysTwo: { |
// 对输入框类型的校验
|
||||||
18: '密码', |
if (value) { |
||||||
93: '现金', |
if ((value + "").length > 0) { |
||||||
94: '转账', |
// 用于回显时候的校验，因为输入的时候是字符串类型的数字，但是回显的时候可能就是数字
|
||||||
114: '印鉴', |
callback(); // cb函数告知校验结果，必须要加
|
||||||
125: '部分支取', |
return; |
||||||
126: '全部支取并销户' |
} |
||||||
}, |
} |
||||||
drawWaysThree: { |
|
||||||
18: '密码', |
// 对下拉框类型的校验
|
||||||
93: '现金', |
if ( |
||||||
94: '转账', |
(rule.itemType == "selectOne") | |
||||||
114: '印鉴', |
(rule.itemType == "selectTwo") | |
||||||
125: '部分支取', |
(rule.itemType == "selectThree") |
||||||
126: '全部支取并销户' |
) { |
||||||
}, |
if (value) { |
||||||
chargeWay: { |
if ((value + "").length > 0) { |
||||||
13: '密码', |
// 注意枚举值是数字类型的，所以这里要转换成为字符串类型的
|
||||||
}, |
callback(); |
||||||
chargeWay: { |
return; |
||||||
13: '密码', |
} |
||||||
135: '现金', |
} |
||||||
}, |
} |
||||||
certificateDeposit: { |
|
||||||
92: '现金' |
// 根据不同的类型给予不同的校验提示
|
||||||
}, |
switch (rule.itemType) { |
||||||
extendPeriod: { |
case "text": |
||||||
90: '不续存', |
callback(new Error(rule.labelName + "不能为空")); // 文本类型的规则简单，就是得填写
|
||||||
91: '续存' |
break; |
||||||
}, |
case "number": |
||||||
depositTerm: { |
callback(new Error(rule.labelName + "请按规则填写")); // 数字类型的规则比较繁多
|
||||||
84: '3个月', |
break; |
||||||
85: '6个月', |
case "textarea": |
||||||
86: '1年', |
callback(new Error(rule.labelName + "不能为空")); // 文本域类型的规则也简单，就是得填写
|
||||||
87: '2年', |
break; |
||||||
88: '3年', |
case "selectOne": |
||||||
89: '5年' |
callback(new Error("请选择" + rule.labelName)); // 下拉框类型一 得填写
|
||||||
}, |
break; |
||||||
withdrawWay: { |
case "selectTwo": |
||||||
125: '部分支取', |
callback(new Error("请选择" + rule.labelName)); // 下拉框类型二 得填写
|
||||||
126: '全部支取并销户' |
break; |
||||||
}, |
case "selectThree": |
||||||
extendDepositTarget: { |
callback(new Error("请选择" + rule.labelName)); // 下拉框类型三 多选数组得填写
|
||||||
128: '不续存', |
break; |
||||||
129: '续存1年', |
case "dateRange": |
||||||
130: '续存3年', |
callback(new Error("请选择" + rule.labelName + "范围")); // 下拉框类型三 多选数组得填写
|
||||||
131: '续存5年' |
break; |
||||||
}, |
|
||||||
noticeType: { |
default: |
||||||
95: '1天', |
break; |
||||||
96: '7天' |
} |
||||||
}, |
}; |
||||||
depositType: { |
return { |
||||||
92: '现金' |
// 此对象用于存储各个下拉框的数组数据值，其实也可以挂在vue的原型上，不过个人认为写在data中好些
|
||||||
}, |
selectTwoOptionsObj: {}, |
||||||
accountManagement: { |
// 用于下拉框加载时的效果
|
||||||
105: '工业存款', |
loadingSelect: false, |
||||||
106: '商业存款', |
// 绑定的数据
|
||||||
107: '外贸存款', |
form: {}, |
||||||
108: '其他存款' |
// 校验规则
|
||||||
}, |
validateEveryData: validateEveryData, |
||||||
calculateWay: { |
}; |
||||||
109: '季度', |
|
||||||
110: '半年', |
|
||||||
111: '1年' |
|
||||||
}, |
|
||||||
outAccountWay: { |
|
||||||
112: '按月', |
|
||||||
113: '满页' |
|
||||||
}, |
}, |
||||||
} |
|
||||||
|
作者：水冗水孚 |
||||||
|
链接：https://juejin.cn/post/7060322827148197895
|
||||||
|
来源：稀土掘金 |
||||||
|
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。 |
||||||
Loading…
Reference in new issue