|
@@ -1,109 +1,159 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <a-modal class="modalBox" :title="titleText" v-model="isshow" @cancle="cancel" :width="600">
|
|
|
- <a-form :form="form" @submit="handleSubmit" >
|
|
|
- <!-- 企业名称 -->
|
|
|
- <a-form-item label="企业名称:" :label-col="{ span: 9 }" :wrapper-col="{ span: 14 }">
|
|
|
- <span>{{ itemData?itemData.name:'' }}</span>
|
|
|
- </a-form-item>
|
|
|
- <!-- 申请人手机 -->
|
|
|
- <a-form-item label="申请人手机:" :label-col="{ span: 9 }" :wrapper-col="{ span: 14 }">
|
|
|
- <span>{{ itemData?itemData.contactPhone:'' }}</span>
|
|
|
- </a-form-item>
|
|
|
- <!-- 推荐人手机 -->
|
|
|
- <a-form-item label="推荐人手机:" :label-col="{ span: 9 }" :wrapper-col="{ span: 14 }">
|
|
|
- <span>{{ itemData?itemData.introPhone:'' }}</span>
|
|
|
- </a-form-item>
|
|
|
-
|
|
|
- <!-- 使用有效期至 -->
|
|
|
- <a-form-item label="使用有效期至:" :label-col="{ span: 9 }" :wrapper-col="{ span: 14 }">
|
|
|
- <a-date-picker
|
|
|
- style="width: 100%;"
|
|
|
- @change="expireDateChange"
|
|
|
- placeholder="年/月/日"
|
|
|
- v-decorator="[
|
|
|
- 'formData.expireDate',
|
|
|
- { initialValue: formData.expireDate,
|
|
|
- rules: [{type: 'object', required: true, message: '请选择使用有效期!' }] },
|
|
|
- ]"/>
|
|
|
- <p>
|
|
|
- 常选:<span class="time-text" @click="timeFilter(3)">3天</span> <span class="time-text" @click="timeFilter(30)">1个月</span> <span class="time-text" @click="timeFilter(365)">1年</span>
|
|
|
- </p>
|
|
|
- </a-form-item>
|
|
|
- <!-- 门店类型 -->
|
|
|
- <a-form-item label="门店类型:" :label-col="{ span: 9 }" :wrapper-col="{ span: 14 }">
|
|
|
- <v-select
|
|
|
- ref="orgType"
|
|
|
- allowClear
|
|
|
- :disabled="hasOrgType"
|
|
|
- @change="orgTypeChange"
|
|
|
- v-decorator="[
|
|
|
- 'formData.orgType',
|
|
|
- { initialValue: formData.orgType,
|
|
|
- rules: [{ required: true, message: '请选择门店类型!' }] },
|
|
|
- ]"
|
|
|
- code="ORG_TYPE"></v-select>
|
|
|
-
|
|
|
- </a-form-item>
|
|
|
- <!-- 使用权限 -->
|
|
|
- <a-form-item label="使用权限:" :label-col="{ span: 9 }" :wrapper-col="{ span: 14 }">
|
|
|
- <v-select
|
|
|
- ref="orgType"
|
|
|
- allowClear
|
|
|
- @change="scopeTypeChange"
|
|
|
- v-decorator="[
|
|
|
- 'formData.scopeType',
|
|
|
- { initialValue: formData.scopeType,
|
|
|
- rules: [{ required: true, message: '请选择使用权限!' }] },
|
|
|
- ]"
|
|
|
- code="STORE_AUTH_TYPE"></v-select>
|
|
|
-
|
|
|
- </a-form-item>
|
|
|
- <!-- 最大可开通门店数 -->
|
|
|
- <a-form-item v-if="formData.orgType=='ls'" label="最大可开通门店数:" :label-col="{ span: 9 }" :wrapper-col="{ span: 14 }">
|
|
|
- <a-input-number
|
|
|
- id="inputNumber"
|
|
|
- :min="1"
|
|
|
- :max="10"
|
|
|
- style="width: 100%;"
|
|
|
- v-decorator="[
|
|
|
- 'formData.childMaxNum',
|
|
|
- { initialValue: formData.childMaxNum,
|
|
|
- rules: [{ required: true, message: '请输入最大可开通门店数!' }] },
|
|
|
- ]"
|
|
|
- />
|
|
|
- </a-form-item>
|
|
|
- <!-- 单店最大可开通用户数 -->
|
|
|
- <a-form-item v-if="formData.orgType=='ls'" label="单店最大可开通用户数:" :label-col="{ span: 9 }" :wrapper-col="{ span: 14 }">
|
|
|
- <span class="labelT">( 包含管理员账号 )</span>
|
|
|
- <a-input-number
|
|
|
- id="inputNumber"
|
|
|
- :min="1"
|
|
|
- :max="100"
|
|
|
- style="width: 100%;"
|
|
|
- v-decorator="[
|
|
|
- 'formData.childUserMaxNum',
|
|
|
- { initialValue: formData.childUserMaxNum,
|
|
|
- rules: [{ required: true, message: '请输入单店最大可开通用户数!' }] },
|
|
|
- ]"
|
|
|
- />
|
|
|
- </a-form-item>
|
|
|
- <!-- 最大可开通用户数 -->
|
|
|
- <a-form-item v-if="formData.orgType!='ls'" label="最大可开通用户数:" :label-col="{ span: 9 }" :wrapper-col="{ span: 14 }">
|
|
|
- <span class="labelT">( 包含管理员账号 )</span>
|
|
|
- <a-input-number
|
|
|
- id="inputNumber"
|
|
|
- :min="1"
|
|
|
- :max="100"
|
|
|
- style="width: 100%;"
|
|
|
- v-decorator="[
|
|
|
- 'formData.childUserMaxNum',
|
|
|
- { initialValue: formData.childUserMaxNum,
|
|
|
- rules: [{ required: true, message: '请输入最大可开通用户数!' }] },
|
|
|
- ]"
|
|
|
- />
|
|
|
- </a-form-item>
|
|
|
-
|
|
|
+ <a-modal class="modalBox" :title="titleText" v-model="isshow" @cancle="cancel" :width="900">
|
|
|
+ <a-form :form="form" ref="form" @submit="handleSubmit">
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :span="12">
|
|
|
+ <!-- 企业名称 -->
|
|
|
+ <a-form-item label="企业名称:" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
|
|
|
+ <a-input
|
|
|
+ allowClear
|
|
|
+ :maxLength="32"
|
|
|
+ v-decorator="[
|
|
|
+ 'formData.name',
|
|
|
+ { initialValue: formData.name,
|
|
|
+ rules: [{ required: true, message: '请输入企业名称!' }] },
|
|
|
+ ]"
|
|
|
+ placeholder="请输入企业名称" />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="12">
|
|
|
+ <!-- 企业编码 -->
|
|
|
+ <a-form-item label="企业编码:" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
|
|
|
+ <a-input
|
|
|
+ allowClear
|
|
|
+ :maxLength="32"
|
|
|
+ v-decorator="[
|
|
|
+ 'formData.mark',
|
|
|
+ { initialValue: formData.mark, },
|
|
|
+ ]"
|
|
|
+ placeholder="请输入企业编码" />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :span="12">
|
|
|
+ <!-- 负责人名称 -->
|
|
|
+ <a-form-item label="负责人名称:" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
|
|
|
+ <a-input
|
|
|
+ allowClear
|
|
|
+ :maxLength="32"
|
|
|
+ v-decorator="[
|
|
|
+ 'formData.userName',
|
|
|
+ { initialValue: formData.userName,
|
|
|
+ rules: [] },
|
|
|
+ ]"
|
|
|
+ placeholder="请输入负责人名称" />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="12">
|
|
|
+ <!-- 负责人手机 -->
|
|
|
+ <a-form-item label="负责人手机:" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
|
|
|
+ <a-input
|
|
|
+ allowClear
|
|
|
+ :maxLength="11"
|
|
|
+ v-decorator="[
|
|
|
+ 'formData.phone',
|
|
|
+ { initialValue: formData.phone,
|
|
|
+ rules: [{ required: true,
|
|
|
+ message:'请输入负责人手机号!'
|
|
|
+ },
|
|
|
+ { pattern:/^\d{11}$/, message:'请输入正确的负责人手机号'}
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ ]"
|
|
|
+ placeholder="请输入负责人手机" />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :span="12">
|
|
|
+ <!-- 使用有效期至 -->
|
|
|
+ <a-form-item label="使用有效期至:" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
|
|
|
+ <a-date-picker
|
|
|
+ style="width: 100%;"
|
|
|
+ @change="expireDateChange"
|
|
|
+ placeholder="年/月/日"
|
|
|
+ v-decorator="[
|
|
|
+ 'formData.expireDate',
|
|
|
+ { initialValue: formData.expireDate,
|
|
|
+ rules: [{type: 'object', required: true, message: '请选择使用有效期!' }] },
|
|
|
+ ]" />
|
|
|
+ <p>
|
|
|
+ 常选:<span class="time-text" @click="timeFilter(3)">3天</span> <span class="time-text" @click="timeFilter(30)">1个月</span>
|
|
|
+ <span class="time-text" @click="timeFilter(365)">1年</span>
|
|
|
+ </p>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="12">
|
|
|
+ <!-- 启用状态 -->
|
|
|
+ <a-form-item label="启用状态:" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
|
|
|
+ <a-radio-group
|
|
|
+ @change="onStatusChange"
|
|
|
+ v-decorator="[
|
|
|
+ 'formData.status',
|
|
|
+ { initialValue: formData.status,
|
|
|
+ rules: [{ required: true, message: '请选择启用状态!' }] },
|
|
|
+ ]">
|
|
|
+ <a-radio :value="1">
|
|
|
+ 是
|
|
|
+ </a-radio>
|
|
|
+ <a-radio :value="0">
|
|
|
+ 否
|
|
|
+ </a-radio>
|
|
|
+ </a-radio-group>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :span="12">
|
|
|
+ <!-- 使用权限 -->
|
|
|
+ <a-form-item label="使用权限:" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
|
|
|
+ <v-select
|
|
|
+ ref="orgType"
|
|
|
+ allowClear
|
|
|
+ @change="scopeTypeChange"
|
|
|
+ v-decorator="[
|
|
|
+ 'formData.scopeType',
|
|
|
+ { initialValue: formData.scopeType,
|
|
|
+ rules: [{ required: true, message: '请选择使用权限!' }] },
|
|
|
+ ]"
|
|
|
+ code="STORE_AUTH_TYPE"></v-select>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :span="12">
|
|
|
+ <!-- 地址 -->
|
|
|
+ <a-form-item label="地址:" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
|
|
|
+ <a-cascader
|
|
|
+ allowClear
|
|
|
+ :options="addressData"
|
|
|
+ placeholder="请选择省市区"
|
|
|
+ v-decorator="[
|
|
|
+ 'formData.address',
|
|
|
+ { initialValue: formData.address,
|
|
|
+ rules: [] },
|
|
|
+ ]"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="12">
|
|
|
+ <!-- 详细地址 -->
|
|
|
+ <a-form-item>
|
|
|
+ <a-input
|
|
|
+ :maxLength="32"
|
|
|
+ allowClear
|
|
|
+ placeholder="请输入详细地址"
|
|
|
+ v-decorator="[
|
|
|
+ 'formData.addressDetail',
|
|
|
+ { initialValue: formData.addressDetail,
|
|
|
+ rules: [] },
|
|
|
+ ]"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
<a-form-item :wrapper-col="{ span: 24, offset: 10 }">
|
|
|
<a-button type="primary" @click="handleSubmit()">
|
|
|
确定
|
|
@@ -119,64 +169,105 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { STable, VSelect } from '@/components'
|
|
|
-import { saveAuth } from '@/api/tenants.js'
|
|
|
+import {
|
|
|
+ STable,
|
|
|
+ VSelect
|
|
|
+} from '@/components'
|
|
|
+import {
|
|
|
+ saveAuth
|
|
|
+} from '@/api/tenants.js'
|
|
|
import moment from 'moment'
|
|
|
export default {
|
|
|
name: 'TenantsModal',
|
|
|
components: {
|
|
|
- STable, VSelect
|
|
|
+ STable,
|
|
|
+ VSelect
|
|
|
},
|
|
|
props: {
|
|
|
visible: {
|
|
|
type: Boolean,
|
|
|
default: false
|
|
|
},
|
|
|
- itemData: {
|
|
|
- type: Object,
|
|
|
- default: function () {
|
|
|
- return {}
|
|
|
+ // 要编辑的租户id
|
|
|
+ itemId: {
|
|
|
+ type: [String, Number],
|
|
|
+ default: ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ visible (newValue, oldValue) {
|
|
|
+ this.isshow = newValue
|
|
|
+ },
|
|
|
+ isshow (newValue, oldValue) {
|
|
|
+ if (newValue) {
|
|
|
+ const now = moment().add(7, 'day').format('YYYY-MM-DD')
|
|
|
+ const expireDate = moment(now, 'YYYY-MM-DD')
|
|
|
+ // this.formData.expireDate = this.itemData.expireDate ? moment(this.itemData.expireDate, 'YYYY-MM-DD') : expireDate
|
|
|
+ // // this.form.setFields({ 'formData.expireDate': { value: this.formData.expireDate, errors: '' } })
|
|
|
+ } else {
|
|
|
+ this.cancel()
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
data () {
|
|
|
return {
|
|
|
moment,
|
|
|
- titleText: '设置权限',
|
|
|
isshow: this.visible,
|
|
|
- hasOrgType: false,
|
|
|
- formLayout: 'horizontal',
|
|
|
- form: this.$form.createForm(this, { name: 'tenantsModal' }),
|
|
|
+ form: this.$form.createForm(this, {
|
|
|
+ name: 'tenantsModal'
|
|
|
+ }),
|
|
|
+ addressData: null, // 省市区
|
|
|
formData: {
|
|
|
- expireDate: null,
|
|
|
- orgType: '',
|
|
|
- scopeType: '',
|
|
|
- childMaxNum: 1,
|
|
|
- childUserMaxNum: 1
|
|
|
+ name: '', // 企业名称
|
|
|
+ mark: '', // 企业编码
|
|
|
+ userName: '', // 负责人名称
|
|
|
+ phone: '', // 负责人电话
|
|
|
+ expireDate: null, // 使用有效期
|
|
|
+ scopeType: '', // 权限类型
|
|
|
+ status: 1, // 启用状态
|
|
|
+ address: [], // 省市区
|
|
|
+ addressDetail: '' // 详细地址
|
|
|
}
|
|
|
|
|
|
}
|
|
|
},
|
|
|
+ computed: {
|
|
|
+ titleText () {
|
|
|
+ return this.itemId ? '编辑' : '新增'
|
|
|
+ }
|
|
|
+ },
|
|
|
methods: {
|
|
|
cancel (e) {
|
|
|
this.clear()
|
|
|
this.$emit('close')
|
|
|
},
|
|
|
+ // 有效期改变
|
|
|
expireDateChange (v) {
|
|
|
console.log(v)
|
|
|
- this.form.setFields({ 'formData.expireDate': { value: v, errors: '' } })
|
|
|
- },
|
|
|
- orgTypeChange (v) {
|
|
|
- this.formData.orgType = v
|
|
|
-
|
|
|
+ this.form.setFields({
|
|
|
+ 'formData.expireDate': {
|
|
|
+ value: v,
|
|
|
+ errors: ''
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
+ // 使用权限改变
|
|
|
scopeTypeChange (v) {
|
|
|
this.formData.scopeType = v
|
|
|
},
|
|
|
+ // 启用状态切换
|
|
|
+ onStatusChange (v) {
|
|
|
+ console.log(v, 'vvvvvvvvvv')
|
|
|
+ },
|
|
|
// 快捷时间处理
|
|
|
timeFilter (time) {
|
|
|
const now = moment().add(time, 'day').format('YYYY-MM-DD')
|
|
|
- this.form.setFields({ 'formData.expireDate': { value: moment(now, 'YYYY-MM-DD'), errors: '' } })
|
|
|
+ this.form.setFields({
|
|
|
+ 'formData.expireDate': {
|
|
|
+ value: moment(now, 'YYYY-MM-DD'),
|
|
|
+ errors: ''
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
|
|
|
// 保存提交
|
|
@@ -185,21 +276,23 @@ export default {
|
|
|
this.form.validateFields((err, values) => {
|
|
|
if (!err) {
|
|
|
console.log(values.formData, ' formData.type222222222')
|
|
|
- const params = Object.assign({ id: this.itemData.id }, values.formData)
|
|
|
- params.expireDate = moment(params.expireDate).format('YYYY-MM-DD')
|
|
|
- console.log(params, 'ppppppppppppp')
|
|
|
- saveAuth(params).then(res => {
|
|
|
- console.log(res, 'res--save')
|
|
|
- if (res.status + '' === '200') {
|
|
|
- this.$message.success(res.message ? res.message : '保存成功')
|
|
|
- this.$emit('refresh')
|
|
|
- setTimeout(function () {
|
|
|
- _this.cancel()
|
|
|
- }, 300)
|
|
|
- } else {
|
|
|
- // this.$message.warning(res.message)
|
|
|
- }
|
|
|
- })
|
|
|
+ // const params = Object.assign({
|
|
|
+ // id: this.itemData.id
|
|
|
+ // }, values.formData)
|
|
|
+ // params.expireDate = moment(params.expireDate).format('YYYY-MM-DD')
|
|
|
+ // console.log(params, 'ppppppppppppp')
|
|
|
+ // saveAuth(params).then(res => {
|
|
|
+ // console.log(res, 'res--save')
|
|
|
+ // if (res.status + '' === '200') {
|
|
|
+ // this.$message.success(res.message ? res.message : '保存成功')
|
|
|
+ // this.$emit('refresh')
|
|
|
+ // setTimeout(function () {
|
|
|
+ // _this.cancel()
|
|
|
+ // }, 300)
|
|
|
+ // } else {
|
|
|
+ // // this.$message.warning(res.message)
|
|
|
+ // }
|
|
|
+ // })
|
|
|
}
|
|
|
})
|
|
|
},
|
|
@@ -221,50 +314,33 @@ export default {
|
|
|
this.form.resetFields()
|
|
|
}
|
|
|
|
|
|
- },
|
|
|
- mounted () {
|
|
|
},
|
|
|
beforeCreate () {
|
|
|
- this.form = this.$form.createForm(this, { name: 'tenantsModal' })
|
|
|
- },
|
|
|
- watch: {
|
|
|
- visible (newValue, oldValue) {
|
|
|
- this.isshow = newValue
|
|
|
- },
|
|
|
- isshow (newValue, oldValue) {
|
|
|
- if (newValue) {
|
|
|
- const now = moment().add(7, 'day').format('YYYY-MM-DD')
|
|
|
- const expireDate = moment(now, 'YYYY-MM-DD')
|
|
|
- this.formData.expireDate = this.itemData.expireDate ? moment(this.itemData.expireDate, 'YYYY-MM-DD') : expireDate
|
|
|
- // this.form.setFields({ 'formData.expireDate': { value: this.formData.expireDate, errors: '' } })
|
|
|
- this.formData.orgType = this.itemData.orgType ? this.itemData.orgType : ''
|
|
|
- this.formData.scopeType = this.itemData.scopeType ? this.itemData.scopeType : ''
|
|
|
- this.formData.childMaxNum = this.itemData.childMaxNum ? this.itemData.childMaxNum : 1
|
|
|
- this.formData.childUserMaxNum = this.itemData.childUserMaxNum ? this.itemData.childUserMaxNum : 1
|
|
|
- this.hasOrgType = !!this.itemData.menuMouldId
|
|
|
- } else {
|
|
|
- this.cancel()
|
|
|
- }
|
|
|
- }
|
|
|
+ this.form = this.$form.createForm(this, {
|
|
|
+ name: 'tenantsModal'
|
|
|
+ })
|
|
|
}
|
|
|
+
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style >
|
|
|
- .modalBox{
|
|
|
- }
|
|
|
- .ant-modal-footer {
|
|
|
- display: none;
|
|
|
- }
|
|
|
- .time-text{
|
|
|
- color: #1890FF;
|
|
|
- padding: 0px 20px;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
- .labelT{
|
|
|
- position: absolute;
|
|
|
- left: -135px;
|
|
|
- top: 20px;
|
|
|
- color: rgba(0, 0, 0, 0.85);
|
|
|
- }
|
|
|
+<style>
|
|
|
+ .modalBox {}
|
|
|
+
|
|
|
+ .ant-modal-footer {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .time-text {
|
|
|
+ color: #1890FF;
|
|
|
+ padding: 0px 20px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+
|
|
|
+ .labelT {
|
|
|
+ position: absolute;
|
|
|
+ left: -135px;
|
|
|
+ top: 20px;
|
|
|
+ color: rgba(0, 0, 0, 0.85);
|
|
|
+ }
|
|
|
</style>
|