梁航:行业与业态两级联动
This commit is contained in:
@@ -40,7 +40,7 @@
|
||||
<u-input v-model="form.area" placeholder="请输入店铺面积" placeholder-class="input-class" border="none" type="number"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="预计投资" label-position="top" border-bottom="true" label-width="auto" prop="transferFee">
|
||||
<u-input v-model="form.transferFee" placeholder="请输入预计投资" placeholder-class="input-class"
|
||||
<u-input v-model="form.transferFee" placeholder="请输入预计投资" placeholder-class="input-class" type="number"
|
||||
border="none"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="租金(元/月)" label-position="top" border-bottom="true" label-width="auto" prop="rent">
|
||||
|
||||
@@ -28,15 +28,15 @@
|
||||
<u-input v-model="form.address" placeholder="请输入店铺地址" placeholder-class="input-class" border="none"
|
||||
@focus="changeAddressFocus" @blur="changeAddress"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="适合行业" label-position="top" border-bottom="true" class="picker" label-width="auto"
|
||||
<u-form-item label="行业" label-position="top" border-bottom="true" class="picker" label-width="auto"
|
||||
prop="business">
|
||||
<text @click="show2 = true" class="checkedtext" v-if="form.business.length>0">{{form.business}}</text>
|
||||
<text @click="show2 = true" class="checktext" v-else>请选择店铺行业</text>
|
||||
<text @click="show2 = true" class="checkedtext" v-if="form.business">{{form.business}}-{{form.commercial}}</text>
|
||||
<text @click="show2 = true" class="checktext" v-else>请选择店铺行业与业态</text>
|
||||
<view class="arrow-icon">
|
||||
<u-icon name="arrow-right" size="30px" @click="show2 = true"></u-icon>
|
||||
</view>
|
||||
<u-picker mode="region" :show="show2" :closeOnClickOverlay="true" @close="show2 = false"
|
||||
:columns="[Classcolumns]" v-model="form.business" @confirm="tradeConfirm"></u-picker>
|
||||
<u-picker mode="region" :show="show2" :closeOnClickOverlay="true" @close="show2 = false" ref="uPicker"
|
||||
:columns="[Classcolumns]" v-model="form.business" @confirm="tradeConfirm" @change="changeHandler"></u-picker>
|
||||
</u-form-item>
|
||||
<!-- <u-form-item label="业态" label-position="top" border-bottom="true" label-width="auto" prop="commercial">
|
||||
<text @click="chooseCommercial" class="checkedtext" v-if="form.commercial.length>0">{{form.commercial}}</text>
|
||||
@@ -303,16 +303,35 @@
|
||||
}
|
||||
})
|
||||
},
|
||||
tradeConfirm(e) {
|
||||
this.show2 = false
|
||||
this.form.business = e.value[0]
|
||||
this.ClassCheckId = this.pid[e.indexs[0]]
|
||||
changeHandler(e) {
|
||||
const {
|
||||
columnIndex,
|
||||
value,
|
||||
values, // values为当前变化列的数组内容
|
||||
index,
|
||||
// 微信小程序无法将picker实例传出来,只能通过ref操作
|
||||
picker = this.$refs.uPicker
|
||||
} = e
|
||||
// 当第一列值发生变化时,变化第二列(后一列)对应的选项
|
||||
console.log(e);
|
||||
if (columnIndex === 0) {
|
||||
// picker为选择器this实例,变化第二列对应的选项
|
||||
this.ClassCheckId = this.pid[index]
|
||||
this.$api.getClassList(this.ClassCheckId).then(res => {
|
||||
// console.log(res);
|
||||
console.log(res);
|
||||
this.Karmacolumns = res.data.data.map((item) => {
|
||||
return item = item.name
|
||||
})
|
||||
picker.setColumnValues(1, this.Karmacolumns)
|
||||
})
|
||||
|
||||
}
|
||||
},
|
||||
tradeConfirm(e) {
|
||||
this.show2 = false
|
||||
this.form.business = e.value[0]
|
||||
this.form.commercial = e.value[1]
|
||||
|
||||
},
|
||||
karmaConfirm(e) {
|
||||
this.show3 = false
|
||||
@@ -384,9 +403,15 @@
|
||||
})
|
||||
this.pid = res.data.data.map((item) => {
|
||||
return item = item.id
|
||||
})
|
||||
|
||||
})
|
||||
this.$api.getClassList(9).then(res => {
|
||||
this.Karmacolumns = res.data.data.map((item) => {
|
||||
return item = item.name
|
||||
})
|
||||
this.$refs.uPicker.setColumnValues(1,this.Karmacolumns)
|
||||
})
|
||||
})
|
||||
},
|
||||
computed: {
|
||||
isChecked(index) {
|
||||
|
||||
@@ -29,22 +29,13 @@
|
||||
</u-form-item>
|
||||
<u-form-item label="行业" label-position="top" border-bottom="true" class="picker" label-width="auto"
|
||||
prop="business">
|
||||
<text @click="show2 = true" class="checkedtext" v-if="form.business">{{form.business}}</text>
|
||||
<text @click="show2 = true" class="checktext" v-else>请选择店铺行业</text>
|
||||
<text @click="show2 = true" class="checkedtext" v-if="form.business">{{form.business}}-{{form.commercial}}</text>
|
||||
<text @click="show2 = true" class="checktext" v-else>请选择店铺行业与业态</text>
|
||||
<view class="arrow-icon">
|
||||
<u-icon name="arrow-right" size="30px" @click="show2 = true"></u-icon>
|
||||
</view>
|
||||
<u-picker mode="region" :show="show2" :closeOnClickOverlay="true" @close="show2 = false"
|
||||
:columns="[Classcolumns]" v-model="form.business" @confirm="tradeConfirm"></u-picker>
|
||||
</u-form-item>
|
||||
<u-form-item label="业态" label-position="top" border-bottom="true" label-width="auto" prop="commercial">
|
||||
<text @click="chooseCommercial" class="checkedtext" v-if="form.commercial">{{form.commercial}}</text>
|
||||
<text @click="chooseCommercial" class="checktext" v-else>请选择店铺业态</text>
|
||||
<view class="arrow-icon">
|
||||
<u-icon name="arrow-right" size="30px" @click="chooseCommercial"></u-icon>
|
||||
</view>
|
||||
<u-picker mode="region" :show="show3" :closeOnClickOverlay="true" @close="show3 = false"
|
||||
:columns="[Karmacolumns]" v-model="form.commercial" @confirm="karmaConfirm"></u-picker>
|
||||
<u-picker mode="region" :show="show2" :closeOnClickOverlay="true" @close="show2 = false" ref="uPicker"
|
||||
:columns="[Classcolumns]" v-model="form.business" @confirm="tradeConfirm" @change="changeHandler"></u-picker>
|
||||
</u-form-item>
|
||||
<u-form-item label="面积" label-position="top" border-bottom="true" label-width="auto" prop="area">
|
||||
<u-input v-model="form.area" placeholder="请输入店铺面积" placeholder-class="input-class" border="none" type="number"></u-input>
|
||||
@@ -325,20 +316,38 @@
|
||||
}
|
||||
})
|
||||
},
|
||||
tradeConfirm(e) {
|
||||
this.show2 = false
|
||||
this.form.business = e.value[0]
|
||||
this.ClassCheckId = this.pid[e.indexs[0]]
|
||||
changeHandler(e) {
|
||||
const {
|
||||
columnIndex,
|
||||
value,
|
||||
values, // values为当前变化列的数组内容
|
||||
index,
|
||||
// 微信小程序无法将picker实例传出来,只能通过ref操作
|
||||
picker = this.$refs.uPicker
|
||||
} = e
|
||||
// 当第一列值发生变化时,变化第二列(后一列)对应的选项
|
||||
console.log(e);
|
||||
if (columnIndex === 0) {
|
||||
// picker为选择器this实例,变化第二列对应的选项
|
||||
this.ClassCheckId = this.pid[index]
|
||||
this.$api.getClassList(this.ClassCheckId).then(res => {
|
||||
// console.log(res);
|
||||
console.log(res);
|
||||
this.Karmacolumns = res.data.data.map((item) => {
|
||||
return item = item.name
|
||||
})
|
||||
picker.setColumnValues(1, this.Karmacolumns)
|
||||
})
|
||||
|
||||
}
|
||||
},
|
||||
tradeConfirm(e) {
|
||||
this.show2 = false
|
||||
this.form.business = e.value[0]
|
||||
this.form.commercial = e.value[1]
|
||||
},
|
||||
karmaConfirm(e) {
|
||||
this.show3 = false
|
||||
this.form.commercial = e.value[0]
|
||||
|
||||
},
|
||||
regionConfirm(e) {
|
||||
this.show1 = false
|
||||
@@ -407,8 +416,15 @@
|
||||
this.pid = res.data.data.map((item) => {
|
||||
return item = item.id
|
||||
})
|
||||
|
||||
this.$api.getClassList(9).then(res => {
|
||||
this.Karmacolumns = res.data.data.map((item) => {
|
||||
return item = item.name
|
||||
})
|
||||
this.$refs.uPicker.setColumnValues(1,this.Karmacolumns)
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
},
|
||||
computed: {
|
||||
isChecked(index) {
|
||||
|
||||
Reference in New Issue
Block a user