feat(文档管理): 重构文档列表为弹窗形式并优化关联文档库功能

pages/doc/docList.vue

@@ -1,33 +1,36 @@
 <template>
-	<view class="mainBox">
-		<uni-nav-bar fixed="true" statusBar="true" left-icon="back" title="文档列表" @clickLeft="back">
-
-		</uni-nav-bar>
-		<view class="topBtn">
-			<u-button v-if="type!=='view'" type="primary" @click="add" text="本地上传"></u-button>
-			<u-button v-if="type!=='view'" @click="selectDoc" text="关联文档库"></u-button>
-		</view>
-
-		<u-cell-group>
-			<u-cell v-for="(item, index) in tableList" :key="index">
-				<view class="listTitle" slot="title">
-					{{item.name}}
-				</view>
-
-				<view slot="value" class="listBtn">
-					<u-button text="浏览" size='mini' @click="preview(item)"></u-button>
-					<u-button v-if="type!=='view'" text="删除" size='mini' @click="del(index)"></u-button>
-				</view>
-			</u-cell>
-		</u-cell-group>
-
-		<view style="height: 84rpx;"></view>
-		<view class="footerButton">
-			<u-button type="primary" @click="back" text="返回"></u-button>
-			<u-button v-if="type!=='view'" @click="save" text="保存"></u-button>
+	<u-popup :show="show" @close="cancel" :closeable="false">
+		<view class="mainBox" style="width: 750rpx;">
+			<uni-nav-bar fixed="true" statusBar="true" left-icon="back" title="文档列表" @clickLeft="cancel">
+
+			</uni-nav-bar>
+			<view class="topBtn">
+				<u-button v-if="type!=='view'" type="primary" @click="add(1)" text="本地上传"></u-button>
+				<u-button v-if="type!=='view'" @click="add" text="关联文档库"></u-button>
+			</view>
+
+			<u-cell-group style="min-height:500rpx">
+				<u-cell v-for="(item, index) in tableList" :key="index">
+					<view class="listTitle" slot="title">
+						{{item.name}}
+					</view>
+
+					<view slot="value" class="listBtn">
+						<u-button text="浏览" size='mini' @click="preview(item)"></u-button>
+						<u-button v-if="type!=='view'" text="删除" size='mini' @click="del(index)"></u-button>
+					</view>
+				</u-cell>
+			</u-cell-group>
+
+			<view style="height: 84rpx;"></view>
+			<view class="footerButton">
+				<u-button type="primary" @click="cancel" text="返回"></u-button>
+				<u-button v-if="type!=='view'" @click="save" text="保存"></u-button>
+			</view>
+			<fileEdit ref="fileEditRef" @success="done"></fileEdit>
+			<selectDoc ref="selectDocRef" @success="done"></selectDoc>
 		</view>
-		<fileEdit ref="fileEditRef" @success="done"></fileEdit>
-	</view>
+	</u-popup>
 </template>
 
 <script>
@@ -35,9 +38,11 @@
 		queryIds
 	} from './api';
 	import fileEdit from './file-edit';
