|
@@ -4,41 +4,56 @@
|
|
|
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="130px" class="demo-ruleForm">
|
|
|
<el-row>
|
|
|
<el-col :span="12">
|
|
|
- <el-form-item label="社区名称" prop="communityName">
|
|
|
-<!-- <el-input v-model="ruleForm.communityName"></el-input>-->
|
|
|
- <el-select v-model="ruleForm.communityName" placeholder="请选择社区名称" @change="communityChoice">
|
|
|
- <el-option v-for="(item,index) in communityList" :label="item.label" :value="item.id" :key="index"></el-option>
|
|
|
+ <el-form-item label="社区名称" prop="communityId">
|
|
|
+ <el-select v-model="ruleForm.communityId" placeholder="请选择社区名称" @change="communityChoice">
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in communityList"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.id"
|
|
|
+ :key="index"
|
|
|
+ ></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="车库区域">
|
|
|
- <el-select v-model="ruleForm.garageArea" placeholder="请选择车库区域" @change="garageAreaChoice">
|
|
|
- <el-option v-for="(item,index) in garageAreaList" :label="item.label" :value="item.id" :key="index"></el-option>
|
|
|
+ <el-select v-model="ruleForm.garageAreaId" placeholder="请选择车库区域" @change="garageAreaChoice">
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in garageAreaList"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.id"
|
|
|
+ :key="index"
|
|
|
+ ></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="前缀名称" prop="prefixName" v-if="codingStatus==false">
|
|
|
- <el-input v-model="ruleForm.prefixName"></el-input>
|
|
|
+ <el-form-item label="前缀名称">
|
|
|
+ <el-input v-model="ruleForm.prefix"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="起始编号" v-if="codingStatus==false">
|
|
|
- <el-input v-model="ruleForm.parkingBeginNumber" prop="parkingBeginNumber"></el-input>
|
|
|
+ <el-form-item label="起始编号" v-if="codingStatus" prop="parkingBeginNumber">
|
|
|
+ <el-input v-model="ruleForm.parkingBeginNumber"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="车位编号" v-if="codingStatus==true">
|
|
|
- <el-input v-model="ruleForm.parkingNumber" prop="parkingNumber"></el-input>
|
|
|
+
|
|
|
+ <el-form-item label="车位编号" v-if="!codingStatus" prop="parkingNumber">
|
|
|
+ <el-input v-model="ruleForm.parkingNumber"></el-input>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="12">
|
|
|
- <el-form-item label="车库名称" prop="garageName">
|
|
|
- <el-select v-model="ruleForm.garageName" placeholder="请选择车库名称" @change="garageChoice">
|
|
|
- <el-option v-for="(item,index) in garageList" :label="item.label" :value="item.id" :key="index"></el-option>
|
|
|
+ <el-form-item label="车库名称" prop="garageId">
|
|
|
+ <el-select v-model="ruleForm.garageId" placeholder="请选择车库名称" @change="garageChoice">
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in garageList"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.id"
|
|
|
+ :key="index"
|
|
|
+ ></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="车位类别" prop="parkingType">
|
|
|
- <el-radio v-model="ruleForm.parkingType" label="1">公共车位</el-radio>
|
|
|
- <el-radio v-model="ruleForm.parkingType" label="2">私人车位</el-radio>
|
|
|
+ <el-radio v-model="ruleForm.parkingType" :label="1">公共车位</el-radio>
|
|
|
+ <el-radio v-model="ruleForm.parkingType" :label="2">私人车位</el-radio>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="车位面积">
|
|
|
<el-input v-model="ruleForm.parkingArea"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="结束编号" prop="parkingEndNumber" v-if="codingStatus==false">
|
|
|
+ <el-form-item label="结束编号" prop="parkingEndNumber" v-if="codingStatus">
|
|
|
<el-input v-model="ruleForm.parkingEndNumber"></el-input>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
@@ -46,9 +61,10 @@
|
|
|
<el-row>
|
|
|
<el-col :span="24">
|
|
|
<el-form-item label="备注信息">
|
|
|
- <el-input type="textarea" :rows="4" v-model="ruleForm.remarks" maxlength="300">
|
|
|
- </el-input>
|
|
|
- <span style="position:absolute;bottom:0;right:10px">{{ruleForm.remarks.length}}/300</span>
|
|
|
+ <el-input type="textarea" :rows="4" v-model="ruleForm.remarks" maxlength="300"> </el-input>
|
|
|
+ <span style="position: absolute; bottom: 0; right: 10px" v-if="ruleForm.remarks"
|
|
|
+ >{{ ruleForm.remarks.length }}/300</span
|
|
|
+ >
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
@@ -57,224 +73,149 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
- export default {
|
|
|
- props: ["params"],
|
|
|
- data() {
|
|
|
- return {
|
|
|
- communityList:[],//社区名称下拉列表
|
|
|
- garageList:[],//车库名称下拉列表
|
|
|
- garageAreaList:[],//车库区域下拉列表
|
|
|
- codingStatus:false,//编码状态
|
|
|
- ruleForm: {
|
|
|
- communityName: '',//社区名称
|
|
|
- communityId:'',//社区id
|
|
|
- garageArea:'',//车位区域
|
|
|
- garageAreaId:'',//车库区域id
|
|
|
- prefixName:'',//前缀名称
|
|
|
- parkingBeginNumber:'',//车位起始编号
|
|
|
- parkingEndNumber:'',//车位结束编号
|
|
|
- parkingNumber:'',//车位编号
|
|
|
- garageName:'',//车库名称
|
|
|
- garageId:'',//车库名称id
|
|
|
- parkingType:'1',//车位类别
|
|
|
- parkingArea:'',//车位面积
|
|
|
- remarks:'',//备注
|
|
|
- },
|
|
|
- rules: {
|
|
|
- communityName: [
|
|
|
- { required: true, message: '请输入社区名称', trigger: 'change' },
|
|
|
- // { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
|
|
|
- ],
|
|
|
- prefixName:[{ required: true, message: '请输入前缀名称', trigger: 'change' }],
|
|
|
- garageName:[{ required: true, message: '请选择车库名称', trigger: 'change' }],
|
|
|
- parkingType:[{ required: true, message: '请选择车位类别', trigger: 'change' }],
|
|
|
- parkingBeginNumber:[{ required: true, message: '请填写起始编码', trigger: 'change' }],
|
|
|
- parkingEndNumber:[{ required: true, message: '请填写结束编码', trigger: 'change' }],
|
|
|
- parkingNumber:[{ required: true, message: '请填写车位编号', trigger: 'change' }],
|
|
|
- },
|
|
|
- radio: '1',
|
|
|
- }
|
|
|
- },
|
|
|
- components:{
|
|
|
-
|
|
|
- },
|
|
|
- computed: {},
|
|
|
- methods: {
|
|
|
- //保存
|
|
|
- submit() {
|
|
|
- let formData='';
|
|
|
- this.$refs['ruleForm'].validate((valid) => {
|
|
|
- if (valid) {
|
|
|
- if(this.params.todo=='edit'){
|
|
|
- formData={
|
|
|
- "communityId": this.ruleForm.communityId,
|
|
|
- "garageAreaId": this.ruleForm.garageAreaId,
|
|
|
- "garageId": this.ruleForm.garageId,
|
|
|
- "id": this.params.data.id,
|
|
|
- "parkingArea": this.ruleForm.parkingArea,
|
|
|
- // "parkingBeginNumber": this.ruleForm.parkingBeginNumber,
|
|
|
- // "parkingEndNumber": this.ruleForm.parkingEndNumber,
|
|
|
- "parkingNumber": this.ruleForm.parkingNumber,
|
|
|
- "parkingType": this.ruleForm.parkingType,
|
|
|
- // "prefix": this.ruleForm.prefixName,
|
|
|
- "remarks": this.ruleForm.remarks
|
|
|
- }
|
|
|
- this.$http.post('/assets/garage/parking/update', formData).then((res) => {
|
|
|
-
|
|
|
- });
|
|
|
- }else{
|
|
|
- formData={
|
|
|
- "communityId": this.ruleForm.communityId,
|
|
|
- "garageAreaId": this.ruleForm.garageAreaId,
|
|
|
- "garageId": this.ruleForm.garageId,
|
|
|
- "id": 0,
|
|
|
- "parkingArea": this.ruleForm.parkingArea,
|
|
|
- "parkingBeginNumber": this.ruleForm.parkingBeginNumber,
|
|
|
- "parkingEndNumber": this.ruleForm.parkingEndNumber,
|
|
|
- "parkingType": this.ruleForm.parkingType,
|
|
|
- "prefix": this.ruleForm.prefixName,
|
|
|
- "remarks": this.ruleForm.remarks
|
|
|
- }
|
|
|
- this.$http.post('/assets/garage/parking/add', formData).then((res) => {
|
|
|
-
|
|
|
- });
|
|
|
- }
|
|
|
- } else {
|
|
|
- console.log('error submit!!');
|
|
|
- return false;
|
|
|
- }
|
|
|
- });
|
|
|
-
|
|
|
+export default {
|
|
|
+ props: ['params'],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ communityList: [], //社区名称下拉列表
|
|
|
+ garageList: [], //车库名称下拉列表
|
|
|
+ garageAreaList: [], //车库区域下拉列表
|
|
|
+ codingStatus: true, //编码状态
|
|
|
+ ruleForm: {
|
|
|
+ communityId: '', //社区id
|
|
|
+ garageAreaId: '', //车库区域id
|
|
|
+ prefix: '', //前缀名称
|
|
|
+ parkingBeginNumber: '', //车位起始编号
|
|
|
+ parkingEndNumber: '', //车位结束编号
|
|
|
+ garageId: '', //车库名称id
|
|
|
+ parkingType: 1, //车位类别
|
|
|
+ parkingArea: '', //车位面积
|
|
|
+ remarks: '' //备注
|
|
|
},
|
|
|
- resetForm(formName) {
|
|
|
- this.$refs[formName].resetFields();
|
|
|
+ rules: {
|
|
|
+ communityId: [
|
|
|
+ { required: true, message: '请输入社区名称', trigger: 'change' }
|
|
|
+ // { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
|
|
|
+ ],
|
|
|
+ garageId: [{ required: true, message: '请选择车库名称', trigger: 'change' }],
|
|
|
+ parkingType: [{ required: true, message: '请选择车位类别', trigger: 'change' }],
|
|
|
+ parkingBeginNumber: [{ required: true, message: '请填写起始编码', trigger: 'change' }],
|
|
|
+ parkingEndNumber: [{ required: true, message: '请填写结束编码', trigger: 'change' }],
|
|
|
+ parkingNumber: [{ required: true, message: '请填写车位编号', trigger: 'change' }]
|
|
|
},
|
|
|
-
|
|
|
- handleAvatarSuccess(res, file) {
|
|
|
- this.imageUrl = URL.createObjectURL(file.raw);
|
|
|
- },
|
|
|
- beforeAvatarUpload(file) {
|
|
|
- const isJPG = file.type === 'image/jpeg';
|
|
|
- const isLt2M = file.size / 1024 / 1024 < 2;
|
|
|
-
|
|
|
- if (!isJPG) {
|
|
|
- this.$message.error('上传头像图片只能是 JPG 格式!');
|
|
|
- }
|
|
|
- if (!isLt2M) {
|
|
|
- this.$message.error('上传头像图片大小不能超过 2MB!');
|
|
|
+ radio: '1'
|
|
|
+ };
|
|
|
+ },
|
|
|
+ components: {},
|
|
|
+ computed: {},
|
|
|
+ methods: {
|
|
|
+ //保存
|
|
|
+ submit() {
|
|
|
+ this.$refs['ruleForm'].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ var loading = this.$loading();
|
|
|
+ let url = '/assets/garage/parking/add';
|
|
|
+ if (this.params.todo == 'edit') {
|
|
|
+ url = '/assets/garage/parking/update';
|
|
|
+ }
|
|
|
+ this.$http
|
|
|
+ .post(url, this.ruleForm)
|
|
|
+ .then(({ status, msg }) => {
|
|
|
+ if (status == 0) {
|
|
|
+ this.$message.success(msg);
|
|
|
+ this.params.callback();
|
|
|
+ this.$emit('close');
|
|
|
+ }
|
|
|
+ loading.close();
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ loading.close();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ console.log('error submit!!');
|
|
|
+ return false;
|
|
|
}
|
|
|
- return isJPG && isLt2M;
|
|
|
- },
|
|
|
- coordinateClick(){
|
|
|
- this.$confirm('确认关闭?')
|
|
|
- .then(_ => {
|
|
|
- done();
|
|
|
- })
|
|
|
- .catch(_ => {});
|
|
|
- },
|
|
|
- addressQueryClick(){
|
|
|
- this.mapPopUpStatus=true;
|
|
|
- },
|
|
|
+ });
|
|
|
+ },
|
|
|
|
|
|
- //获取社区名称下拉列表
|
|
|
- communityNameList(){
|
|
|
- this.communityList=[];
|
|
|
- let onOption='';
|
|
|
- this.$http.get('/assets/community/list', {}).then((res) => {
|
|
|
- res.data.map(res=>{
|
|
|
- onOption={
|
|
|
- label:res.communityName,
|
|
|
- id:res.id
|
|
|
- }
|
|
|
- this.communityList.push(onOption)
|
|
|
- })
|
|
|
+ //获取社区名称下拉列表
|
|
|
+ communityNameList() {
|
|
|
+ this.communityList = [];
|
|
|
+ let onOption = '';
|
|
|
+ this.$http.get('/assets/community/list', {}).then((res) => {
|
|
|
+ res.data.map((res) => {
|
|
|
+ onOption = {
|
|
|
+ label: res.communityName,
|
|
|
+ id: res.id
|
|
|
+ };
|
|
|
+ this.communityList.push(onOption);
|
|
|
});
|
|
|
- },
|
|
|
-
|
|
|
+ });
|
|
|
+ },
|
|
|
|
|
|
- communityChoice(e){
|
|
|
- console.log(e)
|
|
|
- this.ruleForm.communityId=e;
|
|
|
- this.garageNameList();
|
|
|
- },
|
|
|
+ communityChoice(e) {
|
|
|
+ console.log(e);
|
|
|
+ this.ruleForm.communityId = e;
|
|
|
+ this.garageNameList();
|
|
|
+ },
|
|
|
|
|
|
- //获取车库名称下拉列表
|
|
|
- garageNameList(){
|
|
|
- this.garageList=[];
|
|
|
- let onOption='';
|
|
|
- this.$http.post('/assets/garage/list', {communityId:this.ruleForm.communityId}).then((res) => {
|
|
|
- res.data.map(res=>{
|
|
|
- onOption={
|
|
|
- label:res.garageName,
|
|
|
- id:res.id
|
|
|
- }
|
|
|
- this.garageList.push(onOption)
|
|
|
- })
|
|
|
+ //获取车库名称下拉列表
|
|
|
+ garageNameList() {
|
|
|
+ this.garageList = [];
|
|
|
+ let onOption = '';
|
|
|
+ this.$http.post('/assets/garage/list', { communityId: this.ruleForm.communityId }).then((res) => {
|
|
|
+ res.data.map((res) => {
|
|
|
+ onOption = {
|
|
|
+ label: res.garageName,
|
|
|
+ id: res.id
|
|
|
+ };
|
|
|
+ this.garageList.push(onOption);
|
|
|
});
|
|
|
- },
|
|
|
+ });
|
|
|
+ },
|
|
|
|
|
|
- garageChoice(e){
|
|
|
- console.log(e)
|
|
|
- this.ruleForm.garageId=e;
|
|
|
- this.garageAreaListQuery()
|
|
|
- },
|
|
|
+ garageChoice(e) {
|
|
|
+ console.log(e);
|
|
|
+ this.ruleForm.garageId = e;
|
|
|
+ this.garageAreaListQuery();
|
|
|
+ },
|
|
|
|
|
|
- garageAreaListQuery(){
|
|
|
- this.garageAreaList=[];
|
|
|
- let onOption='';
|
|
|
- this.$http.post('/assets/garage/area/list', {communityId:this.ruleForm.garageId}).then((res) => {
|
|
|
- res.data.map(res=>{
|
|
|
- onOption={
|
|
|
- label:res.areaName,
|
|
|
- id:res.id
|
|
|
- }
|
|
|
- this.garageAreaList.push(onOption)
|
|
|
- })
|
|
|
+ garageAreaListQuery() {
|
|
|
+ this.garageAreaList = [];
|
|
|
+ let onOption = '';
|
|
|
+ this.$http.post('/assets/garage/area/list', { communityId: this.ruleForm.garageId }).then((res) => {
|
|
|
+ debugger;
|
|
|
+ res.data.map((res) => {
|
|
|
+ onOption = {
|
|
|
+ label: res.areaName,
|
|
|
+ id: res.id
|
|
|
+ };
|
|
|
+ this.garageAreaList.push(onOption);
|
|
|
});
|
|
|
- },
|
|
|
-
|
|
|
- garageAreaChoice(e){
|
|
|
- this.ruleForm.garageAreaId=e;
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- //展示添加和编辑
|
|
|
- addEditPresentation(){
|
|
|
- if(this.params.todo=='edit'){
|
|
|
- this.codingStatus=true;
|
|
|
- this.ruleForm.communityName=this.params.data.communityId;
|
|
|
- this.ruleForm.parkingBeginNumber=this.params.data.parkingBeginNumber;
|
|
|
- this.ruleForm.parkingEndNumber=this.params.data.parkingEndNumber;
|
|
|
- this.ruleForm.parkingType=String(this.params.data.parkingType);
|
|
|
- this.ruleForm.parkingArea=this.params.data.parkingArea;
|
|
|
- this.ruleForm.parkingNumber=this.params.data.parkingNumber;
|
|
|
- this.ruleForm.remarks=this.params.data.remarks;
|
|
|
- }else{
|
|
|
- this.codingStatus=true;
|
|
|
- this.ruleForm.communityName='';
|
|
|
- this.ruleForm.parkingBeginNumber='';
|
|
|
- this.ruleForm.parkingEndNumber=this.params.data.parkingEndNumber;
|
|
|
- this.ruleForm.parkingType='1';
|
|
|
- this.ruleForm.parkingArea='';
|
|
|
- this.ruleForm.remarks='';
|
|
|
- }
|
|
|
- },
|
|
|
+ });
|
|
|
},
|
|
|
- created() {
|
|
|
- //获取社区名称下拉列表
|
|
|
- this.communityNameList();
|
|
|
- this.addEditPresentation()
|
|
|
+
|
|
|
+ garageAreaChoice(e) {
|
|
|
+ this.ruleForm.garageAreaId = e;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ //获取社区名称下拉列表
|
|
|
+ this.communityNameList();
|
|
|
+ if (this.params.todo == 'edit') {
|
|
|
+ this.codingStatus = false;
|
|
|
+ this.ruleForm = this.params.data;
|
|
|
}
|
|
|
- };
|
|
|
+ }
|
|
|
+};
|
|
|
</script>
|
|
|
<style lang='scss'>
|
|
|
- .alert-body__main_content{
|
|
|
- .blockName{
|
|
|
- padding:20px;
|
|
|
- i{
|
|
|
- color:red;
|
|
|
- }
|
|
|
+.alert-body__main_content {
|
|
|
+ .blockName {
|
|
|
+ padding: 20px;
|
|
|
+ i {
|
|
|
+ color: red;
|
|
|
}
|
|
|
-
|
|
|
}
|
|
|
+}
|
|
|
</style>
|