添加花束与创建任务

hdApp/src/admin/goods/result.vue

@@ -3,42 +3,152 @@
 		<view class="billing_box_bg">
 			<view class="top-view"> </view>
 			<view class="result-view">
-				<view class="iconfont iconchenggong"></view>
-				<view class="result-title">添加成功</view>
+			<view class="iconfont iconchenggong"></view>
+			<view class="result-title">添加成功</view>
+
+			<view class="form-container">
+				<form>
+					<view class="module-com input-line-wrap">
+						<tui-list-cell class="line-cell" :hover="false">
+							<view class="tui-title required">数量</view>
+							<input v-model="form.num" placeholder-class="phcolor" class="tui-input" name="num" @focus="form.num=''" placeholder="填写数量" maxlength="50" type="number" />
+						</tui-list-cell>
+
+						<tui-list-cell class="line-cell" :hover="false" :arrow="false" >
+							<view class="tui-title required">单价</view>
+							<input type="digit" @focus="goodsPrice=''" style="width:260upx;" v-model="goodsPrice" placeholder-class="tui-placeholder" placeholder="填写金额" />
+							<text style="color:#3385FF;font-weight:bold;">合计 ¥<text>{{orderTotalPrice}}</text></text>
+						</tui-list-cell>
+
+						<tui-list-cell class="line-cell" :hover="false" :arrow="false" v-if="form.fromType == 3">
+							<view class="tui-title">收款方式</view>
+							<button @tap="form.hasPay = 1" class="admin-button-com middle" :class="form.hasPay == 1 ? 'blue' : 'default'">线下</button>
+							<button @tap="form.hasPay = 2" class="admin-button-com middle" :class="form.hasPay == 2 ? 'blue' : 'default'">赊账</button>
+						</tui-list-cell>
+
+						<tui-list-cell class="line-cell" :arrow="true" v-if="form.hasPay == 1 && form.fromType == 3">
+							<view class="tui-title">线下渠道</view>
+							<picker mode="selector" :value="form.payWay" :range="payWayList" range-key="name" @change="payWayChange" class="tui-input" >
+								<input v-model="form.payWay" name="payWay" type="text" hidden />
+								<view style="padding:6upx 0 6upx 0;">{{payWayList[payWayindex].name}}</view>
+							</picker>
+						</tui-list-cell>
+
+						<tui-list-cell class="line-cell" :hover="false">
+							<view class="tui-title required">配送方式</view>
+							<button @tap="form.sendType = 3" class="admin-button-com middle" :class="form.sendType == 3 ? 'blue' : 'default'">骑手送</button>
+							<button @tap="form.sendType = 2" class="admin-button-com middle" style="margin-left:5upx;" :class="form.sendType == 2 ? 'blue' : 'default'">自己送</button>
+							<button @tap="form.sendType = 1" class="admin-button-com middle" style="margin-left:5upx;" :class="form.sendType == 1 ? 'blue' : 'default'">到店自取</button>
+						</tui-list-cell>
+
+						<tui-list-cell class="line-cell" :hover="false" :arrow="true">
+							<view class="tui-title required" v-if="form.sendType == 1">取花日期</view>
+							<view class="tui-title required" v-else>配送日期</view>
+							<picker mode="date" :value="form.reachDate" @change="selTimeFn" class="tui-input">
+								<view v-if="form.reachDate">{{ form.reachDate }}</view>
+								<view v-else>今天</view>
+							</picker>
+						</tui-list-cell>
+
+						<tui-list-cell class="line-cell" :hover="false" :arrow="false">
+							<view class="tui-title required" v-if="form.sendType == 1">取花时间</view>
+							<view class="tui-title required" v-else>配送时间</view>
+							<picker mode="multiSelector" :value="form.reachPeriod" :range="timeOptions" @change="bindTimeChange">
+								<view class="uni-input" style="width:450upx;">{{form.reachPeriod}}<text style="margin-left:10upx;">前</text></view>
+							</picker>
+						</tui-list-cell>
+
+						<tui-list-cell class="line-cell" :hover="false">
+							<view class="tui-title">备注内容</view>
+							<input v-model="form.remark" placeholder-class="phcolor" class="tui-input" placeholder-style="color:#ccc" name="remark" placeholder="选填" />
+						</tui-list-cell>
+					</view>
+				</form>
 			</view>
