269 lines
12 KiB
Vue
269 lines
12 KiB
Vue
<!-- 深加工 -->
|
|
<template>
|
|
<view class="card">
|
|
<view class="title">粗加工</view>
|
|
<u--form labelPosition="left" :model="formData" :rules="rules" ref="breedingForm">
|
|
<u-form-item labelWidth="auto" label="是否在经营" required prop="shop_front" borderBottom>
|
|
<u-radio-group v-model="formData.shop_front" style="margin: 16rpx;">
|
|
<u-radio :customStyle="{marginRight: '16px'}"
|
|
v-for="(item, index) in [{value:1,label:'是'},{value:0,label:'否'}]" :key="index" :label="item.label"
|
|
:name="item.value">
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<block v-if="formData.shop_front">
|
|
<u-form-item labelWidth="auto" label="有无建设用地" required prop="shop_front" borderBottom>
|
|
<u-radio-group v-model="formData.shop_front" style="margin: 16rpx;">
|
|
<u-radio :customStyle="{marginRight: '16px'}"
|
|
v-for="(item, index) in [{value:1,label:'有'},{value:0,label:'无'}]" :key="index" :label="item.label"
|
|
:name="item.value">
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="面积" required prop="cultivated_area" borderBottom>
|
|
<u--input v-model="formData.cultivated_area" placeholder="请输入面积"></u--input>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="经营地点" required prop="cultivated_area" borderBottom>
|
|
<u--input v-model="formData.cultivated_area" placeholder="请输入经营地点"></u--input>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="材料来源" required prop="notes" borderBottom>
|
|
<u--input v-model="formData.cultivated_area" placeholder="请输入门面环境"></u--input>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="有无销售渠道" required prop="planting_company" borderBottom>
|
|
<u-radio-group v-model="formData.planting_company" style="margin: 16rpx;">
|
|
<u-radio :customStyle="{marginRight: '16px'}"
|
|
v-for="(item, index) in [{value:1,label:'有'},{value:0,label:'无'}]" :key="index" :label="item.label"
|
|
:name="item.value">
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="有无技术指导" required prop="planting_company" borderBottom>
|
|
<u-radio-group v-model="formData.planting_company" style="margin: 16rpx;">
|
|
<u-radio :customStyle="{marginRight: '16px'}"
|
|
v-for="(item, index) in [{value:1,label:'有'},{value:0,label:'无'}]" :key="index" :label="item.label"
|
|
:name="item.value">
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="有无品牌" required prop="planting_company" borderBottom>
|
|
<u-radio-group v-model="formData.planting_company" style="margin: 16rpx;">
|
|
<u-radio :customStyle="{marginRight: '16px'}"
|
|
v-for="(item, index) in [{value:1,label:'有'},{value:0,label:'无'}]" :key="index" :label="item.label"
|
|
:name="item.value">
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="有无宣传推广" required prop="planting_company" borderBottom>
|
|
<u-radio-group v-model="formData.planting_company" style="margin: 16rpx;">
|
|
<u-radio :customStyle="{marginRight: '16px'}"
|
|
v-for="(item, index) in [{value:1,label:'有'},{value:0,label:'无'}]" :key="index" :label="item.label"
|
|
:name="item.value">
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="有无运输" required prop="planting_company" borderBottom>
|
|
<u-radio-group v-model="formData.planting_company" style="margin: 16rpx;">
|
|
<u-radio :customStyle="{marginRight: '16px'}"
|
|
v-for="(item, index) in [{value:1,label:'有'},{value:0,label:'无'}]" :key="index" :label="item.label"
|
|
:name="item.value">
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" labelPosition="top" label="经营诉求" required prop="farm_tools" borderBottom>
|
|
<u--textarea v-model="formData.farm_tools" autoHeight placeholder="请输入经营诉求" border="surround"
|
|
count></u--textarea>
|
|
</u-form-item>
|
|
</block>
|
|
<block v-else>
|
|
<u-form-item labelWidth="auto" label="有无建设用地" required prop="shop_front" borderBottom>
|
|
<u-radio-group v-model="formData.shop_front" style="margin: 16rpx;">
|
|
<u-radio :customStyle="{marginRight: '16px'}"
|
|
v-for="(item, index) in [{value:1,label:'有'},{value:0,label:'无'}]" :key="index" :label="item.label"
|
|
:name="item.value">
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<picker :range="storeTypeList" mode="selector" @change="changeLanPlan">
|
|
<u-form-item labelWidth="auto" label="经营类型" required prop="planning" borderBottom>
|
|
<u--input :value="storeTypeList[formData.planning]" placeholder="请选择经营类型" disabled
|
|
disabledColor="#fff"></u--input>
|
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
|
</u-form-item>
|
|
</picker>
|
|
<u-form-item labelWidth="auto" label="经营地点" required prop="cultivated_area" borderBottom>
|
|
<u--input v-model="formData.cultivated_area" placeholder="请输入经营地点"></u--input>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="人数" required prop="cultivated_area" borderBottom>
|
|
<u--input v-model="formData.cultivated_area" placeholder="请输入经营地点"></u--input>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="有无食堂" required prop="planting_company" borderBottom>
|
|
<u-radio-group v-model="formData.planting_company" style="margin: 16rpx;">
|
|
<u-radio :customStyle="{marginRight: '16px'}"
|
|
v-for="(item, index) in [{value:1,label:'有'},{value:0,label:'无'}]" :key="index" :label="item.label"
|
|
:name="item.value">
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="材料来源" required prop="notes" borderBottom>
|
|
<u--input v-model="formData.cultivated_area" placeholder="请输入门面环境"></u--input>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="自动化办公程度" required prop="notes" borderBottom>
|
|
<u--input v-model="formData.cultivated_area" placeholder="请输入门面环境"></u--input>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="有无用工需求" required prop="planting_company" borderBottom>
|
|
<u-radio-group v-model="formData.planting_company" style="margin: 16rpx;">
|
|
<u-radio :customStyle="{marginRight: '16px'}"
|
|
v-for="(item, index) in [{value:1,label:'有'},{value:0,label:'无'}]" :key="index" :label="item.label"
|
|
:name="item.value">
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="有无品牌" required prop="planting_company" borderBottom>
|
|
<u-radio-group v-model="formData.planting_company" style="margin: 16rpx;">
|
|
<u-radio :customStyle="{marginRight: '16px'}"
|
|
v-for="(item, index) in [{value:1,label:'有'},{value:0,label:'无'}]" :key="index" :label="item.label"
|
|
:name="item.value">
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="有无宣传推广" required prop="planting_company" borderBottom>
|
|
<u-radio-group v-model="formData.planting_company" style="margin: 16rpx;">
|
|
<u-radio :customStyle="{marginRight: '16px'}"
|
|
v-for="(item, index) in [{value:1,label:'有'},{value:0,label:'无'}]" :key="index" :label="item.label"
|
|
:name="item.value">
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="库存情况" required prop="notes" borderBottom>
|
|
<u--input v-model="formData.cultivated_area" placeholder="请输入门面环境"></u--input>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="有无运输" required prop="planting_company" borderBottom>
|
|
<u-radio-group v-model="formData.planting_company" style="margin: 16rpx;">
|
|
<u-radio :customStyle="{marginRight: '16px'}"
|
|
v-for="(item, index) in [{value:1,label:'有'},{value:0,label:'无'}]" :key="index" :label="item.label"
|
|
:name="item.value">
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" labelPosition="top" label="经营诉求" required prop="farm_tools" borderBottom>
|
|
<u--textarea v-model="formData.farm_tools" autoHeight placeholder="请输入经营诉求" border="surround"
|
|
count></u--textarea>
|
|
</u-form-item>
|
|
</block>
|
|
</u--form>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
storeTypeList: ['超市', '生鲜', '饭店', '五金', '杂货', '服装', '文具', '其他'],
|
|
formData: {
|
|
shop_front: '', //有无门面
|
|
},
|
|
rules: {
|
|
|
|
}
|
|
}
|
|
},
|
|
created() {
|
|
this.initRules()
|
|
},
|
|
methods: {
|
|
// 初始化校验
|
|
initRules() {
|
|
let arr = Object.keys(this.formData);
|
|
arr.forEach(key => {
|
|
this.rules[key] = {
|
|
validator: (rule, value, callback) => {
|
|
this.$refs.breedingForm.clearValidate(rule.field);
|
|
value.trim() !== '' ? callback() : callback('不能为空');
|
|
},
|
|
trigger: ['change', 'blur']
|
|
}
|
|
})
|
|
},
|
|
// 校验
|
|
async validate() {
|
|
return await this.$refs.breedingForm.validate();;
|
|
},
|
|
// 选择土地规划
|
|
changeLanPlan(e) {
|
|
let index = e.currentTarget.dataset.index;
|
|
this.formData.planning = e.detail.value;
|
|
},
|
|
// 选择时间
|
|
changeDate(e) {
|
|
let data = e.currentTarget.dataset;
|
|
this.formData[data.value] = e.detail.value;
|
|
},
|
|
// 新增开设店铺
|
|
pushBreedingList() {
|
|
this.formData.push({})
|
|
},
|
|
// 删除开设店铺
|
|
removeBreedingList(index) {
|
|
uni.showModal({
|
|
confirmColor: '#f56c6c',
|
|
content: '确定删除吗?',
|
|
success: (res) => {
|
|
if (res.confirm) {
|
|
this.formData.splice(index, 1);
|
|
}
|
|
}
|
|
})
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.card{
|
|
background-color: #fff;
|
|
margin: 28rpx;
|
|
padding: 28rpx;
|
|
border-radius: 14rpx;
|
|
}
|
|
.title {
|
|
font-weight: 500;
|
|
font-size: 34rpx;
|
|
|
|
&::before {
|
|
width: 8rpx;
|
|
height: 26rpx;
|
|
border-radius: 4rpx;
|
|
background-color: #0122c7;
|
|
content: "";
|
|
display: inline-block;
|
|
margin-right: 8rpx;
|
|
}
|
|
}
|
|
|
|
.delete {
|
|
margin: 22rpx 0;
|
|
// margin-bottom: 40rpx;
|
|
width: 100%;
|
|
height: 64rpx;
|
|
line-height: 64rpx;
|
|
background: #f56c6c;
|
|
border-radius: 14rpx;
|
|
font-size: 28rpx;
|
|
color: #fff;
|
|
text-align: center;
|
|
}
|
|
|
|
.plus {
|
|
margin: 22rpx 0;
|
|
// margin-bottom: 40rpx;
|
|
width: 100%;
|
|
height: 64rpx;
|
|
line-height: 64rpx;
|
|
background: $theme-oa-color;
|
|
border-radius: 14rpx;
|
|
font-size: 28rpx;
|
|
color: #fff;
|
|
text-align: center;
|
|
}
|
|
</style> |