607 lines
18 KiB
Vue
607 lines
18 KiB
Vue
<template>
|
|
<view class="">
|
|
<!-- <view class="top_box">
|
|
<view class="item" :class="current==0?'active':''" @click="current=0">基本信息</view>
|
|
<view class="item" :class="current==1?'active':''" @click="current=1">商机信息</view>
|
|
</view> -->
|
|
<u-sticky bgColor="#fff">
|
|
<u-tabs :list="tabLists" style="background-color: #0022C7;" @click="changeCurrent" lineColor='white'
|
|
:scrollable="false" lineWidth='40' inactiveStyle='color:white' activeStyle="color:white"></u-tabs>
|
|
</u-sticky>
|
|
<u-skeleton :style="{'margin': skeleton?28+'rpx':0}" :loading="skeleton" :animate="true" title rows="6"
|
|
rows-width="100%" rowsHeight="56">
|
|
<u--form v-show="current==0" labelPosition="left" :model="formData" ref="archives">
|
|
|
|
<!-- <view class="card">
|
|
<view class="item">
|
|
<view class="title">基本信息</view>
|
|
<u-form-item labelWidth="auto" label="姓名" required prop="name" borderBottom>
|
|
<u--input v-model="formData.name" :readonly="readonly" placeholder="请输入姓名"></u--input>
|
|
</u-form-item>
|
|
<u-form-item label="性别" required prop="sex" borderBottom>
|
|
<u-radio-group v-model="formData.sex" :disabled="readonly" style="margin: 16rpx;">
|
|
<u-radio :customStyle="{marginRight: '16px'}"
|
|
v-for="(item, index) in [{value:1,label:'男'},{value:2,label:'女'}]" :key="index"
|
|
:label="item.label" :name="item.value">
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item label="年龄" required prop="age" borderBottom>
|
|
<u--input v-model="formData.age" :readonly="readonly" placeholder="请输入年龄"></u--input>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="身份证号" required prop="id_card" borderBottom>
|
|
<u--input v-model="formData.id_card" :readonly="readonly" placeholder="请输入身份证号"
|
|
type="idcard"></u--input>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="联系方式" required prop="phone" borderBottom>
|
|
<u--input v-model="formData.phone" :readonly="readonly" placeholder="请输入手机号"
|
|
type="number"></u--input>
|
|
</u-form-item>
|
|
</view>
|
|
</view>
|
|
<view class="card" style="margin-bottom: 0;">
|
|
<view class="item">
|
|
<view class="title">地区信息</view>
|
|
<u-form-item labelWidth="auto" label="地址" borderBottom>
|
|
<u--textarea :value="nowAddress" autoHeight readonly></u--textarea>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="小队" required prop="address" borderBottom>
|
|
<u--input v-model="formData.brigade_name" :readonly="readonly"
|
|
placeholder="请选择小队"></u--input>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="详细地址" required prop="address" borderBottom>
|
|
<u--input v-model="formData.address" :readonly="readonly" placeholder="请输入详细地址"></u--input>
|
|
</u-form-item>
|
|
<u-form-item labelWidth="auto" label="汽车是否能到家" required prop="highway" borderBottom>
|
|
<u-radio-group v-model="formData.highway" :disabled="readonly" 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 value="智能手机">
|
|
<u-form-item labelWidth="auto" label="是否使用智能手机" required prop="smart_phone" borderBottom>
|
|
<u-radio-group v-model="formData.smart_phone" :disabled="readonly"
|
|
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.smart_phone>0">
|
|
<u-form-item labelWidth="auto" label="微信号" required borderBottom>
|
|
<u--input v-model="formData.wechat" :readonly="readonly"
|
|
placeholder="请输入微信号"></u--input>
|
|
</u-form-item>
|
|
</block>
|
|
</block>
|
|
</view>
|
|
</view>
|
|
-->
|
|
<view class="personnel_list">
|
|
<view class="cards">
|
|
<view class="card_head">
|
|
<text>人员姓名: {{formData.name}}</text>
|
|
</view>
|
|
<view class="card_content">
|
|
<view class="right">
|
|
<view class="">
|
|
<text>性别 :</text>
|
|
<text> {{formData.sex==1?'男':'女'}}</text>
|
|
</view>
|
|
<view class="">
|
|
<text>年龄 :</text>
|
|
<text>{{formData.age}}</text>
|
|
</view>
|
|
<view class="">
|
|
<text>联系方式 :</text>
|
|
<text>{{formData.phone}}</text>
|
|
</view>
|
|
<view class="">
|
|
<text>身份证号 :</text>
|
|
<text>{{formData.id_card}}</text>
|
|
</view>
|
|
<view class="hr">
|
|
</view>
|
|
<view class="">
|
|
<text>居住地址 :</text>
|
|
<text>{{nowAddress}}</text>
|
|
</view>
|
|
<view class="">
|
|
<text>详细地址 :</text>
|
|
<text>{{formData.address}}</text>
|
|
</view>
|
|
<view class="check_view">
|
|
<text>汽车是否到家 :</text>
|
|
<u-radio-group v-model="formData.highway" :disabled="readonly"
|
|
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>
|
|
</view>
|
|
<view class="check_view">
|
|
<text>是否使用智能手机 :</text>
|
|
<u-radio-group v-model="formData.smart_phone" :disabled="readonly"
|
|
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>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
<view class="cards" v-for="(item, index) in formData.family" :key="'user'+index">
|
|
<view class="card_head">
|
|
<text>常住人口</text>
|
|
</view>
|
|
<view class="card_content">
|
|
<view class="right">
|
|
<view class="">
|
|
<text>姓名 :</text>
|
|
<text> {{item.name}}</text>
|
|
</view>
|
|
<view class="">
|
|
<text>出生日期 :</text>
|
|
<text>{{item.birth_time}}</text>
|
|
</view>
|
|
<view class="">
|
|
<text>就业情况 :</text>
|
|
<text>{{formData.phone}}</text>
|
|
</view>
|
|
<view class="">
|
|
<text>技能特长 :</text>
|
|
<text>{{item.skills}}</text>
|
|
</view>
|
|
<view class="check_view">
|
|
<text>是否存在学生、婴幼儿 :</text>
|
|
<u-radio-group v-model="formData.child" :disabled="readonly" 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>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<view class="cards" v-if="formData.child>0" v-for="(item,index) in formData.child_arr"
|
|
:key="'child'+index">
|
|
<view class="card_head">
|
|
<text>婴幼儿信息</text>
|
|
</view>
|
|
<view class="card_content" v-if='item.age>4'>
|
|
<view class="right">
|
|
<view class="">
|
|
<text>年龄 :</text>
|
|
<text>{{item.age}}</text>
|
|
</view>
|
|
<view class="check_view">
|
|
<text>年级 :</text>
|
|
<text>{{item.grade}}</text>
|
|
</view>
|
|
<view class="check_view">
|
|
<text>是否补课 :</text>
|
|
<u-radio-group v-model="item.is_lesson" style="margin: 16rpx;" :disabled="readonly">
|
|
<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>
|
|
</view>
|
|
<view class="check_view">
|
|
<text>补课内容 :</text>
|
|
<text>{{item.lessons || 0}}</text>
|
|
</view>
|
|
<view class="check_view">
|
|
<text>备注 :</text>
|
|
<text>{{item.notes}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="card_content" v-else>
|
|
<view class="right">
|
|
<view class="">
|
|
<text>年龄 :</text>
|
|
<text>{{item.age}}</text>
|
|
</view>
|
|
|
|
<view class="check_view">
|
|
<text>喂养方式 {{item.feeding}} :</text>
|
|
<u-radio-group v-model="item.feeding" :disabled="readonly" 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>
|
|
</view>
|
|
<view class="check_view">
|
|
<text>备注 :</text>
|
|
<text>{{item.notes}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</u--form>
|
|
<!-- <residents v-show="current==0" ref="residentsRef" :readonly="true" :datas="formData"></residents> -->
|
|
<view v-show="current==1">
|
|
<block v-for="(item, index) in formData.datas" :key="'demand'+index+item.id">
|
|
<!-- <view class="update_time">
|
|
<view>更新时间:{{item.update_time}}</view>
|
|
<view class="right">{{updateTo(item.update_time)}}</view>
|
|
</view> -->
|
|
<block>
|
|
<breeding v-if="item.id==32" ref="demandRef32" :update_time="item.update_time"
|
|
:datas="item.datas" :readonly="true"></breeding>
|
|
<plant v-if="item.id==7" ref="demandRef7" :update_time="item.update_time" :datas="item.datas"
|
|
:readonly="true"></plant>
|
|
<store v-if="item.id==8" ref="demandRef8" :update_time="item.update_time" :datas="item.datas"
|
|
:readonly="true"></store>
|
|
<deepProcessing v-if="item.id==9" ref="demandRef9" :datas="item.datas" :readonly="true">
|
|
</deepProcessing>
|
|
<thickProcessing v-if="item.id==10" ref="demandRef10" :datas="item.datas" :readonly="true">
|
|
</thickProcessing>
|
|
</block>
|
|
<block>
|
|
<houseRepair v-if="item.id==12" ref="demandRef12" :datas="item.datas" :readonly="true">
|
|
</houseRepair>
|
|
<houseDecoration v-if="item.id==13" ref="demandRef13" :datas="item.datas" :readonly="true">
|
|
</houseDecoration>
|
|
<houseRenovate v-if="item.id==14" ref="demandRef14" :datas="item.datas" :readonly="true">
|
|
</houseRenovate>
|
|
<houseTransaction v-if="item.id==15" ref="demandRef15" :datas="item.datas" :readonly="true">
|
|
</houseTransaction>
|
|
</block>
|
|
<block>
|
|
<banquetMarry v-if="item.id==17" ref="demandRef17" :datas="item.datas" :readonly="true">
|
|
</banquetMarry>
|
|
<banquetBirthday v-if="item.id==18" ref="demandRef18" :datas="item.datas" :readonly="true">
|
|
</banquetBirthday>
|
|
<banquetFullMoon v-if="item.id==19" ref="demandRef19" :datas="item.datas" :readonly="true">
|
|
</banquetFullMoon>
|
|
<banquetOther v-if="item.id==20" ref="demandRef20" :datas="item.datas" :readonly="true">
|
|
</banquetOther>
|
|
<banquetFuneral v-if="item.id==21" ref="demandRef21" :datas="item.datas" :readonly="true">
|
|
</banquetFuneral>
|
|
</block>
|
|
</block>
|
|
<u-empty v-if="formData.datas.length==0" icon="/static/img/empty/data.png" text="没有数据"></u-empty>
|
|
</view>
|
|
</u-skeleton>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
Toast
|
|
} from "../../libs/uniApi"
|
|
import {
|
|
informationAdd,
|
|
informationDetails
|
|
} from "@/api/information.js"
|
|
import {
|
|
comonentList
|
|
} from '@/static/server/archives.js'
|
|
import {
|
|
getTimeAgo
|
|
} from "@/utils/time.js"
|
|
import districtSelector from "@/components/districtSelector/districtSelector.vue" //地区选择器
|
|
import residents from "@/components/newArchives/residents.vue" // 常住人口
|
|
import breeding from "@/components/newArchives/breeding.vue" // 种养殖
|
|
import plant from "@/components/newArchives/plant.vue" // 种养殖
|
|
import store from "@/components/newArchives/store.vue" // 开设店铺
|
|
import deepProcessing from "@/components/newArchives/deepProcessing.vue" // 深加工
|
|
import thickProcessing from "@/components/newArchives/thickProcessing.vue" // 粗加工
|
|
import houseRepair from "@/components/newArchives/houseRepair.vue" // 修房
|
|
import houseDecoration from "@/components/newArchives/houseDecoration.vue" // 装房
|
|
import houseRenovate from "@/components/newArchives/houseRenovate.vue" // 翻新
|
|
import houseTransaction from "@/components/newArchives/houseTransaction.vue" // 买卖房子
|
|
import banquetMarry from "@/components/newArchives/banquetMarry.vue" // 婚宴
|
|
import banquetBirthday from "@/components/newArchives/banquetBirthday.vue" // 寿宴
|
|
import banquetFullMoon from "@/components/newArchives/banquetFullMoon.vue" // 满月酒
|
|
import banquetOther from "@/components/newArchives/banquetOther.vue" // 其他庆祝宴
|
|
import banquetFuneral from "@/components/newArchives/banquetFuneral.vue" // 白事
|
|
export default {
|
|
components: {
|
|
districtSelector,
|
|
residents,
|
|
breeding,
|
|
plant,
|
|
store,
|
|
deepProcessing,
|
|
thickProcessing,
|
|
houseRepair,
|
|
houseDecoration,
|
|
houseRenovate,
|
|
houseTransaction,
|
|
banquetMarry,
|
|
banquetBirthday,
|
|
banquetFullMoon,
|
|
banquetOther,
|
|
banquetFuneral
|
|
},
|
|
data() {
|
|
return {
|
|
listMap: new Map(),
|
|
tabLists: [{
|
|
name: '基本信息',
|
|
}, {
|
|
name: '商机信息'
|
|
}],
|
|
skeleton: true,
|
|
readonly: true,
|
|
current: 0,
|
|
showDemandList: [],
|
|
formData: {
|
|
id_card: '',
|
|
sex: '',
|
|
name: '',
|
|
phone: '', //电话
|
|
highway: '', //汽车是否能到家
|
|
smart_phone: '', //是否使用智能手机
|
|
wechat: '', //微信号
|
|
address: '', //家庭地址
|
|
age: '', //年龄
|
|
category_id: 1,
|
|
category_child: 1,
|
|
data_type: '1',
|
|
datas: []
|
|
},
|
|
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.initInformationDetails({
|
|
id: options.id
|
|
});
|
|
this.initMap();
|
|
},
|
|
onShow() {},
|
|
computed: {
|
|
nowAddress() {
|
|
let address = this.$store.state.app.userInfo;
|
|
let str = '';
|
|
address.province_name ? str += address.province_name : null;
|
|
address.city_name ? str += address.city_name : null;
|
|
address.area_name ? str += address.area_name : null;
|
|
address.street_name ? str += address.street_name : null;
|
|
address.village_name ? str += address.village_name : null;
|
|
return str;
|
|
}
|
|
},
|
|
methods: {
|
|
initMap() {
|
|
comonentList.forEach(item => {
|
|
this.listMap.set(item.id, item.name);
|
|
})
|
|
},
|
|
async initInformationDetails(id) {
|
|
let res = await informationDetails(id);
|
|
this.$u.sleep(100).then(() => {
|
|
this.skeleton = false;
|
|
Object.keys(res.data).forEach(key => {
|
|
this.formData[key] = res.data[key];
|
|
})
|
|
})
|
|
},
|
|
toastShow() {
|
|
Toast('不可修改')
|
|
},
|
|
changeCurrent(e) {
|
|
this.current = e.index;
|
|
},
|
|
updateTo(time) {
|
|
return getTimeAgo(time)
|
|
}
|
|
},
|
|
onPullDownRefresh() {
|
|
uni.stopPullDownRefresh()
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.top_box {
|
|
background-color: #fff;
|
|
display: flex;
|
|
|
|
.item {
|
|
width: 175rpx;
|
|
height: 53rpx;
|
|
background: #F5F5F5FF;
|
|
color: #999999FF;
|
|
border-radius: 35rpx 35rpx 35rpx 35rpx;
|
|
opacity: 1;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin: 28rpx;
|
|
}
|
|
|
|
.active {
|
|
background: $theme-oa-color;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
.cards {
|
|
margin: 30rpx auto;
|
|
margin-bottom: 28rpx;
|
|
width: 694rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 30rpx;
|
|
opacity: 1;
|
|
overflow: hidden;
|
|
// box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);
|
|
|
|
.card_head {
|
|
padding: 28rpx;
|
|
background-color: $theme-oa-color;
|
|
color: white;
|
|
height: 100rpx;
|
|
|
|
}
|
|
|
|
.card_content {
|
|
padding: 28rpx;
|
|
display: flex;
|
|
// justify-content: space-between;
|
|
|
|
|
|
.right {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
|
|
view {
|
|
margin-bottom: 10rpx;
|
|
|
|
text:nth-child(2) {
|
|
margin-left: 20rpx;
|
|
}
|
|
}
|
|
|
|
.check_view {
|
|
|
|
display: flex;
|
|
line-height: 70rpx;
|
|
|
|
// align-items: center;
|
|
|
|
}
|
|
}
|
|
|
|
.hr {
|
|
border-top: 1px dashed $theme-oa-color;
|
|
// display: block;
|
|
width: 100%;
|
|
margin: 30rpx 0
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
.update_time {
|
|
padding: 32rpx 28rpx 0 28rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
|
|
.right {
|
|
color: $theme-oa-color;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.card {
|
|
background-color: #fff;
|
|
margin: 28rpx;
|
|
padding: 28rpx;
|
|
border-radius: 14rpx;
|
|
|
|
.item {
|
|
margin-top: 30rpx;
|
|
|
|
&:nth-child(1) {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.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;
|
|
}
|
|
}
|
|
}
|
|
|
|
.btn {
|
|
margin-top: 32rpx;
|
|
// margin-bottom: 40rpx;
|
|
width: 100%;
|
|
height: 84rpx;
|
|
background: $theme-oa-color;
|
|
border-radius: 42rpx 42rpx 42rpx 42rpx;
|
|
color: #fff;
|
|
line-height: 80rpx;
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
.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;
|
|
}
|
|
|
|
.demand {
|
|
margin-top: 40rpx;
|
|
margin-bottom: 50rpx;
|
|
}
|
|
</style> |