+	import selectDoc from './selectDoc';
 	export default {
 		components: {
-			fileEdit
+			fileEdit,
+			selectDoc
 		},
 		computed: {
 
@@ -47,27 +52,24 @@
 			return {
 				tableList: [],
 				fileId: [],
-				type: ''
+				type: '',
+				show: false,
 
 			}
 		},
-		onLoad({
-			fileId,
-			type
-		}) {
-			this.type = type
-			console.log(type,fileId);
-			if (fileId) {
-				this.fileId = JSON.parse(fileId)
-			}
-			this.init()
-			uni.$off('setDocList')
-			uni.$on('setDocList', (id) => {
-				this.fileId.push(...id);
-				this.init()
-			})
-		},
+
 		methods: {
+
+			open(fileId, type) {
+				this.type = type
+				this.fileId = fileId
+				this.show = true
+				this.init()
+			},
+			cancel() {
+				this.fileId = []
+				this.show = false;
+			},
 			async init() {
 				if (this.fileId.length > 0) {
 					this.tableList = await queryIds({
@@ -81,20 +83,18 @@
 				this.tableList.splice(index, 1);
 				this.fileId = this.tableList.map((item) => item.id);
 			},
-			selectDoc() {
-				uni.navigateTo({
-					url: '/pages/doc/selectDoc?isAll=' + 1 + '&fileId=' + JSON.stringify(this.fileId)
-				})
-			},
+
 			save() {
-				uni.$emit('getFiles', this.fileId)
-				this.back()
-			},
-			onunload() {
-				uni.$off('setDocList')
+				this.$emit('getFiles', this.fileId)
+				this.cancel()
 			},
-			add() {
-				this.$refs.fileEditRef.open()
+
+			add(type) {
+				if (type == 1) {
+					this.$refs.fileEditRef.open()
+				} else {
+					this.$refs.selectDocRef.open(1,this.fileId)
+				}
 			},
 			done(id) {
 				this.fileId.push(...id);

pages/doc/file-edit.vue

@@ -259,39 +259,48 @@
 			},
 			/* 保存编辑 */
 			async save() {
-				console.log(this.form);
-				let _this = this
 
-				this.$refs.uForm.validate().then(async res => {
 
-					uni.showLoading({
-						title: '加载中'
+				if (!this.form.directoryName) {
+					this.$refs.uToast.show({
+						type: "error",
+						message: "请选择文档位置",
 					})
+					return
+				}
+				if (!this.form.businessCodeId) {
+					this.$refs.uToast.show({
+						type: "error",
+						message: "请选择编码方案",
+					})
+					return
+				}
+				uni.showLoading({
+					title: '加载中'
+				})
 
-					_this.form.storagePath = await _this.uploadFile(_this.files)
-					let params = {
-						..._this.form
-					}
-					delete params.codeTypeName
-					delete params.directoryName
+				this.form.storagePath = await this.uploadFile(this.files)
+				let params = {
+					...this.form
+				}
+				delete params.codeTypeName
+				delete params.directoryName
+
+				fileSaveAPI(this.form)
+					.then((msg) => {
+						uni.hideLoading()
+						console.log(msg, 'msg')
 
-					fileSaveAPI(_this.form)
-						.then((msg) => {
-							uni.hideLoading()
-							console.log(msg, 'msg')
+						this.$emit('success', msg);
+						this.cancel()
+					})
+					.catch((e) => {
+						uni.hideLoading()
+						this.cancel()
 
-							_this.$emit('success', msg);
-							_this.cancel()
-						})
-						.catch((e) => {
-							uni.hideLoading()
-							_this.cancel()
+					});
 
-						});
 
-				}).catch(errors => {
-					uni.$u.toast('校验失败')
-				})
 
 
 

pages/doc/index.vue

@@ -10,12 +10,17 @@
 		<u-button :plain="true" :hairline="true" v-if="type != 'view'" size='mini' text="上传"
 			@click="handleUpload"></u-button>
 		<u-button :plain="true" :hairline="true" v-else size='mini' text="查看" @click="handleUpload"></u-button>
+		<docList ref="docListRef" @getFiles="getFiles"></docList>
 	</div>
 </template>
 
 <script>
+	import docList from './docList.vue';
 	export default {
 		name: 'index',
+		components: {
+			docList
+		},
 
 		model: {
 			prop: 'value',
@@ -48,24 +53,21 @@
 			}
 		},
 		created() {
-			uni.$off('getFiles')
-			uni.$on('getFiles', (id) => {
-				this.getFiles(id)
-			})
+			// uni.$off('getFiles')
+			// uni.$on('getFiles', (id) => {
+			// 	this.getFiles(id)
+			// })
 		},
 		destroyed() {
-			uni.$off('getFiles')
+			// uni.$off('getFiles')
 		},
 		methods: {
 			handleUpload() {
-				let type=this.type
-				console.log(this.type);
-				console.log(JSON.stringify(this.selectVal));
-				console.log('1111111')
-				// return
-				uni.navigateTo({
-					url: '/pages/doc/docList?fileId=' + JSON.stringify(this.selectVal) + '&type=' + type
-				})
+				let type = this.type
+				this.$refs.docListRef.open(this.selectVal,type)
+				// uni.navigateTo({
+				// 	url: '/pages/doc/docList?fileId=' + JSON.stringify(this.selectVal) + '&type=' + type
+				// })
 			},
 			getFiles(val = []) {
 				this.$emit('updateVal', val);

pages/doc/selectDoc.vue

@@ -1,59 +1,62 @@
 <template>
-	<view class="mainBox">
-		<uni-nav-bar fixed="true" statusBar="true" left-icon="back" title="选择" @clickLeft="back">
-			<!--右菜单-->
-			<template slot="right">
-				<u-button type="success" size="small" class="u-reset-button" @click="$refs.treePicker._show()"
-					text="文件夹"></u-button>
-			</template>
-		</uni-nav-bar>
-
-		<view class="wrapper">
-			<u-list class="listContent">
-				<checkbox-group v-for="(item, index) in listData" :key="index" @change="e => selectVal(e, item, index)">
-					<label>
-						<view class="listBox">
-							<view class="listBox-sel">
-								<checkbox :value="item.code" color="#fff" :disabled="item.disabled"
-									:checked="item.checked" />
-							</view>
-							<view class="listBox-con">
-								<view class="listBox-top">
-									<view class="listBox-name">
-										{{ item.name }}
-									</view>
-									<view class="listBox-code">
-										{{ item.code }}
-									</view>
+	<u-popup :show="show" @close="cancel" :closeable="false">
+		<view class="mainBox">
+			<uni-nav-bar fixed="true" statusBar="true" left-icon="back" title="选择" @clickLeft="cancel">
+				<!--右菜单-->
+				<template slot="right">
+					<u-button type="success" size="small" class="u-reset-button" @click="$refs.treePicker._show()"
+						text="文件夹"></u-button>
+				</template>
+			</uni-nav-bar>
+
+			<view class="wrapper">
+				<u-list class="listContent">
+					<checkbox-group v-for="(item, index) in listData" :key="index"
+						@change="e => selectVal(e, item, index)">
+						<label>
+							<view class="listBox">
+								<view class="listBox-sel">
+									<checkbox :value="item.code" color="#fff" :disabled="item.disabled"
+										:checked="item.checked" />
 								</view>
-								<view class="listBox-bottom">
-									<view>文件名称：{{ item.storagePath[0].name }}</view>
-									<view>版本：{{ item.version }}</view>
-									<view>创建人：{{ item.createUserName }}</view>
-									<view>创建时间：{{ item.createTime }}</view>
+								<view class="listBox-con">
+									<view class="listBox-top">
+										<view class="listBox-name">
+											{{ item.name }}
+										</view>
+										<view class="listBox-code">
+											{{ item.code }}
+										</view>
+									</view>
+									<view class="listBox-bottom">
+										<view>文件名称：{{ item.storagePath[0].name }}</view>
+										<view>版本：{{ item.version }}</view>
+										<view>创建人：{{ item.createUserName }}</view>
+										<view>创建时间：{{ item.createTime }}</view>
 
+									</view>
 								</view>
 							</view>
-						</view>
-					</label>
-				</checkbox-group>
-				<u-empty class="noDate" style="margin-top: 20vh" v-if="!listData.length"></u-empty>
-			</u-list>
-		</view>
+						</label>
+					</checkbox-group>
+					<u-empty class="noDate" style="margin-top: 20vh" v-if="!listData.length"></u-empty>
+				</u-list>
+			</view>
 
-		<view class="footer">
-			<view class="bottom" v-if="this.isAll==1">
-				<checkbox v-if="!seletedAll" color="#fff" :checked="seletedAll" @tap="_seletedAll">全选</checkbox>
-				<checkbox class="select-all" color="#fff" v-else :checked="seletedAll" @tap="_seletedAll">取消全选
-				</checkbox>
+			<view class="footer">
+				<view class="bottom" v-if="this.isAll==1">
+					<checkbox v-if="!seletedAll" color="#fff" :checked="seletedAll" @tap="_seletedAll">全选</checkbox>
+					<checkbox class="select-all" color="#fff" v-else :checked="seletedAll" @tap="_seletedAll">取消全选
+					</checkbox>
+				</view>
+				<u-button type="success" size="small" class="u-reset-button" :disabled="!checkListLen" @click="jumpAdd">
+					<view class="selBtn">选择( {{ checkListLen }} )</view>
+				</u-button>
 			</view>
-			<u-button type="success" size="small" class="u-reset-button" :disabled="!checkListLen" @click="jumpAdd">
-				<view class="selBtn">选择( {{ checkListLen }} )</view>
-			</u-button>
+			<ba-tree-picker ref="treePicker" key="verify" :multiple="false" @select-change="confirm" title="选择文件夹"
+				:localdata="classificationList" valueKey="id" textKey="name" childrenKey='sonDirectoryList' />
 		</view>
-		<ba-tree-picker ref="treePicker" key="verify" :multiple="false" @select-change="confirm" title="选择文件夹"
-			:localdata="classificationList" valueKey="id" textKey="name" childrenKey='sonDirectoryList' />
-	</view>
+	</u-popup>
 </template>
 
 <script>
@@ -80,7 +83,8 @@
 				classificationList: [], //分类数据
 				seletedAll: false, //全选状态,
 				isAll: '',
-				fileId:[]
+				fileId: [],
+				show: false
 
 			}
 		},
@@ -93,17 +97,22 @@
 			},
 
 		},
-		onLoad({
-			isAll,fileId
-		}) {
-			this.isAll = isAll //1多选 2单选
-			this.fileId=JSON.parse(fileId)
-			this.userInfo = uni.getStorageSync('userInfo')
-			this.getClassify()
-		},
+
 		onShow() {},
 		methods: {
-
+			open(isAll, fileId) {
+				this.isAll = isAll //1多选 2单选
+				this.fileId = fileId
+				this.userInfo = uni.getStorageSync('userInfo')
+				this.getClassify()
+				this.show = true
+			},
+			cancel() {
+				this.fileId = []
+				this.userInfo = ''
+				this.listData = []
+				this.show = false;
+			},
 			//列表数据
 			async getList() {
 				this._getClassifyList()
@@ -120,9 +129,9 @@
 				filePageAPI(params).then(res => {
 					uni.hideLoading()
 
-					this.listData = res.list.map(item=>{
-						if(this.fileId.includes(item.id)){
-							item['disabled']=true
+					this.listData = res.list.map(item => {
+						if (this.fileId.includes(item.id)) {
+							item['disabled'] = true
 						}
 						return item
 					})
@@ -139,13 +148,14 @@
 					currentUserId: this.userInfo.userId
 				}).then(res => {
 					this.classificationList = res
-					this.categoryLevelId=res[0].id
-					console.log(this.classificationList, 'this.classificationList')
+					this.categoryLevelId = res[0].id
+
 
 					this.getList()
 				});
 			},
 
+
 			//勾选
 			selectVal(e, val, index) {
 
@@ -177,19 +187,16 @@
 					})
 				}
 			},
-			//跳转回添加页面
+
 			jumpAdd() {
-				uni.$emit(
-					'setDocList',
-					this.listData.filter(item => item.checked).map(item=>item.id)
+				this.$emit(
+					'success',
+					this.listData.filter(item => item.checked).map(item => item.id)
 				)
 
-				uni.navigateBack()
+				this.cancel()
 			},
-			//返回添加页
-			backAdd() {
-				uni.navigateBack()
-			}
+
 		}
 	}
 </script>