高敬炎 2 gadi atpakaļ
vecāks
revīzija
d17d86ca8b

+ 26 - 0
xiaochengxu/App.vue

@@ -1,8 +1,33 @@
 <script>
 	export default {
+		 globalData: {
+		    statusBarHeight: 0, // 状态导航栏高度
+		    navHeight: 0, // 总体高度
+		    navigationBarHeight: 0, // 导航栏高度(标题栏高度)
+		},
 		onLaunch: function() {
 			console.warn('当前组件仅支持 uni_modules 目录结构 ,请升级 HBuilderX 到 3.1.0 版本以上!')
 			console.log('App Launch')
+			    console.log("App Launch")
+			 
+			    // 状态栏高度
+			    this.globalData.statusBarHeight = uni.getSystemInfoSync().statusBarHeight
+			 
+			    // #ifdef MP-WEIXIN
+			    // 获取微信胶囊的位置信息 width,height,top,right,left,bottom
+			    const custom = wx.getMenuButtonBoundingClientRect()
+			    // console.log(custom)
+			 
+			    // 导航栏高度(标题栏高度) = 胶囊高度 + (顶部距离 - 状态栏高度) * 2
+			    this.globalData.navigationBarHeight = custom.height + (custom.top - this.globalData.statusBarHeight) * 2
+			    // console.log("导航栏高度:"+this.globalData.navigationBarHeight)
+			 
+			    // 总体高度 = 状态栏高度 + 导航栏高度
+			    this.globalData.navHeight = this.globalData.navigationBarHeight + this.globalData.statusBarHeight
+			 
+			    // #endif
+			 
+			    console.log(this.globalData)
 		},
 		onShow: function() {
 			console.log('App Show')
@@ -17,6 +42,7 @@
 	/*每个页面公共css */
 	@import "@/uni_modules/uview-ui/index.scss";
 	@import '@/uni_modules/uni-scss/index.scss';
+	// @import '/static/iconfont/iconfont.css';
 	@import '@/static/styles/index.scss';
 	/* #ifndef APP-NVUE */
 	@import '@/static/customicons.css';

+ 2 - 1
xiaochengxu/config/index.js

@@ -1,5 +1,6 @@
 const dev = {
-	baseUrlNew: 'http://192.168.110.72:8182',
+	// baseUrlNew: 'http://192.168.110.72:8182',
+	baseUrlNew: 'http://192.168.110.138:8182',
 	// baseUrlNew: 'https://shiyaopinche.cspc.cn:10443',
 	h5Appid: 'wxb66b599f7f61b46f',
 	debug: false

+ 3 - 2
xiaochengxu/pages.json

@@ -89,8 +89,9 @@
 		}, {
 			"path": "pages/mySet/myCard",
 			"style": {
-				"navigationBarTitleText": "我的名片",
-				"enablePullDownRefresh": false
+				"navigationBarTitleText": "我的证件",
+				"enablePullDownRefresh": false,
+				"navigationStyle":"custom"
 			}
 
 		}, {

+ 1 - 0
xiaochengxu/pages/cardHolder/cardHolder.vue

@@ -65,6 +65,7 @@
 			@cancel="isShowType=false" closeOnClickOverlay @confirm="typeConfirm"></u-picker>
 		<lyuan-tx-asr ref="asr" :uploadMethod="uploadFile" @change="asrChange" @fileChange="fileChange" appId=""
 			secretId="" secretKey=""></lyuan-tx-asr>
+		<u-toast ref="uToast"></u-toast>
 	</view>
 </template>
 

+ 5 - 14
xiaochengxu/pages/mySet/cardType.vue

@@ -66,6 +66,11 @@
 				
 			},
 			downCallback(){
+				var that = this
+				this.$nextTick(() => {
+				// mescroll.endSuccess(data.result);
+				that.mescroll.resetUpScroll()
+				});
 				
 			},
 			upCallback(page){
@@ -151,13 +156,6 @@
 					})
 					uni.hideLoading()
 					this.mescroll.resetUpScroll( )
-				}).catch(res => {
-					uni.showToast({
-					    title: '置顶失败',
-					    icon: 'none',
-					    duration: 2000
-					})
-					uni.hideLoading()
 				})
 			},
 			stick(item){
@@ -195,13 +193,6 @@
 					})
 					uni.hideLoading()
 					this.mescroll.resetUpScroll( )
