初始化（包含登录模块）

2024-03-29 17:37:48 +08:00
commit 1bcb13ce7a
1306 changed files with 152772 additions and 0 deletions
--- a/pages/template/nav-city-dropdown/nav-city-dropdown.vue
+++ b/pages/template/nav-city-dropdown/nav-city-dropdown.vue
@@ -0,0 +1,138 @@
+<template>
+	<view class="mpvue-picker">
+		<page-head :title="title"></page-head>
+		<view class="uni-padding-wrap uni-common-mt">
+			<view class="uni-title">
+				<!-- #ifndef H5 -->
+				<uni-icons size="16" type="info"></uni-icons>
+				<!-- #endif -->
+				说明 :
+			</view>
+			<view class="uni-helllo-text">
+				<view>
+					在App端可在pages.json里配置buttons，暂不支持动态改变buttons的样式，使用onNavigationBarButtonTap可监听城市选择按钮的点击事件。
+				</view>
+			</view>
+		</view>
+		<mpvue-picker :themeColor="themeColor" ref="mpvuePicker" :mode="mode" :deepLength="deepLength"
+			:pickerValueDefault="pickerValueDefault" @onConfirm="onConfirm" @onCancel="onCancel"
+			:pickerValueArray="pickerValueArray"></mpvue-picker>
+
+		<!-- 		<picker ref="mpvuePicker" @change="bindPickerChange" :value="index" :range="pickerValueArray" range-key="label">
+			<view class="">{{pickerValueArray[index].label}}</view>
+		</picker>
+ -->
+	</view>
+</template>
+
+<script>
+	// https://github.com/zhetengbiji/mpvue-picker
+	import mpvuePicker from '../../../components/mpvue-picker/mpvuePicker.vue';
+	// https://github.com/zhetengbiji/mpvue-citypicker
+
+	export default {
+		components: {
+			mpvuePicker
+		},
+		data() {
+			return {
+				title: 'nav-city-dropdown',
+				pickerValueArray: [{
+						label: '北京市',
+						value: 110000
+					},
+					{
+						label: '天津市',
+						value: 120000
+					},
+					{
+						label: '广州市',
+						value: 440100
+					},
+					{
+						label: '深圳市',
+						value: 440300
+					}
+				],
+				themeColor: '#007AFF',
+				mode: '',
+				deepLength: 1,
+				pickerValueDefault: [0],
+				index: 0,
+			};
+		},
+		onReady() {
+			// #ifdef VUE3
+			this.setStyle(0, '北京市')
+			// #endif
+			// #ifndef VUE3
+			this.setStyle(1, '北京市')
+			// #endif
+		},
+		methods: {
+			onCancel(e) {
+				console.log(e);
+			},
+			// 单列
+			showSinglePicker() {
+				this.mode = 'selector';
+				this.deepLength = 1;
+				this.pickerValueDefault = [0];
+				this.$refs.mpvuePicker.show();
+			},
+			onConfirm(e) {
+				console.log(e.label);
+				// #ifdef VUE3
+				this.setStyle(0, e.label)
+				// #endif
+				// #ifndef VUE3
+				this.setStyle(1, e.label)
+				// #endif
+			},
+			/**
+			 * 修改导航栏buttons
+			 * index[number] 修改的buttons 下标索引，最右边索引为0
+			 * text[string] 需要修改的text 内容
+			 */
+			setStyle(index, text) {
+				let pages = getCurrentPages();
+				let page = pages[pages.length - 1];
+				if (text.length > 3) {
+					text = text.substr(0, 3) + '...';
+				}
+				// #ifdef APP-PLUS
+				let currentWebview = page.$getAppWebview();
+				let titleNView = currentWebview.getStyle().titleNView;
+				// 添加文字过长截取为3个字符，请根据自己业务需求更改
+				titleNView.buttons[0].text = text;
+				currentWebview.setStyle({
+					titleNView: titleNView
+				});
+				// #endif
+				// #ifdef H5
+				// h5 临时方案
+				const btn = document.getElementsByClassName('uni-btn-icon')[index]
+				btn.innerText = text;
+				// #endif
+			}
+		},
+		onBackPress() {
+			if (this.$refs.mpvuePicker.showPicker) {
+				this.$refs.mpvuePicker.pickerCancel();
+				return true;
+			}
+		},
+		onUnload() {
+			if (this.$refs.mpvuePicker.showPicker) {
+				this.$refs.mpvuePicker.pickerCancel();
+			}
+		},
+		onNavigationBarButtonTap(e) {
+			if (e.index === 0) {
+				this.showSinglePicker();
+			}
+		}
+	};
+</script>
+
+<style></style>