| | |
| | | <template> |
| | | <basic-container > |
| | | <avue-crud v-model="form" :option="option" :data="data" ref="crud" @on-load="onLoad" @row-save="rowSave" @row-update="rowUpdate" @row-del="rowDel" :page.sync="page"> |
| | | <basic-container> |
| | | <avue-crud ref="crud" v-model="form" :data="data" :option="option" :page.sync="page" @on-load="onLoad" |
| | | @row-save="rowSave" @row-update="rowUpdate" @row-del="rowDel"> |
| | | <template slot="menu" slot-scope="{ row, index }"> |
| | | <el-button |
| | | type="text" |
| | | size="small" |
| | | icon="el-icon-edit" |
| | | v-if="permissionList.editBtn" |
| | | icon="el-icon-edit" |
| | | size="small" |
| | | type="text" |
| | | @click="handleEdit(row, index)" |
| | | > |
| | | 编辑 |
| | | </el-button> |
| | | <el-button |
| | | type="text" |
| | | size="small" |
| | | icon="el-icon-delete" |
| | | v-if="permissionList.delBtn" |
| | | icon="el-icon-delete" |
| | | size="small" |
| | | type="text" |
| | | @click="handleDel(row, index)" |
| | | > |
| | | 删除 |
| | |
| | | getadd, |
| | | getupdata, |
| | | getremove, |
| | | combination |
| | | } from "@/api/system/passwords"; |
| | | import {mapGetters} from "vuex"; |
| | | |
| | | export default { |
| | | name: "passwords.vue", |
| | | data() { |
| | | return { |
| | | //最小长度绑定value |
| | | values:"", |
| | | values: "", |
| | | //最大长度绑定value |
| | | values1:"", |
| | | form:{}, |
| | | values1: "", |
| | | form: {}, |
| | | page: { |
| | | pageSize: 10, |
| | | currentPage: 1, |
| | |
| | | data: [], |
| | | |
| | | //添加存放多选的变量,用于下拉菜单的禁用效果和必填种类是否大于组合方式然后提示用户重新选择 |
| | | checkboxlength:"", |
| | | checkboxlength: "", |
| | | //这个是下拉菜单的数据变量 |
| | | selectlength:"", |
| | | selectlength: "", |
| | | //这个是用于防止change时间冒泡,出现两次弹窗定义的变量 |
| | | checkboxlist:"", |
| | | checkboxlist: "", |
| | | //用于首次点击编辑,判断组合方式是否小于必填种类的变量 |
| | | checkboxNumber:"", |
| | | selectNumber:"", |
| | | checkboxNumber: "", |
| | | selectNumber: "", |
| | | //这个也是存放多选的变量,效果一样,只是用作在编辑模块 |
| | | checkboxedit:"", |
| | | checkboxedit: "", |
| | | // 用于判断是否是编辑 |
| | | editFlag:false |
| | | editFlag: false |
| | | } |
| | | |
| | | }, |
| | | computed:{ |
| | | computed: { |
| | | ...mapGetters(["permission"]), |
| | | permissionList() { |
| | | return { |
| | |
| | | editBtn: this.vaildData(this.permission.password.password_edit, false), |
| | | }; |
| | | }, |
| | | option(){ |
| | | return{ |
| | | headerAlign: 'center', |
| | | align: 'center', |
| | | columnBtn:false, |
| | | border: true, |
| | | index: true, |
| | | rowKey:'id', |
| | | addBtn:this.permissionList.addBtn, |
| | | editBtn:false, |
| | | height:700, |
| | | delBtn:false, |
| | | refreshBtn:false, |
| | | column: [ |
| | | { |
| | | label: '策略名称', |
| | | prop: 'strategyName', |
| | | align: 'left', |
| | | span:24, |
| | | labelWidth: "11%", |
| | | rules: [{ |
| | | required: true, |
| | | message: "请输入策略名称", |
| | | trigger: "blur" |
| | | }] |
| | | }, |
| | | { |
| | | label: '密码最小长度', |
| | | prop: 'minPwdLen', |
| | | span:12, |
| | | labelWidth:"22%", |
| | | rules: [{ |
| | | required: true, |
| | | validator:(rule, value,callback)=>{ |
| | | this.values=value*1 |
| | | if(value == ""){ |
| | | callback(new Error('请输入密码最小长度')); |
| | | }else if(/[^\d]/g.test(value)){ |
| | | callback(new Error('密码最小长度的输入类型只能为数字类型')); |
| | | }else if(this.values >= this.values1 && this.values1 != 0){ |
| | | callback(new Error('密码最小长度不能大于密码最大长度')) |
| | | }else { |
| | | callback(); |
| | | } |
| | | }, |
| | | trigger: 'blur' |
| | | }] |
| | | }, |
| | | { |
| | | label: '密码最大长度', |
| | | prop: 'maxPwdLen', |
| | | span:12, |
| | | labelWidth:"25%", |
| | | rules: [{ |
| | | required: true, |
| | | validator:(rule, value,callback) =>{ |
| | | this.values1=value*1 |
| | | if(value == ""){ |
| | | callback(new Error('请输入密码最大长度')); |
| | | }else if(this.values1 <= this.values){ |
| | | callback(new Error('密码最大长度不能小于密码最大长度')); |
| | | }else if(/[^\d]/g.test(value)){ |
| | | callback(new Error('密码最大长度的输入类型只能为数字类型')); |
| | | }else { |
| | | callback(); |
| | | } |
| | | }, |
| | | trigger: 'change' |
| | | }] |
| | | }, |
| | | { |
| | | label: '组合方法', |
| | | prop: 'combinationNames', |
| | | labelWidth: 91, |
| | | display:false, |
| | | |
| | | }, |
| | | { |
| | | label: '组合方法', |
| | | prop: 'combinationIds', |
| | | type: "checkbox", |
| | | span:12, |
| | | labelWidth:"22%", |
| | | id:5, |
| | | hide:true, |
| | | change: this.handleCheckboxChange, |
| | | rules: [{ |
| | | required: true, |
| | | message: "请选择组合方法", |
| | | trigger: "blur" |
| | | }], |
| | | dicUrl: '/api/ubcs-system/combination/select', |
| | | dicMethod: 'get', |
| | | props: { |
| | | value: "ID", |
| | | label: "NAME", |
| | | }, |
| | | }, |
| | | { |
| | | label: '必填种类', |
| | | prop: 'requiredType', |
| | | type: 'select', |
| | | span:12, |
| | | labelWidth:"25%", |
| | | change:this.handleSelectChange, |
| | | rules: [{ |
| | | required: true, |
| | | message: "请选择必填种类", |
| | | trigger: "blur" |
| | | }], |
| | | dicData:[{ |
| | | label:'1种', |
| | | value:1, |
| | | disabled:false |
| | | }, |
| | | { |
| | | label:'2种', |
| | | value:2, |
| | | disabled:false |
| | | }, |
| | | { |
| | | label:'3种', |
| | | value:3, |
| | | disabled:false |
| | | }, |
| | | { |
| | | label:'4种', |
| | | value:4, |
| | | disabled:false |
| | | option() { |
| | | return { |
| | | height: 'auto', |
| | | calcHeight: 20, |
| | | headerAlign: 'center', |
| | | align: 'center', |
| | | columnBtn: false, |
| | | border: true, |
| | | index: true, |
| | | rowKey: 'id', |
| | | addBtn: this.permissionList.addBtn, |
| | | editBtn: false, |
| | | delBtn: false, |
| | | refreshBtn: false, |
| | | column: [ |
| | | { |
| | | label: '策略名称', |
| | | prop: 'strategyName', |
| | | align: 'left', |
| | | span: 24, |
| | | labelWidth: "11%", |
| | | rules: [{ |
| | | required: true, |
| | | message: "请输入策略名称", |
| | | trigger: "blur" |
| | | }] |
| | | }, |
| | | { |
| | | label: '密码最小长度', |
| | | prop: 'minPwdLen', |
| | | span: 12, |
| | | labelWidth: "22%", |
| | | rules: [{ |
| | | required: true, |
| | | validator: (rule, value, callback) => { |
| | | this.values = value * 1 |
| | | if (value == "") { |
| | | callback(new Error('请输入密码最小长度')); |
| | | } else if (/[^\d]/g.test(value)) { |
| | | callback(new Error('密码最小长度的输入类型只能为数字类型')); |
| | | } else if (this.values >= this.values1 && this.values1 != 0) { |
| | | callback(new Error('密码最小长度不能大于密码最大长度')) |
| | | } else { |
| | | callback(); |
| | | } |
| | | ] |
| | | }, |
| | | trigger: 'blur' |
| | | }] |
| | | }, |
| | | { |
| | | label: '密码最大长度', |
| | | prop: 'maxPwdLen', |
| | | span: 12, |
| | | labelWidth: "25%", |
| | | rules: [{ |
| | | required: true, |
| | | validator: (rule, value, callback) => { |
| | | this.values1 = value * 1 |
| | | if (value == "") { |
| | | callback(new Error('请输入密码最大长度')); |
| | | } else if (this.values1 <= this.values) { |
| | | callback(new Error('密码最大长度不能小于密码最大长度')); |
| | | } else if (/[^\d]/g.test(value)) { |
| | | callback(new Error('密码最大长度的输入类型只能为数字类型')); |
| | | } else { |
| | | callback(); |
| | | } |
| | | }, |
| | | trigger: 'change' |
| | | }] |
| | | }, |
| | | { |
| | | label: '组合方法', |
| | | prop: 'combinationNames', |
| | | labelWidth: 91, |
| | | display: false, |
| | | |
| | | }, |
| | | { |
| | | label: '组合方法', |
| | | prop: 'combinationIds', |
| | | type: "checkbox", |
| | | span: 12, |
| | | labelWidth: "22%", |
| | | id: 5, |
| | | hide: true, |
| | | change: this.handleCheckboxChange, |
| | | rules: [{ |
| | | required: true, |
| | | message: "请选择组合方法", |
| | | trigger: "blur" |
| | | }], |
| | | dicUrl: '/api/ubcs-system/combination/select', |
| | | dicMethod: 'get', |
| | | props: { |
| | | value: "ID", |
| | | label: "NAME", |
| | | }, |
| | | { |
| | | label: '过期时间(天)', |
| | | prop:'expirationTime', |
| | | span:12, |
| | | labelWidth:"22%", |
| | | rules: [{ |
| | | required: true, |
| | | validator: (rule, value,callback) => { |
| | | if(value == ""){ |
| | | callback(new Error('请输入过期时间')); |
| | | }else if(/[^\d]/g.test(value)){ |
| | | callback(new Error('过期时间的输入类型只能为数字类型')); |
| | | }else { |
| | | callback(); |
| | | } |
| | | }, |
| | | trigger: 'blur' |
| | | }] |
| | | }, |
| | | { |
| | | label: '必填种类', |
| | | prop: 'requiredType', |
| | | type: 'select', |
| | | span: 12, |
| | | labelWidth: "25%", |
| | | change: this.handleSelectChange, |
| | | rules: [{ |
| | | required: true, |
| | | message: "请选择必填种类", |
| | | trigger: "blur" |
| | | }], |
| | | dicData: [{ |
| | | label: '1种', |
| | | value: 1, |
| | | disabled: false |
| | | }, |
| | | { |
| | | label: '提醒时间(天)', |
| | | prop:'reminderTime', |
| | | span:12, |
| | | labelWidth:"25%", |
| | | rules: [{ |
| | | required: true, |
| | | validator:(rule, value,callback) => { |
| | | if(value == ""){ |
| | | callback(new Error('请输入过期时间')); |
| | | }else if(/[^\d]/g.test(value)){ |
| | | callback(new Error('过期时间的输入类型只能为数字类型')); |
| | | }else { |
| | | callback(); |
| | | } |
| | | }, |
| | | trigger: 'blur' |
| | | }] |
| | | }, |
| | | { |
| | | label: '锁定次数(次)', |
| | | prop:'lockingNum', |
| | | span:12, |
| | | labelWidth:"22%", |
| | | rules: [{ |
| | | required: true, |
| | | validator:(rule, value,callback) => { |
| | | if(value == ""){ |
| | | callback(new Error('请输入锁定次数')); |
| | | }else if(/[^\d]/g.test(value)){ |
| | | callback(new Error('锁定次数的输入类型只能为数字类型')); |
| | | }else { |
| | | callback(); |
| | | } |
| | | }, |
| | | trigger: 'blur' |
| | | }] |
| | | }, |
| | | { |
| | | label: '锁定时间(分钟)', |
| | | prop:'lockingTime', |
| | | span:12, |
| | | labelWidth:"25%", |
| | | rules: [{ |
| | | required: true, |
| | | validator:(rule, value,callback) => { |
| | | if(value == ""){ |
| | | callback(new Error('请输入锁定时间')); |
| | | }else if(/[^\d]/g.test(value)){ |
| | | callback(new Error('锁定时间的输入类型只能为数字类型')); |
| | | }else { |
| | | callback(); |
| | | } |
| | | }, |
| | | trigger: 'blur' |
| | | }] |
| | | }, |
| | | { |
| | | label: '描述', |
| | | prop:'desc', |
| | | type: 'textarea', |
| | | span:12, |
| | | labelWidth:"22%", |
| | | rows: 5, |
| | | }, |
| | | { |
| | | label: '是否为默认策略', |
| | | prop: 'isDefault', |
| | | type: 'switch', |
| | | labelWidth: 132, |
| | | dicData:[{ |
| | | label:'否', |
| | | value:0 |
| | | },{ |
| | | label:'是', |
| | | value:1 |
| | | }] |
| | | } |
| | | ], |
| | | { |
| | | label: '2种', |
| | | value: 2, |
| | | disabled: false |
| | | }, |
| | | { |
| | | label: '3种', |
| | | value: 3, |
| | | disabled: false |
| | | }, |
| | | { |
| | | label: '4种', |
| | | value: 4, |
| | | disabled: false |
| | | } |
| | | ] |
| | | |
| | | }, |
| | | { |
| | | label: '过期时间(天)', |
| | | prop: 'expirationTime', |
| | | span: 12, |
| | | labelWidth: "22%", |
| | | rules: [{ |
| | | required: true, |
| | | validator: (rule, value, callback) => { |
| | | if (value == "") { |
| | | callback(new Error('请输入过期时间')); |
| | | } else if (/[^\d]/g.test(value)) { |
| | | callback(new Error('过期时间的输入类型只能为数字类型')); |
| | | } else { |
| | | callback(); |
| | | } |
| | | }, |
| | | trigger: 'blur' |
| | | }] |
| | | }, |
| | | { |
| | | label: '提醒时间(天)', |
| | | prop: 'reminderTime', |
| | | span: 12, |
| | | labelWidth: "25%", |
| | | rules: [{ |
| | | required: true, |
| | | validator: (rule, value, callback) => { |
| | | if (value == "") { |
| | | callback(new Error('请输入过期时间')); |
| | | } else if (/[^\d]/g.test(value)) { |
| | | callback(new Error('过期时间的输入类型只能为数字类型')); |
| | | } else { |
| | | callback(); |
| | | } |
| | | }, |
| | | trigger: 'blur' |
| | | }] |
| | | }, |
| | | { |
| | | label: '锁定次数(次)', |
| | | prop: 'lockingNum', |
| | | span: 12, |
| | | labelWidth: "22%", |
| | | rules: [{ |
| | | required: true, |
| | | validator: (rule, value, callback) => { |
| | | if (value == "") { |
| | | callback(new Error('请输入锁定次数')); |
| | | } else if (/[^\d]/g.test(value)) { |
| | | callback(new Error('锁定次数的输入类型只能为数字类型')); |
| | | } else { |
| | | callback(); |
| | | } |
| | | }, |
| | | trigger: 'blur' |
| | | }] |
| | | }, |
| | | { |
| | | label: '锁定时间(分钟)', |
| | | prop: 'lockingTime', |
| | | span: 12, |
| | | labelWidth: "25%", |
| | | rules: [{ |
| | | required: true, |
| | | validator: (rule, value, callback) => { |
| | | if (value == "") { |
| | | callback(new Error('请输入锁定时间')); |
| | | } else if (/[^\d]/g.test(value)) { |
| | | callback(new Error('锁定时间的输入类型只能为数字类型')); |
| | | } else { |
| | | callback(); |
| | | } |
| | | }, |
| | | trigger: 'blur' |
| | | }] |
| | | }, |
| | | { |
| | | label: '描述', |
| | | prop: 'desc', |
| | | type: 'textarea', |
| | | span: 12, |
| | | labelWidth: "22%", |
| | | rows: 5, |
| | | }, |
| | | { |
| | | label: '是否为默认策略', |
| | | prop: 'isDefault', |
| | | type: 'switch', |
| | | labelWidth: 132, |
| | | dicData: [{ |
| | | label: '否', |
| | | value: 0 |
| | | }, { |
| | | label: '是', |
| | | value: 1 |
| | | }] |
| | | } |
| | | ], |
| | | } |
| | | } |
| | | }, |
| | | created() { |
| | | this.onLoad() |
| | | }, |
| | | methods:{ |
| | | handleSelectChange(val){ |
| | | this.selectlength=val |
| | | methods: { |
| | | handleSelectChange(val) { |
| | | this.selectlength = val |
| | | }, |
| | | handleCheckboxChange(val) { |
| | | const arr = this.option.column[5]; |
| | |
| | | showClose: true, |
| | | }); |
| | | }, |
| | | rowDel(row){ |
| | | rowDel(row) { |
| | | this.$confirm("确定将选择数据删除?", { |
| | | confirmButtonText: "确定", |
| | | cancelButtonText: "取消", |
| | |
| | | message: "操作成功!" |
| | | }); |
| | | this.onLoad(); |
| | | }).catch(res=>{ |
| | | }).catch(res => { |
| | | // console.log(res) |
| | | }) |
| | | }, |
| | | rowSave(row,done){ |
| | | rowSave(row, done) { |
| | | //将密码组合方式的数据转换为字符串 |
| | | const spliceId= row.combinationIds.toString() |
| | | row.combinationIds=spliceId |
| | | getadd(row).then((res)=>{ |
| | | const spliceId = row.combinationIds.toString() |
| | | row.combinationIds = spliceId |
| | | getadd(row).then((res) => { |
| | | // this.onLoad(this.page); |
| | | this.$message({ |
| | | type: "success", |
| | |
| | | }); |
| | | done(row) |
| | | this.onLoad() |
| | | }).catch((res)=>{ |
| | | }).catch((res) => { |
| | | this.$message.warning(res) |
| | | }) |
| | | }, |
| | | rowEdit(row){ |
| | | rowEdit(row) { |
| | | // console.log("打开编辑edit",row) |
| | | }, |
| | | handleDel(row){ |
| | | this.$refs.crud.rowDel(row,row.$index); |
| | | handleDel(row) { |
| | | this.$refs.crud.rowDel(row, row.$index); |
| | | }, |
| | | handleEdit(row){ |
| | | this.$refs.crud.rowEdit(row,row.$index); |
| | | this.editFlag=true; |
| | | this.checkboxNumber=row.combinationIds.split(",") |
| | | this.selectNumber=row.requiredType |
| | | if(this.checkboxNumber.length < this.selectNumber){ |
| | | this.$message({ |
| | | type:"warning", |
| | | message:"必填种类不能大于组合方法,请重新选择!" |
| | | }) |
| | | } |
| | | handleEdit(row) { |
| | | this.$refs.crud.rowEdit(row, row.$index); |
| | | this.editFlag = true; |
| | | this.checkboxNumber = row.combinationIds.split(",") |
| | | this.selectNumber = row.requiredType |
| | | if (this.checkboxNumber.length < this.selectNumber) { |
| | | this.$message({ |
| | | type: "warning", |
| | | message: "必填种类不能大于组合方法,请重新选择!" |
| | | }) |
| | | } |
| | | }, |
| | | rowUpdate(row,index,done){ |
| | | getupdata(row).then(()=>{ |
| | | rowUpdate(row, index, done) { |
| | | getupdata(row).then(() => { |
| | | this.onLoad() |
| | | this.$message({ |
| | | type: "success", |
| | | message: "修改成功!" |
| | | }); |
| | | done() |
| | | }).catch(res=>{ |
| | | }).catch(res => { |
| | | // console.log(res) |
| | | }) |
| | | }, |
| | |
| | | // this.loading = false; |
| | | // this.selectionClear(); |
| | | // console.log(res) |
| | | this.page.total=res.data.data.total |
| | | this.data=res.data.data.records |
| | | this.page.total = res.data.data.total |
| | | this.data = res.data.data.records |
| | | }); |
| | | } |
| | | } |