-				}).catch(res => {
-					uni.showToast({
-					    title: '置顶失败',
-					    icon: 'none',
-					    duration: 2000
-					})
-					uni.hideLoading()
 				})
 			},
 			

+ 504 - 28
xiaochengxu/pages/mySet/myCard.vue

@@ -1,68 +1,544 @@
 <template>
 	<view>
-		<view class="">
-			<view class="">
-				新增
+		<view>
+			 <u-navbar
+			            title="我的证件"
+			           @leftClick="leftClick"
+			        >
+			        </u-navbar>
+				<view style="margin-top:70px;" class="flex">
+			<!-- <view :style="{'margin-top':navHeight  +'px'}" class="flex"> -->
+				<view @click='addclick' class="button">新增</view>
+				<view @click='share' class="button">分享</view>
+				<!-- <button ref='share' open-type="share" class="button">分享</button> -->
+				<view @click='imageOCR' class="button">识别号码</view>
 			</view>
-			<view class="">
-				分享
-			</view>
-			<view class="">
-				识别号码
-			</view>
-			<view class="">
-				<view class="">
+			
+			
+			<mescroll-body v-if='!addstatus&&cardList.length==0||cardList.length>0' :up="upOption" ref="mescrollRef" @init="mescrollInit" @up="upCallback" @down="downCallback">
+				<view v-if='cardList.length>0' class="">
+				<view v-for='(item,index) in cardList' class="">
+					<view v-if='!item.editstatus'>{{item.certificateName}}</view>
+					<u--input v-else
+					v-model="item.certificateName"
+					placeholder="输入证件名称"
+					border="none"
+					
+					></u--input>
+					<view @click='edit(item)'>{{!item.editstatus?'编辑':'完成'}}</view>
 					 <u-checkbox-group
-					    v-model="checkboxValue1"
+					    v-model="item.checked"
 					    placement="column"
-					    @change="checkboxChange">
-					    <u-checkbox :customStyle="{marginBottom: '8px'}" >
+					    @change="checkboxChange($event,index,item)">
+					    <u-checkbox :name='index+1' :customStyle="{marginBottom: '8px'}" >
 					    </u-checkbox>
 					</u-checkbox-group>
 					
+					<image v-if='!item.editstatus' :src="item.certificateImage" mode=""></image>
+					<u-upload
+					v-else
+							@afterRead="afterRead"
+							:fileList="fileList2"
+							@delete="deletePic"
+							name="2"
+							multiple
+							:maxCount="1"
+						></u-upload>
+					<u-icon @click="del(item)" name="trash-fill" color="#2979ff" size="28"></u-icon>
 				</view>
 				<view></view>
 			</view>
-			<view class="">
+			</mescroll-body>
+			<view v-if='addstatus' class="">
 				<view class="">
+					<u--input
+					v-model="cardData.certificateName"
+					placeholder="输入证件名称"
+					border="none"
 					
+					></u--input>
 				</view>
-				<view>提交</view>
+				<view @click='add'>提交</view>
 				<view>
 					<u-upload
-						:fileList="fileList1"
-						@afterRead="afterRead"
-						@delete="deletePic"
-						name="1"
-						multiple
-						:maxCount="10"
-					></u-upload>
+							@afterRead="afterRead"
+							:fileList="fileList1"
+							@delete="deletePic"
+							name="1"
+							multiple
+							:maxCount="1"
+						></u-upload>
 				</view>
 			</view>
 		</view>
 		
