增加费率

src/api/feilvSet.js

@@ -0,0 +1,35 @@
+import request from '@/utils/request'
+
+// 费率列表
+export function getList() {
+	return request({
+		url: '/airManage/fakequery.action',
+		method: 'post'
+	})
+}
+
+// 新增费率
+export function addFeilv(data) {
+	return request({
+		url: '/airManage/fakeinsert.action',
+		method: 'post',
+		data
+	})
+}
+
+// 修改费率
+export function modifyFeilv(data) {
+	return request({
+		url: '/airManage/fakeupdate.action',
+		method: 'post',
+		data
+	})
+}
+
+export function delFeilv(data) {
+	return request({
+		url: '/airManage/fakedel.action',
+		method: 'post',
+		data
+	})
+}

src/router/index.js

@@ -133,6 +133,21 @@ export const constantRoutes = [{
 	},
 	
 	{
+		path: '/feilvSet',
+		component: Layout,
+		redirect: '/feilvSet',
+		children: [{
+			path: 'feilvSet',
+			name: 'feilvSet',
+			component: () => import('@/views/feilvSet/index'),
+			meta: {
+				title: '费率设置',
+				icon: 'feilvSet'
+			}
+		}]
+	},
+	
+	{
 		path: '/systemSet',
 		component: Layout,
 		redirect: '/systemSet',

src/views/feilvSet/index.vue

@@ -0,0 +1,552 @@
+<template>
+	<div class="app-container">
+		<el-row>
+			<el-col :span="24">
+				<div class="cell">
+					<div class="cell-title">
+						<div class="title">费率管理</div>
+						<div class="title-right">
+							<!-- <el-button type="primary" @click="handler_download_excel">导出表单</el-button> -->
+							<el-button type="warning" @click="add_feilv">新增费率</el-button>
+						</div>
+					</div>
+					<div class="cell-body">
+						<el-table :data="tableData" height="610" style="width: 100%" :cell-style="cell_style"
+							v-loading="loading" :header-cell-style="header_cell_style">
+							<!-- <el-table-column label="id" align="center" width="100">
+								<template slot-scope="scope">
+									<span>{{scope.row.id}}</span>
+								</template>
+							</el-table-column> -->
+							<el-table-column label="型号(匹)" align="center" width="180">
+								<template slot-scope="scope">
+									<span>{{ scope.row.air_config }}</span>
+								</template>
+							</el-table-column>
+							<el-table-column label="费率(元)" align="center" width="180">
+								<template slot-scope="scope">
+									<span>{{ scope.row.rate }}</span>
+								</template>
+							</el-table-column>
+							<el-table-column label="操作" align="left">
+								<template slot-scope="scope">
+									<el-button v-if="currentUserLevel == 2" size="mini" class="btn-table"
+										@click="modifyFeilv_dialog(scope.$index, scope.row)">修改</el-button>
+									<el-button size="mini" class="btn-table" type="danger"
+										@click="delete_feilv(scope.$index, scope.row)">
+										删除</el-button>
+								</template>
+							</el-table-column>
+						</el-table>
+					</div>
+				</div>
+			</el-col>
+		</el-row>
+		<!-- 新增费率对话框 -->
+		<el-dialog title="新增费率" custom-class="add-user-dialog" :visible.sync="dialogAddFeilvVisible"
+			:close-on-click-modal="false" :close-on-press-escape="false" @close="dialog_close('addFeilvForm')">
+			<el-form :model="addForm" ref="addFeilvForm" :rules="addFormRules">
+				<el-form-item label="型号：" :label-width="formLabelWidth" :required="true" prop="air_config">
+					<el-input v-model="addForm.air_config" autocomplete="off" maxlength="3" ref="airconfig_focus">
+						<template slot="append">匹</template>
+					</el-input>
+				</el-form-item>
+				<el-form-item label="费率：" :label-width="formLabelWidth" :required="true" prop="rate">
+					<el-input v-model="addForm.rate" autocomplete="off" maxlength="4">
+						<template slot="append">元</template>
+					</el-input>
+				</el-form-item>
+			</el-form>
+			<div slot="footer" class="dialog-footer">
+				<el-button @click="dialogAddFeilvVisible = false">取 消</el-button>
+				<el-button type="primary" @click="handler_add_feilv">新 增</el-button>
+			</div>
+		</el-dialog>
+		<!-- 修改费率对话框 -->
+		<el-dialog title="修改费率" custom-class="modify-feilv-dialog" :visible.sync="dialogModifyFeilvVisible"
+			:close-on-click-modal="false" :close-on-press-escape="false" @close="dialog_close('modifyForm')">
+			<el-form :model="form" ref="modifyForm" :rules="modifyRules">
+				<el-form-item label="型号：" :label-width="formLabelWidth" :required="true" prop="air_config_modify">
+					<el-input v-model="form.air_config_modify" autocomplete="off" maxlength="3" ref="modifyFeilv_focus">
+						<template slot="append">匹</template>
+					</el-input>
+				</el-form-item>
+				<el-form-item label="费率：" :label-width="formLabelWidth" :required="true" prop="rate_modify">
+					<el-input v-model="form.rate_modify" autocomplete="off" maxlength="4">
+						<template slot="append">元</template>
+					</el-input>
+				</el-form-item>
+			</el-form>
+			<div slot="footer" class="dialog-footer">
+				<el-button @click="dialogModifyFeilvVisible = false">取 消</el-button>
+				<el-button type="primary" @click="handler_modify_feilv">确 定</el-button>
+			</div>
+		</el-dialog>
+		<!-- 删除费率对话框 -->
+		<el-dialog custom-class="el-dialog-delete-feilv" :visible.sync="dialog_delete_feilv"
+			:close-on-click-modal="false" :close-on-press-escape="false" :show-close="false">
+			<div slot="" class="del-account-body">
+				<img src="../../icons/serveAC/del_warning.png" alt="">
+				<div class="del-account-body-txt">是否确定将该【{{delForm.air_config}}】从列表中移除？</div>
+			</div>
+			<div slot="footer" class="dialog-footer">
+				<el-button @click="dialog_delete_feilv = false"> 否 </el-button>
+				<el-button type="primary" @click="delete_fielv_dialog"> 是 </el-button>
+			</div>
+		</el-dialog>
+	</div>
+</template>
+
+<script>
+	import {
+		mapGetters
+	} from 'vuex';
+	import {
+		getList,
+		addFeilv,
+		modifyFeilv,
+		delFeilv
+	} from '@/api/feilvSet';
+	export default {
+		data() {
+			var checkAirConfig = (rule, value, callback) => {
+				if (!value) {
+					return callback(new Error('请输入型号，最多3位整数或小数！'));
+				}
+				setTimeout(() => {
+					var reg = /^[1-9]{1}$|^[1-9][\.][0-9]{1}$/
+					if (!reg.test(value)) {
+						callback(new Error('必须正整数或小数，如：1.5 或 5'));
+					} else {
+						callback();
+					}
+				}, 100);
+			}
+			var checkFeilv = (rule, value, callback) => {
+				if (!value) {
+					return callback(new Error('请输入费率，最多4位整数或小数！'));
+				}
+				setTimeout(() => {
+					var reg = /^[1-9]{1,2}$|^[1-9][\.][0-9]{1,2}$/
+					if (!reg.test(value)) {
+						callback(new Error('必须正整数或小数'));
+					} else {
+						callback();
+					}
+				}, 100);
+			}
+			return {
+				// 当前费率的权限
+				currentUserLevel: this.$store.state.user.level,
+				// 弹出对话框数据
+				dialogModifyFeilvVisible: false,
+				form: {
+					id: '',
+					air_config_modify: '',
+					rate_modify: ''
+				},
+				modifyRules: {
+					air_config_modify: [{
+						validator: checkAirConfig
+					}],
+					rate_modify: [{
+						validator: checkFeilv
+					}]
+				},
+				// 添加费率对话框数据
+				dialogAddFeilvVisible: false,
+				addForm: {
+					air_config: '',
+					rate: ''
+				},
+				addFormRules: {
+					air_config: [{
+						validator: checkAirConfig
+					}],
+					rate: [{
+						validator: checkFeilv
+					}]
+				},
+				delForm: {
+					id: '',
+					air_config: '',
+					rate: ''
+				},
+				dialog_delete_feilv: false,
+				tableData: [],
+				formLabelWidth: '120px',
+				// 表格单元格样式
+				cell_style: {
+					color: '#1A202B',
+					'font-size': '16px',
+					'font-family': 'Microsoft YaHei-3970(82674968)'
+				},
+				// 表格头部样式
+				header_cell_style: {
+					background: '#E6ECFE',
+					color: '#1A202B',
+					'font-size': '18px',
+					'font-family': 'Microsoft YaHei-3970(82674968)'
+				},
+				loading: true
+			}
+		},
+		created() {
+			// 获取费率列表数据
+			this.get_list()
+		},
+		methods: {
+			delete_feilv(index, row) {
+				// console.log(index, row);
+				this.delForm.id = row.id
+				this.delForm.air_config = row.air_config
+				this.delForm.rate = row.rate
+				this.dialog_delete_feilv = true
+			},
+			delete_fielv_dialog() {
+				let params = {
+					id: this.delForm.id,
+					// air_config: this.delForm.air_config,
+					// rate: this.delForm.rate
+				}
+				delFeilv(params).then((res) => {
+					// console.log(res);
+					if (typeof res.code == 'undefined' || res.code == '') {
+						this.$message.error('返回数据格式问题，code未获取到！')
+						return
+					}
+				
+					if (res.code == 200) {
+						this.dialog_delete_feilv = false
+						this.$message.success('删除费率成功！')
+						this.get_list('list')
+					} else {
+						this.$message.error(res.message)
+					}
+				}).catch((err) => {
+					// console.log(err);
+					this.$message.error(err.message)
+				})
+			},
+			/**
+			 * 修改费率
+			 */
+			handler_modify_feilv() {
+				this.$refs["modifyForm"].validate(validate => {
+					if (validate) {
+						let params = {
+							id: this.form.id,
+							air_config: this.form.air_config_modify + '匹',
+							rate: this.form.rate_modify
+						}
+						// console.log(params);
+						// 开始发送请求，获取配置数据
+						modifyFeilv(params).then((res) => {
+							// console.log(res);
+							if (typeof res.code == 'undefined' || res.code == '') {
+								this.$message.error('返回数据格式问题，code未获取到！')
+								return
+							}
+
+							if (res.code == 200) {
+								this.dialogModifyFeilvVisible = false
+								this.$message.success('修改费率成功！')
+								this.get_list('list')
+							} else {
+								this.$message.error(res.message)
+							}
+						}).catch((err) => {
+							// console.log(err);
+							this.$message.error(err.message)
+						})
+					} else {
+						this.$message.error('验证不通过')
+						return false
+					}
+				})
+			},
+			/**
+			 * 打开新增费率对话框
+			 */
+			add_feilv() {
+				this.dialogAddFeilvVisible = true
+
+				setTimeout(() => {
+					this.$nextTick(() => {
+						this.$refs.airconfig_focus.focus()
+					})
+				}, 100)
+			},
+			/**
+			 * 新增费率
+			 */
+			handler_add_feilv() {
+				this.$refs["addFeilvForm"].validate(validate => {
+					// console.log(typeof validate);
+					// console.log(validate);
+					if (validate) {
+						let params = {
+							air_config: this.addForm.air_config + '匹',
+							rate: this.addForm.rate
+						}
+						// 开始发送请求，获取配置数据
+						addFeilv(params).then((res) => {
+							// console.log(res);
+							if (typeof res.code == 'undefined' || res.code == '') {
+								this.$message.error('返回数据格式问题，code未获取到！')
+								return
+							}
+
+							if (res.code == 200) {
+								this.dialogAddFeilvVisible = false
+								this.$message.success('新增费率成功！')
+								this.get_list('list')
+							} else {
+								this.$message.error(res.message)
+							}
+						}).catch((err) => {
+							// console.log(err);
+							this.$message.error(err.message)
+						})
+					} else {
+						this.$message.error('验证不通过')
+						return false
+					}
+				})
+			},
+			/**
+			 * 获取费率列表数据
+			 */
+			get_list() {
+				this.loading = true
+				// 开始发送请求，获取配置数据
+				getList().then((res) => {
+					// console.log(res.data);
+					if (res.code == 200) {
+						let resdata = res.data;
+						this.tableData = []
+						for (var i = 0; i < resdata.length; i++) {
+							this.tableData.push(resdata[i])
+						}
+					} else {
+						this.tableData = []
+						this.$message.warning('没有符合条件的数据！')
+					}
+				}).catch((err) => {
+					// console.log(err);
+					this.$message.error(err.message)
+				});
+				// loading结束
+				this.loading = false
+			},
+			/**
+			 * 修改费率对话框初始化
+			 * @param {Object} index
+			 * @param {Object} row
+			 */
+			modifyFeilv_dialog(index, row) {
+				// console.log(index, row);
+				this.dialogModifyFeilvVisible = true
+				this.form.id = row.id
+				this.form.air_config_modify = row.air_config.substr(0, row.air_config.length - 1)
+				this.form.rate_modify = row.rate
+				// 使金额输入框input_amount获得焦点
+				setTimeout(() => {
+					this.$nextTick(() => {
+						this.$refs.modifyFeilv_focus.focus()
+					})
+				}, 100)
+			},
+			/**
+			 * 对话框关闭时清理数据
+			 */
+			dialog_close(param) {
+				if (param == 'addFeilvForm') {
+					this.addForm.air_config = ''
+					this.addForm.rate = ''
+				} else if (param == 'modifyForm') {
+					this.form.id = ''
+					this.form.air_config_modify = ''
+					this.form.rate_modify = ''
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.app-container {
+		background-color: #EFF2F7;
+		padding: 10px;
+
+		.el-row {
+
+			.el-col {
+				padding: 10px;
+
+				.cell {
+					padding: 30px;
+					border-radius: 10px;
+					background-color: #FFFFFF;
+					// box-shadow: 5px 5px 15px #979797;
+					box-shadow: 0px 3px 21px 0px rgba(60, 108, 254, 0.16);
+
+					.cell-title {
+						display: flex;
+						justify-content: space-between;
+						align-items: center;
+						margin-bottom: 30px;
+						padding-bottom: 30px;
+						border-bottom: 1px solid #CCCCCC;
+
+						.title {
+							font-size: 22px;
+							font-family: Microsoft YaHei-3970(82674968);
+							font-weight: bold;
+							color: #1A202B;
+						}
+
+						.title-right {
+							display: flex;
+							justify-content: space-between;
+							align-items: center;
+
+							.el-button {
+								width: 110px;
+								height: 46px;
+								background: #2B4CFE;
+								font-size: 18px;
+								color: #FFFFFF;
+								font-family: Microsoft YaHei-3970(82674968);
+								border-radius: 5px;
+							}
+
+							.el-button--warning {
+								background: #F88A64;
+							}
+						}
+					}
+
+					.cell-body {
+
+						.el-button--warning {
+							background: #F88A64;
+						}
+
+						.btn-table {
+							border-radius: 15px !important;
+							border-color: #5488FE;
+							background: #FFFFFF;
+							color: #5488FE;
+						}
+					}
+				}
+			}
+		}
+
+		::v-deep .el-dialog {
+			margin: 0 !important;
+			width: 400px;
+			height: 500px;
+			background: #FFFFFF;
+			box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.29);
+			border-radius: 10px;
+			position: absolute;
+			top: 50%;
+			left: 50%;
+			transform: translate(-50%, -50%);
+
+			.el-dialog__header {
+				display: flex;
+				align-items: center;
+				width: 100%;
+				height: 58px;
+				padding: 30px;
+				background: #E6EBFE;
+				border-radius: 10px 10px 0px 0px;
+				font-weight: bold;
+			}
+
+			.el-dialog__body {
+				padding-bottom: 0;
+
+				.el-form-item__label,
+				.el-form-item__content {
+					font-size: 16px;
+					font-family: Microsoft YaHei-3970(82674968);
+					color: #53575A;
+				}
+
+				// .el-input__inner {
+					
+				// }
+			}
+			
+			// 删除对话框的样式
+			.del-account-body {
+				display: flex;
+				flex-direction: column;
+				justify-content: center;
+				align-items: center;
+				height: 180px;
+			
+				img {
+					width: 72px;
+				}
+			
+				.del-account-body-txt {
+					height: 58px;
+					line-height: 58px;
+					font-size: 18px;
+					font-family: Microsoft YaHei-3970(82674968);
+					color: #333333;
+				}
+			}
+
+			.el-dialog__footer {
+				padding-bottom: 0 !important;
+				text-align: center;
+
+				.el-button.el-button--default {
+					width: 75px;
+					height: 40px;
+					border: 1px solid #2B4CFE;
+					border-radius: 6px;
+					font-size: 16px;
+					font-family: Microsoft YaHei-3970(82674968);
+					color: #2B4CFE;
+				}
+
+				.el-button.el-button--primary {
+					width: 75px;
+					height: 40px;
+					background: #2B4CFE;
+					border-radius: 6px;
+					font-size: 16px;
+					font-family: Microsoft YaHei-3970(82674968);
+					color: #FFFFFF;
+					margin-left: 60px;
+				}
+			}
+		}
+	}
+</style>
+
+<style>
+	.add-user-dialog {
+		height: 300px !important;
+	}
+
+	.modify-feilv-dialog {
+		height: 300px !important;
+	}
+	
+	.el-dialog-delete-feilv {
+		height: 300px !important;
+		width: 460px !important;
+	}
+	
+	.el-dialog-delete-feilv .el-dialog__header {
+		display: none !important;
+	}
+</style>

src/views/userMgr/index.vue

@@ -476,7 +476,7 @@
 						}
 						// 开始发送请求，获取配置数据
 						addUser(params).then((res) => {
-							console.log(res);
+							// console.log(res);
 							if (typeof res.code == 'undefined' || res.code == '') {
 								this.$message.error('返回数据格式问题，code未获取到！')
 								return