|
|
@@ -0,0 +1,587 @@
|
|
|
+<template>
|
|
|
+ <view class="container logistics" :style="{paddingBottom :isIphoneX ? (236+68)+'rpx' : '236rpx'}" v-if="isChange">
|
|
|
+ <view class="logistics-list" v-for="(item,index) in logisticsList" :key="index">
|
|
|
+ <view class="item-title">
|
|
|
+ <view class="title-left">物流{{index+1}}</view>
|
|
|
+ <view class="title-right" v-if="(index+1) > 1" @click="deleteLogistItemFn(item,index)">
|
|
|
+ <text class="iconfont icon-shanchu" ></text>删除
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="item-main">
|
|
|
+ <view class="item-main-cell" @click.stop="pageNavigateTo(index)">
|
|
|
+ <input class="input" type="text" v-model="item.label" placeholder="物流公司" disabled="true">
|
|
|
+ <text class="iconfont icon-xiayibu"></text>
|
|
|
+ </view>
|
|
|
+ <view class="item-main-cell">
|
|
|
+ <input class="input" type="text" v-model="item.number" placeholder="物流单号">
|
|
|
+ </view>
|
|
|
+ <view class="item-main-cell none" @click.stop="AddScanCode(item)" >
|
|
|
+ <text class="iconfont icon-icon-test" ></text><text>扫码录入</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="logistics-btn">
|
|
|
+ <view class="btn add-btn" @click="addListFn">添加物流</view>
|
|
|
+ </view>
|
|
|
+ <view class="logistics-btn-fiexd" :style="{paddingBottom :isIphoneX ? '68rpx' : '34rpx'}">
|
|
|
+ <view class="btn-tips" @click.stop="showShowRemarksFn">
|
|
|
+ <text class="iconfont icon-xiangxiajiantou" v-if="isShowRemarks"></text>
|
|
|
+ <text class="iconfont icon-xiangshangjiantou" v-else></text>
|
|
|
+ 添加备注
|
|
|
+ </view>
|
|
|
+ <view class="logistics-remarks" :class="specClass" v-show="isShowRemarks">
|
|
|
+ <view class="label">拍照备注</view>
|
|
|
+ <view class="remarks-photo clearfix">
|
|
|
+ <view class="photo-item" v-for="(item, index) in photoLists" :key="index">
|
|
|
+ <image :src="item" mode="aspectFill" @click.stop="previewImg(index)"></image>
|
|
|
+ <text class="iconfont icon-iconfontguanbi" @click.stop="deletePhotoFn(index)"></text>
|
|
|
+ </view>
|
|
|
+ <view class="photo-item add" @click.stop="uploadPhotoFn" v-if="photoLists.length<10 || photoLists.length == 0">
|
|
|
+ <text class="iconfont icon-jiahao"></text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="label">文字备注</view>
|
|
|
+ <view class="remarks-textarea">
|
|
|
+ <textarea class="textarea" v-model="info.note" value="" placeholder="文字备注，200字以内" maxlength="200" @input="conInput"/>
|
|
|
+ <text class="limit-text"><text class="red">{{min}}</text>/{{max}}</text>
|
|
|
+ </view>
|
|
|
+ <view class="remarks-tips">请备注快递单、发货现场和货物的照片，最多10张</view>
|
|
|
+ </view>
|
|
|
+ <view class="btn confim-btn" @click="confirmDeliverFn">确认发货</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import { mapState,mapMutations } from 'vuex'
|
|
|
+ import authorize from '@/common/config/authorize.js'
|
|
|
+ import { uploadFileImage } from "@/services/public.js"
|
|
|
+ var isPreviewImg;
|
|
|
+ export default{
|
|
|
+ data() {
|
|
|
+ return{
|
|
|
+ logisticsBatchId:'',
|
|
|
+ isIphoneX:this.$store.state.isIphoneX,
|
|
|
+ isChange:true,
|
|
|
+ isShowRemarks:false,
|
|
|
+ specClass:'',
|
|
|
+ photoLists:[],
|
|
|
+ checkLogicsIndex:0,
|
|
|
+ selectID:0,
|
|
|
+ addLogisticsType:'',
|
|
|
+ info:{
|
|
|
+ image:'',
|
|
|
+ note:'',
|
|
|
+ shopOrderId:''
|
|
|
+ },//备注信息
|
|
|
+ record:[],//子订单商品信息
|
|
|
+ logisticsList:[{
|
|
|
+ label:'',
|
|
|
+ number:'',
|
|
|
+ value:'',
|
|
|
+ }],
|
|
|
+ min:0,
|
|
|
+ max:200
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ logisticsList: {
|
|
|
+ handler: function (el) {//监听对象的变换使用 function，箭头函数容易出现this指向不正确
|
|
|
+ this.logisticsList = el
|
|
|
+ },
|
|
|
+ deep: true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(option) {
|
|
|
+ if(option.type == 'add'){
|
|
|
+ this.addLogisticsType = option.type
|
|
|
+ this.info.shopOrderId = option.shopOrderId;
|
|
|
+ this.record = JSON.parse(option.data)
|
|
|
+ }else{
|
|
|
+ let queryData = JSON.parse(option.data);
|
|
|
+ this.addLogisticsType = option.type
|
|
|
+ this.logisticsBatchId = queryData.logisticsBatchId
|
|
|
+ this.info.shopOrderId = option.shopOrderId;
|
|
|
+ this.initGetLogisticsInfo()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ ...mapMutations(['login']),
|
|
|
+ initGetLogisticsInfo(){
|
|
|
+ this.ShopService.GetLogisticsInfo({ logisticsBatchId : this.logisticsBatchId, shopOrderId:this.info.shopOrderId }).then(response =>{
|
|
|
+ const data = response.data.logisticsBatch
|
|
|
+ if(data.remarkImages!=null){
|
|
|
+ this.photoLists = data.remarkImages
|
|
|
+ }else{
|
|
|
+ this.photoLists =[]
|
|
|
+ }
|
|
|
+ this.info.note = data.remark
|
|
|
+ }).catch(error =>{
|
|
|
+ this.$util.msg(error.msg,2000);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ AddScanCode(item){
|
|
|
+ let self = this;
|
|
|
+ uni.scanCode({
|
|
|
+ onlyFromCamera: true,
|
|
|
+ success: function (res) {
|
|
|
+ item.number= res.result
|
|
|
+ self.ShopService.GetExpressInformation({number:res.result}).then(response =>{
|
|
|
+ item.label= response.data.label
|
|
|
+ item.value= response.data.value
|
|
|
+ self.selectID = response.data.id
|
|
|
+ }).catch(error =>{
|
|
|
+ self.$util.msg(error.msg,2000);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ addListFn(){//添加
|
|
|
+ this.isShowRemarks = false
|
|
|
+ let obj ={name:'',number:'',value:''};
|
|
|
+ this.logisticsList.push(obj)
|
|
|
+ },
|
|
|
+ deleteLogistItemFn(item,index){
|
|
|
+ this.$util.modal('提示','确认删除物流信息吗？','确定','取消',true,() =>{
|
|
|
+ this.logisticsList.splice(index, 1);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ pageNavigateTo(index){//选择物流公司
|
|
|
+ this.isChange = false
|
|
|
+ this.checkLogicsIndex = index
|
|
|
+ this.$api.navigateTo(`/supplier/pages/deliver/logistics-list?selectID=${this.selectID}`)
|
|
|
+ },
|
|
|
+ showShowRemarksFn(){//显示发货备注
|
|
|
+ this.isShowRemarks = !this.isShowRemarks
|
|
|
+ if(this.isShowRemarks){
|
|
|
+ this.specClass = 'show';
|
|
|
+ }else{
|
|
|
+ this.specClass = 'hide';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ uploadPhotoFn(){//添加发货备注图片
|
|
|
+ uploadFileImage().then(res =>{
|
|
|
+ this.photoLists.push(JSON.parse(res.data).data)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ deletePhotoFn(index){//删除发货备注图片
|
|
|
+ this.photoLists.splice(index, 1);
|
|
|
+ },
|
|
|
+ confirmDeliverFn(){//确认发货
|
|
|
+ switch(this.addLogisticsType){
|
|
|
+ case 'add':
|
|
|
+ this.isNewAddLogisticsFn()
|
|
|
+ break;
|
|
|
+ case 'reple':
|
|
|
+ this.isRepleAddLogisticsFn()
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ isRepleAddLogisticsFn(){//重新添加物流信息
|
|
|
+ // 校验物流公司不能为空
|
|
|
+ let isLogisticsLabel = false
|
|
|
+ let isLogisticsNumber = false
|
|
|
+ this.logisticsList.forEach(el =>{
|
|
|
+ if(el.label == ''){
|
|
|
+ isLogisticsLabel = true
|
|
|
+ }
|
|
|
+ if(el.number == ''){
|
|
|
+ isLogisticsNumber = true
|
|
|
+ }
|
|
|
+ })
|
|
|
+ if(isLogisticsLabel){
|
|
|
+ this.$util.msg('请选择物流公司',2000);
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if(isLogisticsNumber){
|
|
|
+ this.$util.msg('请输入物流单号',2000);
|
|
|
+ return
|
|
|
+ }
|
|
|
+ //统一处理物流单号
|
|
|
+ let logisticsArray = []
|
|
|
+ let checkRepeat = false
|
|
|
+ for (const el of this.logisticsList) {
|
|
|
+ // 检查缓存中是否已经存在
|
|
|
+ if (logisticsArray.find(c => c.number === el.number && c.number === el.number)) {
|
|
|
+ // 已经存在
|
|
|
+ checkRepeat = true
|
|
|
+ }else{
|
|
|
+ // 不存在就说明以前没遇到过，把它记录下来
|
|
|
+ let logisticsObj = {
|
|
|
+ number:el.number,
|
|
|
+ logisticsCompanyName:el.label,
|
|
|
+ logisticsCompanyCode:el.value
|
|
|
+ }
|
|
|
+ logisticsArray.push(logisticsObj)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(checkRepeat){
|
|
|
+ this.$util.msg('物流单号重复',2000);
|
|
|
+ return
|
|
|
+ }
|
|
|
+ //统一处理备注图片
|
|
|
+ this.photoLists.forEach(el =>{
|
|
|
+ this.info.image += el+'##'
|
|
|
+ })
|
|
|
+ let params = {
|
|
|
+ logistics:logisticsArray,
|
|
|
+ remarkImage:this.info.image,
|
|
|
+ remark:this.info.note,
|
|
|
+ logisticsBatchID:this.logisticsBatchId
|
|
|
+ }
|
|
|
+ this.ShopService.ShopAddLogisticsInfo({params:JSON.stringify(params)}).then(response =>{
|
|
|
+ this.$util.msg('添加物流成功',2000,true,'success')
|
|
|
+ setTimeout(()=>{
|
|
|
+ this.$api.navigateTo(`/supplier/pages/deliver/deliver-record?shopOrderId=${this.info.shopOrderId}`)
|
|
|
+ },2000)
|
|
|
+ }).catch(error =>{
|
|
|
+ this.$util.msg(error.msg,2000);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ isNewAddLogisticsFn(){//第一次添加发货物流信息
|
|
|
+ // 校验物流公司不能为空
|
|
|
+ let isLogisticsLabel = false
|
|
|
+ let isLogisticsNumber = false
|
|
|
+ this.logisticsList.forEach(el =>{
|
|
|
+ if(el.label == ''){
|
|
|
+ isLogisticsLabel = true
|
|
|
+ }
|
|
|
+ if(el.number == ''){
|
|
|
+ isLogisticsNumber = true
|
|
|
+ }
|
|
|
+ })
|
|
|
+ if(isLogisticsLabel){
|
|
|
+ this.$util.msg('请选择物流公司',2000);
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if(isLogisticsNumber){
|
|
|
+ this.$util.msg('请输入物流单号',2000);
|
|
|
+ return
|
|
|
+ }
|
|
|
+ //统一处理物流单号
|
|
|
+ let logisticsArray = []
|
|
|
+ let checkRepeat = false
|
|
|
+ for (const el of this.logisticsList) {
|
|
|
+ // 检查缓存中是否已经存在
|
|
|
+ if (logisticsArray.find(c => c.number === el.number && c.number === el.number)) {
|
|
|
+ // 已经存在
|
|
|
+ checkRepeat = true
|
|
|
+ }else{
|
|
|
+ // 不存在就说明以前没遇到过，把它记录下来
|
|
|
+ let logisticsObj = {
|
|
|
+ number:el.number,
|
|
|
+ logisticsCompanyName:el.label,
|
|
|
+ logisticsCompanyCode:el.value
|
|
|
+ }
|
|
|
+ logisticsArray.push(logisticsObj)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(checkRepeat){
|
|
|
+ this.$util.msg('物流单号重复',2000);
|
|
|
+ return
|
|
|
+ }
|
|
|
+ //统一处理备注图片
|
|
|
+ this.info.image = ''
|
|
|
+ this.photoLists.forEach(el =>{
|
|
|
+ this.info.image += el+'##'
|
|
|
+ })
|
|
|
+ let params = {
|
|
|
+ logistics:logisticsArray,
|
|
|
+ record:this.record,
|
|
|
+ info:this.info
|
|
|
+ }
|
|
|
+ this.ShopService.ShopAddLogistics({params:JSON.stringify(params)}).then(response =>{
|
|
|
+ this.$util.msg('发货成功',2000,true,'success')
|
|
|
+ setTimeout(()=>{
|
|
|
+ this.$api.redirectTo(`/supplier/pages/deliver/deliver-record?shopOrderId=${this.info.shopOrderId}`)
|
|
|
+ },2000)
|
|
|
+ }).catch(error =>{
|
|
|
+ this.$util.msg(error.msg,2000);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ previewImg (index) {//顶部商品图片预览
|
|
|
+ isPreviewImg = true
|
|
|
+ let previewUrls = this.photoLists
|
|
|
+ uni.previewImage({
|
|
|
+ current: index, //图片索引
|
|
|
+ urls: previewUrls, //必须是http图片，本地图片无效
|
|
|
+ longPressActions:''
|
|
|
+ })
|
|
|
+ },
|
|
|
+ conInput(e){//备注文字字数限制
|
|
|
+ let value = e.detail.value;
|
|
|
+ let len = parseInt(value.length);
|
|
|
+ if (len > this.max) return;
|
|
|
+ this.min = len;
|
|
|
+ if(this.min == 200){
|
|
|
+ this.$util.msg('您输入的字数已达上限',2000);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ //处理选择物流公司
|
|
|
+ let pages = getCurrentPages();
|
|
|
+ let currPage = pages[pages.length-1];
|
|
|
+ if(currPage.data.select =='select'){
|
|
|
+ let SelectData = uni.getStorageSync('selectLogics')
|
|
|
+ this.selectID = SelectData.id
|
|
|
+ let setNewLogisticsList = this.logisticsList
|
|
|
+ setNewLogisticsList.forEach((el,index,arr) =>{
|
|
|
+ if(index == this.checkLogicsIndex ){
|
|
|
+ arr[this.checkLogicsIndex] = Object.assign({},arr[this.checkLogicsIndex],SelectData)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.logisticsList = setNewLogisticsList
|
|
|
+ }
|
|
|
+ this.isChange = true
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+ page {
|
|
|
+ height: auto;
|
|
|
+ background:#F7F7F7;
|
|
|
+ }
|
|
|
+ @keyframes showRemarks {
|
|
|
+ 0% {opacity: 0;}
|
|
|
+ 20% {opacity: 0.2;}
|
|
|
+ 40% {opacity: 0.4;}
|
|
|
+ 60% {opacity: 0.6;}
|
|
|
+ 80% {opacity: 0.8;}
|
|
|
+ 100% {opacity: 1;}
|
|
|
+ }
|
|
|
+ @keyframes hideRemarks {
|
|
|
+ 0% {opacity: 1;}
|
|
|
+ 20% {opacity: 0.8;}
|
|
|
+ 40% {opacity: 0.6;}
|
|
|
+ 60% {opacity: 0.4;}
|
|
|
+ 80% {opacity: 0.2;}
|
|
|
+ 100% {opacity: 0;}
|
|
|
+ }
|
|
|
+ .logistics{
|
|
|
+ border-top: 1px solid #EBEBEB;
|
|
|
+ }
|
|
|
+ .logistics-list{
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ padding: 10rpx 0;
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ .item-title{
|
|
|
+ width: 702rpx;
|
|
|
+ height: 80rpx;
|
|
|
+ padding: 0 24rpx;
|
|
|
+ line-height: 80rpx;
|
|
|
+ text-align: left;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ color: $text-color;
|
|
|
+ border-bottom: 1px solid #EBEBEB;
|
|
|
+ .title-left{
|
|
|
+ float: left;
|
|
|
+ }
|
|
|
+ .title-right{
|
|
|
+ float: right;
|
|
|
+ .icon-shanchu{
|
|
|
+ font-size: $font-size-30;
|
|
|
+ color: #FF2A2A;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .item-main{
|
|
|
+ width: 702rpx;
|
|
|
+ padding: 0 24rpx;
|
|
|
+ .item-main-cell{
|
|
|
+ width: 100%;
|
|
|
+ height: 80rpx;
|
|
|
+ line-height: 80rpx;
|
|
|
+ border-bottom: 1px solid #EBEBEB;
|
|
|
+ position: relative;
|
|
|
+ &.none{
|
|
|
+ border-bottom: none;
|
|
|
+ text-align: center;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ color: $color-system;
|
|
|
+ }
|
|
|
+ .icon-xiayibu{
|
|
|
+ width: 40rpx;
|
|
|
+ height: 80rpx;
|
|
|
+ display: block;
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ font-size: $font-size-32;
|
|
|
+ color: $text-color;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ .icon-icon-test{
|
|
|
+ color: $color-system;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ }
|
|
|
+ .input{
|
|
|
+ width: 100%;
|
|
|
+ height: 44rpx;
|
|
|
+ line-height: 44rpx;
|
|
|
+ padding: 18rpx 0;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ color: $text-color;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .logistics-btn{
|
|
|
+ width: 702rpx;
|
|
|
+ height: 88rpx;
|
|
|
+ margin: 0 auto;
|
|
|
+ .btn{
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background-color: #FFF;
|
|
|
+ border-radius: 44rpx;
|
|
|
+ border: 1px solid $color-system;
|
|
|
+ line-height: 88rpx;
|
|
|
+ text-align: center;
|
|
|
+ color: $color-system;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .logistics-btn-fiexd{
|
|
|
+ width: 702rpx;
|
|
|
+ padding: 0 24rpx;
|
|
|
+ height:auto;
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ background-color: #FFF;
|
|
|
+ border-radius: 20rpx 20rpx 0 0;
|
|
|
+ box-shadow:0px 3px 10px rgba(51, 51, 51,0.5);
|
|
|
+ z-index: 999;
|
|
|
+ .btn-tips{
|
|
|
+ height: 80rpx;
|
|
|
+ line-height: 80rpx;
|
|
|
+ text-align: center;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+ .confim-btn{
|
|
|
+ width: 702rpx;
|
|
|
+ height: 88rpx;
|
|
|
+ background: $btn-confirm;
|
|
|
+ line-height: 88rpx;
|
|
|
+ text-align: center;
|
|
|
+ color: #FFF;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ border-radius: 44rpx;
|
|
|
+ }
|
|
|
+ .logistics-remarks{
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ &.show {
|
|
|
+ animation: showRemarks 0.2s linear both;
|
|
|
+ }
|
|
|
+ &.hide {
|
|
|
+ animation: hideRemarks 0.2s linear both;
|
|
|
+ }
|
|
|
+ .label{
|
|
|
+ height: 44rpx;
|
|
|
+ line-height: 44rpx;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ color: $text-color;
|
|
|
+ }
|
|
|
+ .remarks-photo{
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ padding: 10rpx 0;
|
|
|
+ .photo-item{
|
|
|
+ display: inline-block;
|
|
|
+ width: 112rpx;
|
|
|
+ height: 112rpx;
|
|
|
+ margin: 10rpx 0;
|
|
|
+ margin-right: 25rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ border:1px solid #F5F5F5;
|
|
|
+ position: relative;
|
|
|
+ float: left;
|
|
|
+ &.add{
|
|
|
+ width: 112rpx;
|
|
|
+ height: 112rpx;
|
|
|
+ border-color: #FFC684;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 112rpx;
|
|
|
+ margin-right: 0rpx;
|
|
|
+ .icon-jiahao{
|
|
|
+ font-size: $font-size-44;
|
|
|
+ color:#FFC684 ;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .icon-iconfontguanbi{
|
|
|
+ width: 24rpx;
|
|
|
+ height: 24rpx;
|
|
|
+ border-radius: 0 10rpx 0 0;
|
|
|
+ display: block;
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ background: rgba(51, 51, 51, 0.7);
|
|
|
+ text-align: center;
|
|
|
+ line-height: 24rpx;
|
|
|
+ color: #FFF;
|
|
|
+ font-size: $font-size-22;
|
|
|
+ }
|
|
|
+ image{
|
|
|
+ width: 112rpx;
|
|
|
+ height: 112rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .photo-list{
|
|
|
+ width: 100%;
|
|
|
+ height: 116rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-start;
|
|
|
+ }
|
|
|
+ .scoll-wrapper{
|
|
|
+ display:flex;
|
|
|
+ align-items: flex-start;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .remarks-textarea{
|
|
|
+ width: 652rpx;
|
|
|
+ height: 124rpx;
|
|
|
+ padding:10rpx 24rpx 24rpx 24rpx;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ background-color: #F5F5F5;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ position: relative;
|
|
|
+ .textarea{
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ line-height: 36rpx;
|
|
|
+ font-size: $font-size-24;
|
|
|
+ color: $text-color;
|
|
|
+ z-index: 1;
|
|
|
+ }
|
|
|
+ .limit-text{
|
|
|
+ position: absolute;
|
|
|
+ right: 20rpx;
|
|
|
+ bottom: 0;
|
|
|
+ line-height: 44rpx;
|
|
|
+ font-size: $font-size-24;
|
|
|
+ color: #D0D0D0;
|
|
|
+ .red{
|
|
|
+ color: $color-system;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .remarks-tips{
|
|
|
+ width: 100%;
|
|
|
+ line-height: 70rpx;
|
|
|
+ font-size: $font-size-24;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
