更新

pages/index/detail.vue

@@ -82,9 +82,9 @@
 		</view>
 		<view class="form_group">
 			<view class="lable">模板</view>
-			<view class="tag">
+			<view class="tag" @click="dshow = true">
+				<text class="span">2个模板</text>
 				<text class="icon more">&#xe631;</text>
-				<text class="span">{{ item.item_num }}</text>
 			</view>
 		</view>
 
@@ -142,31 +142,50 @@
 		<view class="footer" v-if="btnshow">
 			<view class="flex">
 				<view class="f"><button class="btn br" @click="submission()">提交</button></view>
-				<view class="f"><button class="btn br back" @click="back()" v-if="state == 1">回退</button></view>
+				<view class="f" v-if="state == 1"><button class="btn br back" @click="back()">回退</button></view>
 			</view>
 		</view>
-		<u-popup :show="show" mode="bottom">
-			<view class="content">
+		<u-popup :show="dshow" mode="center" @close="dshow = false" round="5" closeable customStyle="width:92%">
+			<view class="popup">
+				<u-divider text="模板下载"></u-divider>
+				<view class="citem" @click="download('https://img-operation.csdnimg.cn/csdn/silkroad/img/1670234405428.jpg')">
+					<view class="title omit">提交流程面板提交流程面板提交流程面板</view>
+					<view class="xz">点击下载</view>
+				</view>
+				<view class="citem" @click="download('https://img-operation.csdnimg.cn/csdn/silkroad/img/1670234405428.jpg')">
+					<view class="title omit">提交流程面板提交流程面板提交流程面板</view>
+					<view class="xz">点击下载</view>
+				</view>
+				<view class="citem" @click="download('https://img-operation.csdnimg.cn/csdn/silkroad/img/1670234405428.jpg')">
+					<view class="title omit">提交流程面板提交流程面板提交流程面板</view>
+					<view class="xz">点击下载</view>
+				</view>
+			</view>
+		</u-popup>
+		<u-popup :show="show" mode="bottom" @close="show = false" closeable round="15">
+			<view class="popup">
+				<u-divider text="提交流程面板"></u-divider>
 				<scroll-view scroll-y="true" style="height: 300rpx;">
-					<view>
-						<view>提交流程面板</view>
-						<view v-for="(item, index) in nextNodes" :key="index" style="float: left;">{{ item.name }}:</view>
-						<u-radio-group @change="radioGroupChange"><u-radio v-for="(item, index) in nextNodes" :key="index" :name="item.id"></u-radio></u-radio-group>
+					<view v-for="(item, index) in nextNodes" :key="index" class="bitem" @click="bselect(item, 'nextNodes')">
+						<view class="icon select check" v-if="item.check">&#xe600;</view>
+						<view class="icon select" v-else>&#xe8bb;</view>
+						<view class="title">{{ item.name }}</view>
 					</view>
 				</scroll-view>
-				<view class="confrim-btn"><u-button @click="submit()">确定</u-button></view>
+				<view class="confrim-btn"><button class="btn" @click="submit()">确定</button></view>
 			</view>
 		</u-popup>
-		<u-popup :show="bshow" mode="bottom">
-			<view class="content">
+		<u-popup :show="bshow" mode="bottom" @close="bshow = false" closeable round="15">
+			<view class="popup">
+				<u-divider text="回退流程面板"></u-divider>
 				<scroll-view scroll-y="true" style="height: 300rpx;">
-					<view>
-						<view>回退流程面板</view>
-						<view v-for="(item, index) in backNodes" :key="index" style="float: left;">{{ item.name }}:</view>
-						<u-radio-group @change="radioGroupChange"><u-radio v-for="(item, index) in backNodes" :key="index" :name="item.id"></u-radio></u-radio-group>
+					<view v-for="(item, index) in backNodes" :key="index" class="bitem" @click="bselect(item, 'backNodes')">
+						<view class="icon select check" v-if="item.check">&#xe600;</view>
+						<view class="icon select" v-else>&#xe8bb;</view>
+						<view class="title">{{ item.name }}</view>
 					</view>
 				</scroll-view>
-				<view class="confrim-btn"><u-button @click="workflowsback()">确定</u-button></view>
+				<view class="confrim-btn"><button class="btn" @click="workflowsback()">确定</button></view>
 			</view>
 		</u-popup>
 	</view>
@@ -199,6 +218,7 @@ export default {
 			},
 			show: false,
 			bshow: false,
+			dshow: false,
 			itemt: {},
 			up: {},
 			content: '标题',
@@ -245,17 +265,28 @@ export default {
 		});
 	},
 	methods: {
-		// 选中任一radio时，由radio-group触发
-		radioGroupChange(e) {
-			// console.log(e);
+		//下载模板
+		download(url) {
+			const a = document.createElement('a');
+			a.href = url;
+			a.download = 'download';
+			a.click();
+			this.dshow = false;
+		},
+		//提交或回退
+		bselect(e, tag) {
+			this[tag].forEach(item => {
+				item.check = false;
+			});
+			e.check = true;
 			this.itemt.nextNodeIds = [];
-			this.itemt.nextNodeIds.push(e);
+			this.itemt.nextNodeIds.push(e.id);
+			this.$forceUpdate();
 		}, //详情
 		getDocuments() {
 			this.http.request({
 				url: this.http.urls.documents + this.id,
 				data: this.item,
-				loading: 'false',
 				success: res => {
 					this.item = res.data.data.items;
 					this.p = res.data.data;
@@ -302,7 +333,6 @@ export default {
 			this.http.request({
 				url: this.http.urls.empty,
 				data: this.item,
-
 				success: res => {
 					console.log('res2:' + JSON.stringify(res));
 					this.item = res.data.data.items;
@@ -498,7 +528,7 @@ export default {
 </script>
 
 <style lang="scss">
-	.pages{
-		padding-bottom: 85px;
-	}
+.pages {
+	padding-bottom: 85px;
+}
 </style>