-		<u-picker :show="show" :columns="columns"></u-picker>
-		<u-modal :show="modalshow" title="提示" content='确定删除证件?'></u-modal>
+		<u-picker @cancel='show=false' @confirm='pickerConfirm' title='识别类型' :show="show" :columns="columns"></u-picker>
+		<u-popup :show="popupshow" mode="bottom"  >
+		    <view>
+		    	<view class="share-to">
+		    		<text>分享到</text>
+		    	</view>
+		    	<view class="content">
+		    		<view class="block">
+						<button class="wechat" open-type="share">
+							<text class="iconfont icon-pengyouquan"></text>
+		    				<!-- <image src="/static/img/wechat.png" mode="aspectFill"></image> -->
+		    				<text>微信</text>
+						</button>
+		    		</view>
+		    		<view class="block" @click="toUrl()">
+		    			<button class="moment">
+							<text class="iconfont icon-weixin"></text>
+							<!-- <image src="/static/img/moment.png" mode="aspectFill"></image>					 -->
+		    				<text>朋友圈</text>
+						</button>
+		    		</view>
+		    	</view>
+		    	<view class="cancel" @click.stop="handleHiddenShare">
+		    		<text>取消</text>
+		    	</view>
+		    </view>
+		</u-popup>
+		<u-modal @cancel='modalshow=false' confirmText='删除' showCancelButton='true' @confirm='delConfirm' :show="modalshow" title="提示" content='确定删除证件?'></u-modal>
+		<u-modal @cancel='modalshow=false' confirmText='删除' showCancelButton='true' @confirm='delConfirm' :show="modalshow" title="提示" content='确定删除证件?'></u-modal>
+		<u-modal :show="modalstatusshow" confirmText='继续返回'  cancelText='取消' @confirm='confirm' @cancel='cancel' showCancelButton='true' title="提示" content='有证件处于编辑状态未提交。'></u-modal>
+		<u-toast ref="uToast"></u-toast>
 	</view>
 </template>
 
 <script>