+
+		</view>
 		</view>
 	</view>
 </template>
 <script>
+import TuiListCell from "@/components/plugin/list-cell";
+import { mapGetters } from "vuex";
+
 export default {
-    name: "result",
+	name: "result",
+	components: {
+		TuiListCell
+	},
+	data() {
+		return {
+			form: {
+				fromType: '3',
+				hasPay: 1,
+				payWay: 0,
+				num: 1,
+				sendType: 3,
+				reachDate: '',
+				reachPeriod: "12:00",
+				remark: ''
+			},
+			goodsPrice: '',
+			payWayindex: 0,
+			payWayList: [
+				{name: "线下微信", id: 0},
+				{name: "线下支付宝", id: 1},
+				{name: "现金", id: 4},
+				{name: "银行卡", id: 5}
+			],
+			timeOptions: [
+				['00', '01', '02','03','04','05','06','07','08','09','10','11','12','13', '14','15','16','17','18','19','20','21','22','23'],
+				['00', '05', '10','15','20','25','30','35','40','45','50','55']
+			]
+		};
+	},
+	computed: {
+		...mapGetters(["getLoginInfo", "getMyShopInfo"]),
+		orderTotalPrice() {
+			let price = 0;
+			if (Number(this.goodsPrice) > 0 && Number(this.form.num) > 0) {
+				price = Number(this.goodsPrice) * Number(this.form.num);
+				price = parseFloat(price.toFixed(2));
+			}
+			return price;
+		}
+	},
 	methods: {
-		init(){
+		init() {
 
 		},
 		goBackHome() {
 			uni.navigateBack({})
+		},
+		payWayChange(e) {
+			let index = e.detail.value;
+			this.payWayindex = index;
+			this.form.payWay = this.payWayList[index].id;
+		},
+		selTimeFn(e) {
+			this.form.reachDate = e.detail.value;
+		},
+		bindTimeChange(event) {
+			let val = event.detail.value;
+			let before = Number(val[0]);
+			let after = Number(val[1]);
+			let timeOptions = this.timeOptions;
+			this.form.reachPeriod = timeOptions[0][before]+':'+timeOptions[1][after];
 		}
 	}
 };
 </script>
 <style lang="scss" scoped>
-.go-back{
-	width: 80%;
-	height: 80upx;
-	color: #FFFFFF;
-	margin-top: 50upx;
-	background: #3385FF;
-	border-radius: 10upx;
-	font-size:30upx;
-}
 .billing_box_bg {
 	position: relative;
 	padding: 60upx 30upx;
 	display: flex;
 	background: white;
 	flex-direction: column;
-    background-color: #f5f5f5;
+	background-color: #f5f5f5;
 	.top-view {
 		position: absolute;
 		top: 0;
@@ -53,7 +163,7 @@ export default {
 		display: flex;
 		flex-direction: column;
 		align-items: center;
-		padding: 70upx;
+		padding: 70upx 0 30upx;
 		width: 100%;
 		background: #ffffff;
 		border-radius: 20upx;
@@ -63,9 +173,33 @@ export default {
 			color: $mainColor1;
 		}
 		.result-title {
-			margin: 20upx 0 70upx;
+			margin: 20upx 0 40upx;
 			font-size: 32upx;
 		}
+		.form-container {
+			width: 100%;
+			.line-cell {
+				.tui-title {
+					width: 210upx;
+					color: $fontColor2;
+					&.required::before {
+						content: '*';
+						color: #ff0000;
+						margin-right: 4upx;
+					}
+				}
+				.tui-input {
+					width: calc(100% - 210upx);
+					font-size: 28upx;
+				}
+				.tui-placeholder {
+					color: #ccc;
+				}
+				.phcolor {
+					color: #ccc;
+				}
+			}
+		}
 	}
 }
 </style>