From 45fb4b11ad51bb38306765b11a6747402e382cee Mon Sep 17 00:00:00 2001 From: Helius <wangdoubleone@gmail.com> Date: Sat, 20 Feb 2021 17:37:33 +0800 Subject: [PATCH] fix --- hive-app/pages/workbench/followRecords/addRecord.vue | 211 +++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 175 insertions(+), 36 deletions(-) diff --git a/hive-app/pages/workbench/followRecords/addRecord.vue b/hive-app/pages/workbench/followRecords/addRecord.vue index a8a5d54..1be7028 100644 --- a/hive-app/pages/workbench/followRecords/addRecord.vue +++ b/hive-app/pages/workbench/followRecords/addRecord.vue @@ -1,61 +1,174 @@ <template> <view class="font-14 container"> <view class="content-row"> - <view> - <input placeholder="请填写跟进记录" placeholder-class="placeholder font-14"/> + <view class="input-group-cloume"> + <textarea v-model="formData.content" maxlength="300" placeholder="请填写跟进记录" placeholder-class='placeholder' /> </view> - <view class="mt-15"> - <view class="add-img"> - <text class="iconfont iconxiangji gray icon"></text> + <view class="img-wrap"> + <image v-for="(item, index) in formData.albums" :src="item.img" @click="editImg(index)"></image> + <view class="add-img" @click="showUploadImage"> + <text class="iconfont iconxiangji"></text> </view> </view> </view> - <view class="content-row flex align-center justify-between"> - <text>客户</text> - <navigator url="../../member/selectCustomer" hover-class="none" class="gray flex align-center"> - <text>刘亦菲</text> + <view class="input-group-row"> + <text class="label">客户</text> + <navigator url="../../member/selectCustomer" hover-class="none" class="gray right-text"> + <text>{{formData.vipName || '请选择'}}</text> <text class="iconfont iconarrow-backimg"></text> </navigator> </view> - <view class="content-row flex align-center justify-between"> - <text>相关订单</text> - <navigator url="../../member/selectCustomer" hover-class="none" class="gray flex align-center"> - <text>水光面膜等三件产品</text> + <view class="input-group-row"> + <text class="label">相关订单</text> + <navigator url="./orderList" hover-class="none" class="gray right-text flex align-center justify-end"> + <text class="ellipsis" v-if="formData.orderId">{{orderName}}</text> + <text class="ellipsis" v-else-if="formData.serviceId">{{serviceName}}</text> + <text v-else>请选择</text> <text class="iconfont iconarrow-backimg"></text> </navigator> </view> - <view class="content-row flex align-center justify-between"> - <text>下次跟进提醒</text> - <picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange"> - <view class="gray flex align-center"> - <text>请选择</text> - <text class="iconfont iconarrow-backimg"></text> - </view> - </picker> + <view class="input-group-row"> + <text class="label">下次跟进提醒</text> + <view class="right-text gray"> + <text @click="showTime()">{{formData.nextNotifyTime || '请选择'}}</text> + <text class="iconfont iconarrow-backimg"></text> + </view> </view> - <view class="content-row flex align-center justify-between"> - <text>设置可见范围</text> - <view> - <radio-group name="privacy" @change="privacyChange"> - <label class="mr-20"><radio value="公共" color="#518EFF" class="radio" :checked="sex==='公共'"/>公开</label> - <label><radio value="私人" color="#518EFF" class="radio" :checked="sex==='私人'"/>仅自己可见</label> + <view class="input-group-row"> + <text class="label">设置可见范围</text> + <view class="right-text"> + <radio-group name="visible" @change="privacyChange"> + <label><radio value="1" color="#518EFF" class="radio" :checked="formData.visible==1"/>公开</label> + <label><radio value="2" color="#518EFF" class="radio" :checked="formData.visible==2"/>仅自己可见</label> </radio-group> </view> </view> - <button class="blue-btn sticky-footer">提交跟进</button> + <button class="blue-btn sticky-footer" :disabled="isDisabled" @click="submit">提交跟进</button> + <date-time-picker ref='date-time' :startDate="startDate" type='datetime' @change='dateTimeChange'></date-time-picker> </view> </template> <script> + import imageUploadUtils from '../../../common/jssdk/uploadImg.js' + import DateTimePicker from '../../../components/bory-dateTimePicker/bory-dateTimePicker.vue' export default{ + components:{ + DateTimePicker + }, data(){ return{ - privacy: '私人', + formData: { + content: '', + nextNotifyTime: '', + visible: 1, + vipId: '', + vipName: '', + orderId: '', + serviceId: '', + albums: [] + }, + orderName: '', + serviceName:'', + isDisabled: false } }, + computed:{ + startDate(){ + return this.$utils.formmatTime('YY-mm-dd') + } + }, + onLoad() { + uni.$on('orderChange', (data) => { + // type: 0 订单, 1服务单 + if(data.type==0){ + this.formData.orderId = data.id; + this.formData.serviceId = ''; + this.loadOrderDetail(); + }else{ + this.formData.serviceId = data.id; + this.formData.orderId = ''; + this.loadServiceOrderDetail(); + } + this.formData.vipName = data.vipName; + this.formData.vipId = data.vipId; + }) + }, methods:{ + showTime () { + this.$refs['date-time'].show(); + }, + dateTimeChange(val) { + this.formData.nextNotifyTime = val; + }, privacyChange(e){ - this.privacy = e.detail.value; + this.formData.visible = e.detail.value; + }, + setData(selectItem){ + let data = selectItem[0]; + this.formData.vipId = data.id; + this.formData.vipName = data.vipName; + }, + // 图片上传 + showUploadImage(){ + if(this.formData.albums.length >= 9){ + this.$toast.info('最多只能上传9张图片'); + return; + } + imageUploadUtils.show((res) => { + this.formData.albums.push({img: res}); + }) + }, + // 图片编辑 + editImg(index){ + imageUploadUtils.show((res) => { + this.formData.albums[index].img = res; + }) + }, + loadOrderDetail(){ + this.$httpUtils.request('/api/order/findOrderDetail/'+this.formData.orderId).then((res) => { + if(res.status == 200){ + let result = res.mapInfo.orderDetail; + this.orderName = result.items.length?result.items[0].goodsName:''; + } + }) + }, + loadServiceOrderDetail(){ + this.$httpUtils.request('/api/serviceOrder/findServiceOrderDetail/'+this.formData.serviceId).then((res) => { + if(res.status == 200){ + let result = res.mapInfo.detail; + this.serviceName = result.items.length?result.items[0].name:''; + } + }) + }, + valid(){ + const {content, vipId, orderId, serviceId} = this.formData; + if(!content){ + this.$toast.info('请填写跟进记录'); + return false + } + if(!vipId){ + this.$toast.info('请选择客户'); + return false + } + if(!orderId && !serviceId){ + this.$toast.info('请选择相关订单'); + return false + } + }, + submit(){ + if(this.valid() === false){ + return; + } + this.isDisabled = true; + this.$httpUtils.request('/api/followup/addFollowup', this.formData, 'POST').then((res) => { + if(res.status == 200){ + uni.navigateBack() + } + this.$toast.info(res.info) + this.isDisabled = false + }).catch((err) => { + this.isDisabled = false + }) } } } @@ -69,16 +182,42 @@ border-bottom: 1px solid #EDEAF4; padding: 15px 0; } + + .input-group-cloume uni-textarea{ + border: 0; + height: 58px; + padding: 0; + } + .ellipsis{ + max-width: 200px; + overflow: hidden; + text-overflow:ellipsis; + white-space: nowrap; + } + .img-wrap{ + display: flex; + flex-wrap: wrap; + margin-left: -5px; + margin-right: -5px; + } + .img-wrap image{ + width: 50px; + height: 50px; + margin: 5px; + } .add-img{ - width: 40px; - height: 40px; - border: 1px solid #EDEAF4; - padding: 10px; display: flex; align-items: center; justify-content: center; + width: 50px; + height: 50px; + color: #a5abaf; + border: 1px solid #EDEAF4; + border-radius: 2px; + box-sizing: border-box; + margin: 5px; } - .icon{ - font-size: 30px; + .add-img .iconfont{ + font-size: 22px; } </style> -- Gitblit v1.9.1