+	import {systemInfo} from '@/mixin.js';
+	import uploadImage from '@/components/ossutil/uploadFile.js'; 
+	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
 	export default {
+		mixins: [MescrollMixin,systemInfo],
+		
 		data() {
 			return {
 				show:false,
 				modalshow:false,
-				columns:['选择名片111','识别身份证号','识别1银行卡号']
+				modalstatusshow:false,
+				popupshow:false,
+				columns:[['识别身份证号','识别银行卡号']],
+				userInfo:{},
+				cardData:{},
+				cardList:[],
+				fileList1:[],
+				fileList2:[],
+				checkedList:[],
+				addstatus:false,
+				id:'',
+				credentialsShow:false
 			};
 		},
+		onLoad() {
+			console.log(this.statusBarHeight,this.navigationBarHeight ,this.windowHeight ,this.navHeight)
+				// this.getList()
+		},
+		onShow() {
+			this.userInfo = uni.getStorageSync("userInfo")
+			this.cardData.commonId=uni.getStorageSync("userInfo").id
+		},
 		methods: {
-			del(){
+			onShareAppMessage(res) {
+				    return {
+				      title: '页面分享的标题',
+				      path: '/pages/my/my',
+					  imageUrl: '/static/imgs/mylogo.png'
+				    }
+			},
+			onShareAppMessage(res) {
+				    return {
+				      title: '页面分享的标题',
+				      path: '/pages/my/my',
+					  imageUrl: '/static/imgs/mylogo.png'
+				    }
+			},
+			onShareTimeline() {
+				return {
+					title: '商通线上商城',
+					path: '/pages/index/index',
+					imageUrl: 'https://cdn.uviewui.com/uview/swiper/1.jpg'
+				};
+			},
+			edit(item){
+				if(item.editstatus){
+					this.$request.baseRequest('admin.unimall.certificateManagementInfo', 'update',{certificateManagementInfo:JSON.stringify(item)}, failres => {
+						console.log('res+++++', failres.errmsg)
+						this.$refs.uToast.show({
+							type: 'error',
+							message: failres.errmsg,
+						})
+						uni.hideLoading()
+					}).then(res => {
+						this.$refs.uToast.show({
+							type: 'success',
+							message: '编辑成功',
+						})
+						this.modalshow=false
+						this.checkedList=[]
+						uni.hideLoading()
+						this.mescroll.resetUpScroll( )
+					})
+				}else{
+					item.editstatus=true
+					this.fileList2=[{url:item.certificateImage}]
+				}
+				
+			},
+			delConfirm(){
+				this.$request.baseRequest('admin.unimall.certificateManagementInfo', 'delete',{id:this.id}, failres => {
+					console.log('res+++++', failres.errmsg)
+					this.$refs.uToast.show({
+						type: 'error',
+						message: failres.errmsg,
+					})
+					uni.hideLoading()
+				}).then(res => {
+					this.$refs.uToast.show({
+						type: 'success',
+						message: '删除成功',
+					})
+					this.modalshow=false
+					this.checkedList=[]
+					uni.hideLoading()
+					this.mescroll.resetUpScroll( )
+				})
+			},
+			pickerConfirm(e){
+				this.show=false
+				console.log(e)
+				var type='',type1=''
+				if(e.value[0]=='识别身份证号'){
+					type='admin.unimall.certificateManagementInfo'
+					type1='personShibie'
+				}else if(e.value[0]=='识别银行卡号'){
+					type='admin.unimall.certificateManagementInfo'
+					type1='bankShibie'
+				}
+				this.$request.baseRequest(type, type1,{certificateImage:this.cardList[this.checkedList[0]].certificateImage}, failres => {
+					console.log('res+++++', failres.errmsg)
+					this.$refs.uToast.show({
+						type: 'error',
+						message: failres.errmsg,
+					})
+					uni.hideLoading()
+				}).then(res => {
+					this.$refs.uToast.show({
+						type: 'success',
+						message: '识别成功',
+					})
+					uni.hideLoading()
+					this.credentialsShow
+				})
+			},
+			checkboxChange(e,i){
+				console.log(e[0],i)
+				if(e[0]){
+					this.checkedList.push(i)
+				}else{
+					var index=this.checkedList.findIndex((item)=>{return item==i})
+					this.checkedList.splice(index,1)
+				}
+				// for(var i=0;i<this.cardList.length;i++){
+				// 	console.log(this.cardList[i].checked)
+				// 	// if(this.cardList[i].checkedList.length>0){
+				// 	// 	this.checkedList.push(i)
+				// 	// }
+				// }
+				console.log(this.checkedList)
+			},
+			share(){
+				if(this.checkedList.length==0){
+					this.$refs.uToast.show({
+						type: 'error',
+						message: '请勾选想要识别的证件!',
+					})
+					return
+				}
+				this.popupshow=true
+			},
+			imageOCR(){
+				console.log(this.cardList,this.checkedList)
+				if(this.checkedList.length==0){
+					this.$refs.uToast.show({
+						type: 'error',
+						message: '请勾选想要识别的证件!',
+					})
+					return
+				}
+				if(this.checkedList.length>1){
+					this.$refs.uToast.show({
+						type: 'error',
+						message: '一次只能勾选一张证件!',
+					})
+					return
+				}
+				this.show=true
+			},
+			confirm(){
+				uni.navigateBack()
+			},
+			cancel(){
+				this.modalstatusshow=false
+			},
+			leftClick(){
+				if(this.cardData.certificateImage){
+					console.log(22222)
+					this.modalstatusshow=true
+				}else{
+					uni.navigateBack()
+				}
+			},
+			del(item){
 				this.modalshow=true
+				this.id=item.id
+			},
+			addclick(){
+				this.addstatus=true
+			},
+			add(){
+				if(!this.cardData.certificateImage){
+					this.$refs.uToast.show({
+						type: 'error',
+						message: '请上传证件照片!',
+					})
+					return
+				}
+				uni.showLoading({
+						title: '数据加载中'
+					})
+				this.$request.baseRequest('admin.unimall.certificateManagementInfo', 'add',{
+					certificateManagementInfo:JSON.stringify(this.cardData)
+				}, failres => {
+					console.log('res+++++', failres.errmsg)
+					this.$refs.uToast.show({
+						type: 'error',
+						message: failres.errmsg,
+					})
+					uni.hideLoading()
+				}).then(res => {
+					
+					this.$refs.uToast.show({
+						type: 'success',
+						message: '提交成功',
+					})
+					// if (res.errno == 200) {
+					uni.hideLoading()
+					this.fileList1=[]
+					this.addstatus=false
+					this.cardData={commonId:uni.getStorageSync("userInfo").id}
+					this.mescroll.resetUpScroll()
+					
+					// }
+				})
+				
+			},
+			deletePic(event) {
+				this[`fileList${event.name}`].splice(event.index, 1)
+				this.cardData.certificateImage =this[`fileList${event.name}`].toString()
+			},
+			// 新增图片
+			async afterRead(event) {
+				// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
+				let lists = [].concat(event.file)
+				let fileListLen = this[`fileList${event.name}`].length
+				lists.map((item) => {
+				     this[`fileList${event.name}`].push({
+				      ...item,
+				      status: 'uploading',
+				      message: '上传中'
+				     })
+				    })
+				// console.log(event,111111,fileListLen)
+				for (let i = 0; i < lists.length; i++) {
+					const result = await this.uploadFilePromise(lists[i].url)
+					this.cardData.certificateImage = result
+					this[`fileList${event.name}`][fileListLen]={}
+					let item = this[`fileList${event.name}`][fileListLen]
+					console.log(item)
+					 this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+					  status: 'success',
+					  message: '',
+					  url: result
+					 }))
+					 fileListLen++
+				}
+				console.log(this[`fileList${event.name}`])
+			},
+			uploadFilePromise(url) {
+				console.log(url)
+				return new Promise((resolve, reject) => {
+					uploadImage(url, 'cardImages/',
+						result => {
+							console.log(result,22222)
+							
+							resolve(result)
+						}
+					)
+				})
+			},
+			mescrollInit(){
+				
+			},
+			downCallback(){
+				var that = this
+				this.$nextTick(() => {
+				// mescroll.endSuccess(data.result);
+				that.mescroll.resetUpScroll()
+				});
+				
+			},
+			upCallback(page){
+				var that = this
+				uni.showLoading({
+						title: '数据加载中'
+					})
+				this.$request.baseRequest('admin.unimall.certificateManagementInfo', 'list',{
+					page:page.num,
+					limit:page.size,
+					commonId:uni.getStorageSync("userInfo").id
+				}, failres => {
+					console.log('res+++++', failres.errmsg)
+					this.$refs.uToast.show({
+						type: 'error',
+						message: failres.errmsg,
+					})
+					this.mescroll.endBySize(curPageLen, totalPage)
+					uni.hideLoading()
+				}).then(res => {
+					console.log(res)
+					if(page.num == 1) this.cardList = [];
+					let curPageLen = res.data.items.length;
+					let totalPage = res.data.total;
+					if(res.data.items.length>0){
+						for(var i=0;i<res.data.items.length;i++){
+							res.data.items[i].editstatus=false
+						}
+					}
+					this.cardList=this.cardList.concat(res.data.items)
+					this.cardData.certificateName='证件'+'-'+(this.cardList.length+1)
+					this.$nextTick(() => {
+						console.log(that)
+					// mescroll.endSuccess(data.result);
+					that.mescroll.endBySize(curPageLen, totalPage)
+					});
+					
+					// if (res.errno == 200) {
+					uni.hideLoading()
+					
+					// }
+				})
 			},
 		}
 	}
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
+button::after{border: initial;}
+	.share {
+		width: 100%;
+		height: 100%;
+	}
+ 
+	.share-box {
+		width: 100%;
+		height: 100%;
+		position: fixed;
+		top: 0rpx;
+		left: 0rpx;
+		bottom: 0rpx;
+		right: 0rpx;
+		background-color: rgba(0, 0, 0, 0.4);
+		transition: .3s;
+		z-index: 999;
+	}
+ 
+	.block>button {
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+		background-color: white;
+		border-style: none;
+		width: 300rpx;
+		height: 180rpx;
+		// outline:none;
+		// opacity: 0;
+	}
+ 
+	// 进入分享动画
+	.share-show {
+		transition: all 0.3s ease;
+		transform: translateY(0%) !important;
+	}
+ 
+	// 离开分享动画
+	.share-item {
+ 
+		.share-to {
+			width: 100%;
+			height: 3rem;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+ 
+			&::after {
+				content: '';
+				width: 240rpx;
+				height: 0rpx;
+				border-top: 1px solid #E4E7ED;
+				-webkit-transform: scaleY(0.5);
+				transform: scaleY(0.5);
+				margin-left: 30rpx;
+			}
+ 
+			&::before {
+				content: '';
+				width: 240rpx;
+				height: 0rpx;
+				border-top: 1px solid #E4E7ED;
+				-webkit-transform: scaleY(0.5);
+				transform: scaleY(0.5);
+				margin-right: 30rpx;
+			}
+		}
+ 
+		.content {
+			width: 100%;
+			height: auto;
+			display: flex;
+			flex-wrap: wrap;
+ 
+			.block {
+				width: 50%;
+				display: flex;
+				flex-direction: column;
+				justify-content: center;
+				align-items: center;
+				height: 180rpx;
+ 
+				image {
+					width: 80rpx;
+					height: 80rpx;
+				}
+ 
+				text {
+					margin-top: 16rpx;
+					font-size: 28rpx;
+					color: #606266;
+				}
+			}
+		}
+ 
+		.cancel {
+			width: 100%;
+			height: 3rem;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			border-top: 1rpx solid #E4E7ED;
+		}
+	}
 
 </style>