|
|
@@ -2,29 +2,114 @@
|
|
|
<view class="idonate">
|
|
|
<view class="one" v-show="limit === 1">
|
|
|
<view class="item">
|
|
|
- 捐赠个体<text>*</text>
|
|
|
+ <view class="item-tit">捐赠个体<text>*</text></view>
|
|
|
<radio-group @change="typeChange" class="check-box">
|
|
|
<label v-for="(item, index) in items" :key="item.value">
|
|
|
<radio :value="item.iid" :checked="index === type" color="#f3392c" style="transform:scale(0.7)" />
|
|
|
- <text>{{ item.value }}</text>
|
|
|
+ <text style="color: #000000;">{{ item.value }}</text>
|
|
|
</label>
|
|
|
</radio-group>
|
|
|
</view>
|
|
|
+ <template v-if="type === 0">
|
|
|
+ <view class="item">
|
|
|
+ <view class="item-tit">捐赠单位<text>*</text></view>
|
|
|
+ <input type="text" :value="unit" placeholder="请填写捐赠单位"/>
|
|
|
+ </view>
|
|
|
+ <view class="item">
|
|
|
+ <view class="item-tit">单位联系人<text>*</text></view>
|
|
|
+ <input type="text" :value="dwPeople" placeholder="请填写捐赠方联系人"/>
|
|
|
+ </view>
|
|
|
+ <view class="item">
|
|
|
+ <view class="item-tit">单位电话<text>*</text></view>
|
|
|
+ <input type="text" :value="dwPhone" placeholder="请填写单位联系方式"/>
|
|
|
+ </view>
|
|
|
+ <view class="item">
|
|
|
+ <view class="item-tit">企业信用代码</view>
|
|
|
+ <input type="text" :value="qyxydm" placeholder="请填写单位的企业信用代码"/>
|
|
|
+ </view>
|
|
|
+ </template>
|
|
|
+ <template v-if="type === 1">
|
|
|
+ <view class="item">
|
|
|
+ <view class="item-tit">姓名<text>*</text></view>
|
|
|
+ <input type="text" :value="unit" placeholder="请填写您的姓名"/>
|
|
|
+ </view>
|
|
|
+ <view class="item">
|
|
|
+ <view class="item-tit">联系方式<text>*</text></view>
|
|
|
+ <input type="text" :value="unit" placeholder="请填写您的联系方式"/>
|
|
|
+ </view>
|
|
|
+ <view class="item">
|
|
|
+ <view class="item-tit">身份证号</view>
|
|
|
+ <input type="text" :value="unit" placeholder="请填写您的身份证号"/>
|
|
|
+ </view>
|
|
|
+ </template>
|
|
|
<view class="item">
|
|
|
- 捐赠单位<text>*</text>
|
|
|
- <input type="text" :value="unit" placeholder="请填写捐赠单位"/>
|
|
|
+ <view class="item-tit">是否匿名</view>
|
|
|
+ <radio-group @change="anonymousChange" class="check-box">
|
|
|
+ <label>
|
|
|
+ <radio value="1" :checked="IsAnonymous" color="#f3392c" style="transform:scale(0.7)" />
|
|
|
+ <text style="color: #000000;">是</text>
|
|
|
+ </label>
|
|
|
+ <label>
|
|
|
+ <radio value="0" :checked="!IsAnonymous" color="#f3392c" style="transform:scale(0.7)" />
|
|
|
+ <text style="color: #000000;">否</text>
|
|
|
+ </label>
|
|
|
+ </radio-group>
|
|
|
</view>
|
|
|
<view class="item">
|
|
|
- 单位联系人 <text>*</text>
|
|
|
- <input type="text" :value="people" placeholder="请填写捐赠方联系人"/>
|
|
|
+ <view class="item-tit">物流方式</view>
|
|
|
+ <picker @change="bindLogChange" :range="logs">
|
|
|
+ <view class="log select" :class="{'action': log }">{{ log || '请选择物流方式' }}</view>
|
|
|
+ </picker>
|
|
|
</view>
|
|
|
- <view class="item">
|
|
|
- 单位电话 <text>*</text>
|
|
|
- <input type="text" :value="people" placeholder="请填写单位联系方式"/>
|
|
|
+ <view class="item no-border-b">
|
|
|
+ <view class="item-tit">开具发票<text>*</text></view>
|
|
|
+ <radio-group @change="openChange" class="check-box">
|
|
|
+ <label>
|
|
|
+ <radio value="1" :checked="Isopen" color="#f3392c" style="transform:scale(0.7)" />
|
|
|
+ <text style="color: #000000;">是</text>
|
|
|
+ </label>
|
|
|
+ <label>
|
|
|
+ <radio value="0" :checked="!Isopen" color="#f3392c" style="transform:scale(0.7)" />
|
|
|
+ <text style="color: #000000;">否</text>
|
|
|
+ </label>
|
|
|
+ </radio-group>
|
|
|
+ </view>
|
|
|
+ <view class="mask">
|
|
|
+ <textarea :value="mask" placeholder="如果有备注请填写"/>
|
|
|
+ </view>
|
|
|
+ <view class="bbtm">
|
|
|
+
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="tow" v-show="limit === 2">
|
|
|
-
|
|
|
+ <view class="t-item">
|
|
|
+ <view class="t-tit">
|
|
|
+ 实物照片(必填)
|
|
|
+ </view>
|
|
|
+ <image src="" mode="" v-if="!cardimg1" @click.stop="imgsub('cardimg1')"></image>
|
|
|
+ <image :src="cardimg1" mode="" v-if="cardimg1" @click.stop="imgsub('cardimg1')"></image>
|
|
|
+ </view>
|
|
|
+ <view class="t-item">
|
|
|
+ <view class="t-tit">
|
|
|
+ 营业执照(必填)
|
|
|
+ </view>
|
|
|
+ <image src="" mode="" v-if="!cardimg2" @click.stop="imgsub('cardimg2')"></image>
|
|
|
+ <image :src="cardimg2" mode="" v-if="cardimg2" @click.stop="imgsub('cardimg2')"></image>
|
|
|
+ </view>
|
|
|
+ <view class="t-item">
|
|
|
+ <view class="t-tit">
|
|
|
+ 质量合格书(必填)
|
|
|
+ </view>
|
|
|
+ <image src="" mode="" v-if="!cardimg3" @click.stop="imgsub('cardimg3')"></image>
|
|
|
+ <image :src="cardimg3" mode="" v-if="cardimg3" @click.stop="imgsub('cardimg3')"></image>
|
|
|
+ </view>
|
|
|
+ <view class="t-item">
|
|
|
+ <view class="t-tit">
|
|
|
+ 价值凭证
|
|
|
+ </view>
|
|
|
+ <image src="" mode="" v-if="!cardimg4" @click.stop="imgsub('cardimg4')"></image>
|
|
|
+ <image :src="cardimg4" mode="" v-if="cardimg4" @click.stop="imgsub('cardimg4')"></image>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<view class="jg">
|
|
|
|
|
|
@@ -44,6 +129,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+ import { upload } from '@/api/ask.js';
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
@@ -57,36 +143,85 @@
|
|
|
iid: '1'
|
|
|
}
|
|
|
],
|
|
|
+ IsAnonymous: false,
|
|
|
limit: 1,
|
|
|
type: 0,//捐赠个体 1位个人 0为团体（企业）
|
|
|
unit: '',//捐赠单位
|
|
|
- people: '',//捐赠方联系人或姓名
|
|
|
- phone: '',//单位电话或联系电话
|
|
|
+ dwPeople: '',//捐赠方联系人
|
|
|
+ dwPhone: '',//单位电话
|
|
|
+ log: '',//物流方式
|
|
|
+ logs: ['顺丰','邮政'],
|
|
|
+ Isopen: false,//是否开具发票
|
|
|
+ mask: '',//备注
|
|
|
+ qyxydm: '',//企业信用代码
|
|
|
+ name: '',// 捐赠人姓名
|
|
|
+ phone: '',//捐赠人联系方式
|
|
|
+ identityNumber: '',//身份证号
|
|
|
+ cardimg1: '',//实物照片
|
|
|
+ cardimg2: '',//营业执照
|
|
|
+ cardimg3: '',//质量合格书(必填)
|
|
|
+ cardimg4: '',//价值凭证
|
|
|
+
|
|
|
}
|
|
|
},
|
|
|
onLoad(ops) {
|
|
|
- if(ops) {
|
|
|
+ if(ops.type) {
|
|
|
this.type = ops.type*1
|
|
|
- console.log(this.type)
|
|
|
+ console.log(this.type,'++++++++')
|
|
|
}
|
|
|
|
|
|
},
|
|
|
methods: {
|
|
|
+ //下一页
|
|
|
nextLimit() {
|
|
|
this.limit = 2
|
|
|
},
|
|
|
+ //下一页
|
|
|
prevLimit() {
|
|
|
this.limit = 1
|
|
|
},
|
|
|
- typeChange(evt) {
|
|
|
- console.log(evt)
|
|
|
- this.type = evt.detail.value.
|
|
|
+ //选择捐赠是个人或团体
|
|
|
+ typeChange(e) {
|
|
|
+ this.type = e.detail.value*1
|
|
|
+ console.log(this.type)
|
|
|
+ },
|
|
|
+ //选择是否匿名
|
|
|
+ anonymousChange(e) {
|
|
|
+ if(e.detail.value !== '1') {
|
|
|
+ this.IsAnonymous = false
|
|
|
+ }else {
|
|
|
+ this.IsAnonymous = true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //选择物流方式
|
|
|
+ bindLogChange(e) {
|
|
|
+ this.log = this.logs[e.detail.value*1]
|
|
|
+ },
|
|
|
+ //
|
|
|
+ openChange(e) {
|
|
|
+ if(e.detail.value !== '1') {
|
|
|
+ this.Isopen = false
|
|
|
+ }else {
|
|
|
+ this.Isopen = true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ imgsub(e) {
|
|
|
+ upload({
|
|
|
+ filename: ''
|
|
|
+ }).then(data => {
|
|
|
+ this[e] = data[0].url;
|
|
|
+ });
|
|
|
}
|
|
|
+
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
+ page {
|
|
|
+ height: 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
.idonate {
|
|
|
padding: 0 30rpx;
|
|
|
margin-top: 20rpx;
|
|
|
@@ -136,30 +271,6 @@
|
|
|
line-height: 70rpx;
|
|
|
}
|
|
|
}
|
|
|
- // .check-protocol uni-checkbox .uni-checkbox-input{
|
|
|
- // width: 25rpx;
|
|
|
- // height: 25rpx;
|
|
|
- // border-radius: 0;
|
|
|
- // border: 1rpx solid #C1C1C1;
|
|
|
- // }
|
|
|
- // /* 选中后的 背景样式 */
|
|
|
- // .check-protocol uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked{
|
|
|
- // position: relative;
|
|
|
- // border: 1rpx solid #C1C1C1;
|
|
|
- // width: 25rpx;
|
|
|
- // height: 25rpx;
|
|
|
- // }
|
|
|
- // /* 选中后的*/
|
|
|
- // .check-protocol uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked::before{
|
|
|
- // position: absolute;
|
|
|
- // left: 50%;
|
|
|
- // top: 50%;
|
|
|
- // content: '';
|
|
|
- // width: 19rpx!important;
|
|
|
- // height: 19rpx!important;;
|
|
|
- // background-color: #3AAF4A;
|
|
|
- // transform: translate(-50%,-50%);
|
|
|
- // }
|
|
|
.item {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
@@ -169,10 +280,75 @@
|
|
|
font-family: PingFang SC;
|
|
|
font-weight: 500;
|
|
|
color: #222222;
|
|
|
+ line-height: 102rpx;
|
|
|
+ .item-tit {
|
|
|
+ flex-shrink: 0;
|
|
|
+ display: inline-block;
|
|
|
+ width: 200rpx;
|
|
|
+ }
|
|
|
+ text {
|
|
|
+ color: #F3392C;
|
|
|
+ }
|
|
|
+ input {
|
|
|
+ display: inline-block;
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ .log {
|
|
|
+ // display: inline-block;
|
|
|
+ width: 400rpx;
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+ .select {
|
|
|
+ color: #000;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ .mask {
|
|
|
+ padding-left: 202rpx;
|
|
|
+ textarea {
|
|
|
+ width: 396rpx;
|
|
|
+ height: 166rpx;
|
|
|
+ border: 1rpx solid #ccc;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #000;
|
|
|
+ line-height: 24rpx;
|
|
|
+ padding: 24rpx 16rpx;
|
|
|
+ }
|
|
|
}
|
|
|
.check-box {
|
|
|
-
|
|
|
+ flex-grow: 0;
|
|
|
display: flex;
|
|
|
display: inline-block;
|
|
|
+ }
|
|
|
+ .no-border-b {
|
|
|
+ border-bottom: none;
|
|
|
+ }
|
|
|
+ .bbtm {
|
|
|
+ margin-top: 40rpx;
|
|
|
+ width: 689rpx;
|
|
|
+ height: 1rpx;
|
|
|
+ background: #ECECEC;
|
|
|
+ }
|
|
|
+ .t-item {
|
|
|
+ padding: 35rpx 0;
|
|
|
+ border-bottom: 1px #ECECEC solid;
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #222222;
|
|
|
+ &:last-of-type {
|
|
|
+ border-bottom: none;
|
|
|
+ }
|
|
|
+ image {
|
|
|
+ display: block;
|
|
|
+ width: 160rpx;
|
|
|
+ height: 160rpx;
|
|
|
+ background: red;
|
|
|
+ border-radius: 5rpx;
|
|
|
+ margin: 0 auto;
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
