Merge branch 'gyq_test' into lw_test

common/config_gyq.js

@@ -45,5 +45,7 @@ var config = {
 	
 	//修改用户昵称、头像
 	API_USER_MODIFY_USER_INFO: api_web_url +'?r=user/modify-user-info',
+	//用户信息,
+	API_USER_INFO: api_web_url +'?r=user/info',
 };
 module.exports = config;

common/storage.js

@@ -1,3 +1,7 @@
+import {
+	QINIU_URL
+} from '@/common/constant'
+import i18n from '../locale/index.js'
 // 存储
 const STORAGE_USER_TOKEN = 'storage_user_token';
 const PRODUCTS_TO_ORDER = 'products_to_order';
@@ -21,6 +25,59 @@ const USER_INFO_DATA = 'USER_INFO_DATA';
 
 const IS_BUY_MODEL = 'IS_BUY_MODEL';
 
+const FUNCTIONTAG = 'FUNCTIONTAG'
+
+const ICONS = {
+	lock: `${QINIU_URL}FgMCTZCySvEgLYgkzU65BUR4f4Ls`,
+	edit: `${QINIU_URL}Fq3V1Zi5tKH7ibTwG1nO7N96CU8m`,
+	add: `${QINIU_URL}FqLEWbMe8DcnQtNz6GdDDD87ObZK`,
+	placeholder: `${QINIU_URL}FpKvfFNSDbx0d9RDwyGAQdFb7Kt6`
+}
+const activeTabs = [{
+		name: i18n.t('开机'),
+		iconUrl: `${QINIU_URL}Fp5T9lSNakoiioji6S7W4DmFQ_ys`,
+		isLock: true
+	},
+	{
+		name: i18n.t('闪灯鸣笛'),
+		iconUrl: `${QINIU_URL}FpeQsDh2dbeTullNLI-HhWj4WAQS`
+	},
+	{
+		name: i18n.t('打开座桶'),
+		iconUrl: `${QINIU_URL}FppwhbFzrEmDeJQgZJtDTu6WOoMZ`
+	},
+	{
+		name: i18n.t('打开尾箱'),
+		iconUrl: `${QINIU_URL}Fv3KLuYWEeV5IM4_2sMbmur7yZtz`
+	}
+]
+const toBeSelectTabs = [{
+		name:i18n.t('胎压'),
+		iconUrl: `${QINIU_URL}FmbcjmvoB4J3CT1hrbjNX4kxv9Zq`
+	},
+	{
+		name: i18n.t('点出信息'),
+		iconUrl: `${QINIU_URL}Fnx_4tLoq1ytvVA0UemepWisI73A`
+	},
+	{
+		name: i18n.t('导航'),
+		iconUrl: `${QINIU_URL}FrA_ouJtDp-39g7rMBI0EYr2czVE`
+	}
+]
+
+
+function setFunctionTag(tag = {}) {
+	uni.setStorageSync(FUNCTIONTAG, tag);
+}
+
+function getFunctionTag() {
+	let list = uni.getStorageSync(FUNCTIONTAG) || {
+		activeTag:activeTabs,
+		tag:toBeSelectTabs,
+	}
+	return list
+}
+
 
 function setIsLocationAuth(location_auth) {
 	uni.setStorageSync(IS_LOCATION_AUTH, location_auth);
@@ -124,6 +181,7 @@ function setUserCurrentLocation(
 ) {
 	uni.setStorageSync(USER_CURRENT_LOCATION, location_info);
 }
+
 function getUserCurrentLocation() {
 	return uni.getStorageSync(USER_CURRENT_LOCATION);
 }
@@ -162,6 +220,8 @@ function getIsBuyModel() {
 }
 
 module.exports = {
+	setFunctionTag,
+	getFunctionTag,
 	setUserToken: setUserToken,
 	getUserToken: getUserToken,
 	clearStorage: clearStorage,
@@ -193,6 +253,6 @@ module.exports = {
 	getShareCode: getShareCode,
 	setIsLocationAuth: setIsLocationAuth,
 	getIsLocationAuth: getIsLocationAuth,
-	getIsBuyModel:getIsBuyModel,
-	setIsBuyModel:setIsBuyModel
+	getIsBuyModel: getIsBuyModel,
+	setIsBuyModel: setIsBuyModel
 };

component/customTabbar/index.vue

@@ -29,8 +29,6 @@ const http = require('@/common/http.js');
 const config = require('@/common/config.js');
 const common = require('@/common/common.js');
 const appWhiteListFilter = require('@/common/appWhiteListFilter.js');
-
-
 export default {
   props: {
     curtTab: {

components/basic-drag/index.vue

@@ -0,0 +1,399 @@
+<template>
+	<movable-area :style="[getAreaStyle]">
+		<movable-view v-for="(item, index) in list" :animation="animation" :direction="direction" :key="item.key"
+			:damping="damping" :x="item.x" :y="item.y" :disabled="longpress ? disabled : false"
+			@longpress="handleLongpress" @touchstart="handleDragStart(index)" @change="handleMoving"
+			@touchend="handleDragEnd" :style="[getViewStyle]" class="base-drag-wrapper"
+			:class="{ active: activeIndex === index }">
+
+			<view class="drag-item">
+				<view @longpress="toggleEdit" :class="['tab-item']">
+					<image v-if="item.isLock" :src="icons.lock" class="right-icon" />
+					<image v-if="!item.isLock && isActiveEdit" @click="deleteTab(item)" :src="icons.edit"
+						class="right-icon" />
+					<image :src="item.iconUrl" class="icon" />
+					<view>{{ item.name }}</view>
+				</view>
+			</view>
+		</movable-view>
+	</movable-area>
+</template>
+
+<script>
+	import {
+		QINIU_URL
+	} from '@/common/constant'
+	const ICONS = {
+		lock: `${QINIU_URL}FgMCTZCySvEgLYgkzU65BUR4f4Ls`,
+		edit: `${QINIU_URL}Fq3V1Zi5tKH7ibTwG1nO7N96CU8m`,
+		add: `${QINIU_URL}FqLEWbMe8DcnQtNz6GdDDD87ObZK`,
+		placeholder: `${QINIU_URL}FpKvfFNSDbx0d9RDwyGAQdFb7Kt6`
+	}
+
+	export default {
+		props: {
+			column: {
+				type: Number,
+				default: 3
+			},
+			value: {
+				type: Array,
+				default: () => []
+			},
+			width: {
+				type: Number,
+				default: 375
+			},
+			height: {
+				type: String,
+				default: '100px'
+			},
+			itemKey: {
+				type: String,
+				required: true
+			},
+			itemHeight: {
+				type: String,
+				default: '100px'
+			},
+			direction: {
+				type: String,
+				default: 'all',
+				validator: value => {
+					return ['all', 'vertical', 'horizontal', 'none'].includes(value);
+				}
+			},
+			animation: {
+				type: Boolean,
+				default: true
+			},
+			damping: {
+				type: Number,
+				default: 20
+			},
+			longpress: {
+				type: Boolean,
+				default: true
+			}
+		},
+		data() {
+			const MAX_TAB_LEN = 4
+			return {
+				QINIU_URL,
+				MAX_TAB_LEN,
+				icons: ICONS,
+				isActiveEdit: false,
+				placeholderTab: {
+					name: '',
+					icon: ICONS.placeholder,
+					isLock: false,
+					isPlaceholder: true
+				},
+				list: [],
+				disabled: true,
+				activeIndex: -1,
+				moveToIndex: -1,
+				oldIndex: -1,
+				tempDragInfo: {
+					x: '',
+					y: ''
+				},
+				cloneList: []
+			};
+		},
+		computed: {
+			getAreaStyle() {
+				const width = this.getRealWidth(this.width);
+				return {
+					width: width + 'px',
+					height: this.height !== 'auto' ? this.height : Math.round(this.list.length / this.column) * this
+						.getItemHeight + 'px'
+				};
+			},
+			getViewStyle() {
+				const {
+					itemHeight,
+					getItemWidth
+				} = this;
+				return {
+					width: getItemWidth + 'px',
+					height: itemHeight
+				};
+			},
+			getItemHeight() {
+				return parseFloat(this.itemHeight);
+			},
+			getItemWidth() {
+				if (this.column === 0) return;
+				const width = this.getRealWidth(this.width);
+				return (parseFloat(width) / this.column).toFixed(2);
+			}
+		},
+		methods: {
+			getMovableItem(tab) {
+				return this.isActiveEdit && !tab.isLock && !tab.isPlaceholder
+			},
+			deleteTab(tab) {
+				if (tab.isLock) return
+				const index = this.list.findIndex(t => t.name === tab.name)
+				if (index !== -1) {
+					const removedTab = this.list.splice(index, 1)[0]
+					this.cloneList.splice(index, 1)
+					this.initList(this.cloneList);
+					const endList = this.list.map(item => this.omit(item, ['x', 'y', 'key']));
+					this.$emit('end', this.list, removedTab);
+				}
+			},
+			addPlaceholders() {
+				while (this.list.length < this.MAX_TAB_LEN) {
+					this.list.push({
+						...this.placeholderTab
+					})
+				}
+			},
+			toggleEdit(e) {
+				this.isActiveEdit = !this.isActiveEdit
+				this.$emit('toggleEdit', this.isActiveEdit);
+			},
+			//获取实际的宽度
+			getRealWidth(width) {
+				let pxValue = uni.upx2px(width);
+				// console.log(pxValue)
+				// if (width.includes('%')) {
+				// 	const windowWidth = uni.getSystemInfoSync().windowWidth;
+				// 	width = windowWidth * (parseFloat(width) / 100);
+				// }
+				return pxValue;
+			},
+
+			initList(list = []) {
+				const newList = this.deepCopy(list);
+				this.list = newList.map((item, index) => {
+					const [x, y] = this.getPosition(index);
+					return {
+						...item,
+						x,
+						y,
+						key: Math.random() + index
+					};
+				});
+				this.cloneList = this.deepCopy(this.list);
+			},
+
+			//长按
+			handleLongpress(index) {
+				this.disabled = false;
+			},
+
+			//拖拽开始
+			handleDragStart(index) {
+				this.activeIndex = index;
+				this.oldIndex = index;
+			},
+
+			//拖拽中
+			handleMoving(e) {
+				if (e.detail.source !== 'touch') return;
+				const {
+					x,
+					y
+				} = e.detail;
+				Object.assign(this.tempDragInfo, {
+					x,
+					y
+				});
+				const currentX = Math.floor((x + this.getItemWidth / 2) / this.getItemWidth);
+				const currentY = Math.floor((y + this.getItemHeight / 2) / this.getItemHeight);
+
+				this.moveToIndex = Math.min(currentY * this.column + currentX, this.list.length - 1);
+
+				if (this.oldIndex !== this.moveToIndex && this.oldIndex !== -1 && this.moveToIndex !== -1) {
+					const newList = this.deepCopy(this.cloneList);
+					newList.splice(this.moveToIndex, 0, ...newList.splice(this.activeIndex, 1));
+
+					this.list.forEach((item, index) => {
+						if (index !== this.activeIndex) {
+							const itemIndex = newList.findIndex(val => val[this.itemKey] === item[this.itemKey]);
+							[item.x, item.y] = this.getPosition(itemIndex);
+						}
+					});
+					this.oldIndex = this.moveToIndex;
+				}
+
+			},
+
+			//获取当前的位置
+			getPosition(index) {
+				const x = (index % this.column) * this.getItemWidth;
+				const y = Math.floor(index / this.column) * this.getItemHeight;
+				return [x, y];
+			},
+
+			//拖拽结束
+			handleDragEnd(e) {
+				if (this.disabled) return;
+				if (this.moveToIndex !== -1 && this.activeIndex !== -1 && this.moveToIndex !== this.activeIndex) {
+					this.cloneList.splice(this.moveToIndex, 0, ...this.cloneList.splice(this.activeIndex, 1));
+				} else {
+					this.$set(this.list[this.activeIndex], 'x', this.tempDragInfo.x);
+					this.$set(this.list[this.activeIndex], 'y', this.tempDragInfo.y);
+				}
+				this.initList(this.cloneList);
+				const endList = this.list.map(item => this.omit(item, ['x', 'y', 'key']));
+				this.$emit('input', endList);
+				this.$emit('end', endList);
+				this.activeIndex = -1;
+				this.oldIndex = -1;
+				this.moveToIndex = -1;
+				this.disabled = true;
+			},
+
+			deepCopy(source) {
+				return JSON.parse(JSON.stringify(source));
+			},
+
+			/**
+			 * 排除掉obj里面的key值
+			 * @param {object} obj
+			 * @param {Array|string} args
+			 * @returns {object}
+			 */
+			omit(obj, args) {
+
+				if (!args) return obj;
+				const newObj = {};
+				const isString = typeof args === 'string';
+				const keys = Object.keys(obj).filter(item => {
+					if (isString) {
+						return item !== args;
+					}
+					return !args.includes(item);
+				});
+
+				keys.forEach(key => {
+					if (obj[key] !== undefined) newObj[key] = obj[key];
+				});
+				return newObj;
+			}
+		},
+		watch: {
+			value: {
+				handler() {
+					this.initList(this.value);
+				},
+				immediate: true,
+				deep: true
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.drag-item {
+		height: 100%;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+
+		.tab-item {
+			text-align: center;
+			width: 100%;
+			position: relative;
+			margin-top: 24rpx;
+			height: 100px;
+
+			.right-icon {
+				position: absolute;
+				right: 20rpx;
+				top: 0;
+				width: 40rpx;
+				height: 40rpx;
+				z-index: 9;
+			}
+
+			.icon {
+				width: 112rpx;
+				height: 112rpx;
+				margin-bottom: 20rpx;
+			}
+
+			.name {
+				font-size: 28rpx;
+				color: #060809;
+
+				&.shake {
+					animation: shake 0.2s ease-in-out infinite;
+				}
+			}
+		}
+
+
+	}
+
+	.base-drag-wrapper {
+		opacity: 1;
+		z-index: 1;
+
+		&.active {
+			opacity: 0.7;
+			transform: scale(1.3);
+			z-index: 99;
+		}
+	}
+</style>
+<style lang="scss" scoped>
+	@import "@/libs/css/layout.scss";
+
+	.title {
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 400;
+		font-size: 36rpx;
+		color: #060809;
+		margin-bottom: 16rpx;
+		padding-left: 40rpx;
+
+		.sort-num {
+			margin-left: 12rpx;
+			width: 36rpx;
+			font-family: Futura, Futura;
+			font-size: 30rpx;
+			color: #060809;
+		}
+	}
+
+	.tab-item-container {
+		display: flex;
+
+		&.is-to-be-select {
+			flex-wrap: wrap;
+		}
+	}
+
+
+	.tips {
+		font-size: 24rpx;
+		color: #060809;
+		text-align: center;
+		margin-top: 32rpx;
+	}
+
+	.un-bind-btn {
+		position: absolute;
+		bottom: 56rpx;
+		left: 50%;
+		transform: translateX(-50%);
+		width: 93%;
+		padding: 24rpx;
+		text-align: center;
+		background: #E4E7EC;
+		border-radius: 40rpx;
+		font-family: PingFangSC, PingFang SC;
+		font-weight: bold;
+		font-size: 32rpx;
+		color: #060809;
+
+		&:active {
+			opacity: .7;
+		}
+	}
+</style>

locale/index.js

@@ -1,6 +1,14 @@
 import en from './en.json'
 import zh from './zh.json'
-export default {
-	en,
-	zh
+import Vue from 'vue';
+import VueI18n from 'vue-i18n'
+Vue.use(VueI18n);
+let i18nConfig = {
+	locale: "zh",
+	messages: {
+		en,
+		zh
+	}
 }
+let i18n = new VueI18n(i18nConfig)
+export default i18n

main.js

@@ -7,24 +7,16 @@ Polyfill.init();
 
 // 全局mixins，用于实现setData等功能，请勿删除！';
 import Mixin from './polyfill/mixins';
-import messages from './locale/index'
+import i18n from './locale/index'
 import uView from "uview-ui";
 
 Vue.use(uView);
 
-let i18nConfig = {
-	 locale: "zh",
-	//locale: uni.getLocale(),
-	messages 
-}
 
 // #ifndef VUE3
 import Vue from 'vue';
 
 Vue.mixin(Mixin);
-import VueI18n from 'vue-i18n'
-Vue.use(VueI18n)
-const i18n = new VueI18n(i18nConfig)
 Vue.config.productionTip = false;
 App.mpType = 'app';
 const app = new Vue({
@@ -34,18 +26,18 @@ const app = new Vue({
 app.$mount();
 // #endif
 
-// #ifdef VUE3
-import { createSSRApp } from 'vue';
-import {
-	createI18n
-} from 'vue-i18n'
-const i18n = createI18n(i18nConfig)
-export function createApp() {
-    const app = createSSRApp(App);
-	app.use(i18n)
-    app.mixin(Mixin);
-    return {
-        app
-    };
-}
-// #endif
+// // #ifdef VUE3
+// import { createSSRApp } from 'vue';
+// import {
+// 	createI18n
+// } from 'vue-i18n'
+// const i18n = createI18n(i18nConfig)
+// export function createApp() {
+//     const app = createSSRApp(App);
+// 	app.use(i18n)
+//     app.mixin(Mixin);
+//     return {
+//         app
+//     };
+// }
+// // #endif

pages/carFunctionSet/more.vue

@@ -1,11 +1,11 @@
 <template>
-  <view class="zx-container car-function-set-more">
-    <view class="fn-wrap">
-      <view class="title">
-        {{ $t('固定导航栏') }}
-        <text class="sort-num">{{ realActiveTabs.length }} / {{ MAX_TAB_LEN }}</text>
-      </view>
-      <draggable v-model="activeTabs" :delay="0" :animation="200" class="tab-item-container">
+	<view class="zx-container car-function-set-more">
+		<view class="fn-wrap">
+			<view class="title">
+				{{ $t('固定导航栏') }}
+				<text class="sort-num">{{ realActiveTabs.length }} / {{ MAX_TAB_LEN }}</text>
+			</view>
+			<!-- <draggable v-model="activeTabs" :delay="0" :animation="200" class="tab-item-container">
         <view v-for="(tab, index) in activeTabs" :class="['tab-item']" :key="index" @longpress="toggleEdit"
           @tap="deleteTab(tab)">
           <image v-if="tab.isLock && isActiveEdit" :src="icons.lock" class="right-icon" />
@@ -13,216 +13,217 @@
           <image :src="tab.iconUrl" class="icon" />
           <view :class="['name', getMovableItem(tab) && 'shake']">{{ tab.name }}</view>
         </view>
-      </draggable>
-    </view>
-    <view class="fn-wrap">
-      <view class="title">{{ $t('其他功能') }}</view>
-      <view class="tab-item-container is-to-be-select">
-        <view v-for="tab in toBeSelectTabs" :key="tab.name" class="tab-item" @longpress="toggleEdit"
-          @tap="addItemTab(tab)">
-          <image v-if="showAddIcon" :src="icons.add" class="right-icon" />
-          <image :src="tab.iconUrl" class="icon" />
-          <view class="name">{{ tab.name }}</view>
-        </view>
-      </view>
-    </view>
-    <view class="tips">{{ $t('长按拖动可调整顺序，可增减固定导航栏内容') }}</view>
-    <view class="un-bind-btn" @tap="toUnbind">{{ $t('解除绑定') }}</view>
-  </view>
+      </draggable> -->
+			<basic-drag @end='endFn' @toggleEdit='toggleEdit' v-model="activeTabs" :width="700" :column="4"
+				itemKey="name"></basic-drag>
+
+		</view>
+		<view class="fn-wrap">
+			<view class="title">{{ $t('其他功能') }}</view>
+			<view class="tab-item-container is-to-be-select">
+				<view v-for="tab in toBeSelectTabs" :key="tab.name" class="tab-item" @longpress="toggleEdit"
+					@tap="addItemTab(tab)">
+					<image v-if="showAddIcon" :src="icons.add" class="right-icon" />
+					<image :src="tab.iconUrl" class="icon" />
+					<view class="name">{{ $t(tab.name) }}</view>
+				</view>
+			</view>
+		</view>
+		<view class="tips">{{ $t('长按拖动可调整顺序，可增减固定导航栏内容') }}</view>
+		<view class="un-bind-btn" @tap="toUnbind">{{ $t('解除绑定') }}</view>
+	</view>
 </template>
 
 <script>
-// import draggable from 'vuedraggable'
-import { QINIU_URL } from '@/common/constant'
-
-const ICONS = {
-  lock: `${QINIU_URL}FgMCTZCySvEgLYgkzU65BUR4f4Ls`,
-  edit: `${QINIU_URL}Fq3V1Zi5tKH7ibTwG1nO7N96CU8m`,
-  add: `${QINIU_URL}FqLEWbMe8DcnQtNz6GdDDD87ObZK`,
-  placeholder: `${QINIU_URL}FpKvfFNSDbx0d9RDwyGAQdFb7Kt6`
-}
-
-export default {
-  components: {
-    // draggable
-  },
-  data() {
-    const MAX_TAB_LEN = 4
-    return {
-      QINIU_URL,
-      MAX_TAB_LEN,
-      icons: ICONS,
-      isActiveEdit: false,
-      placeholderTab: {
-        name: '',
-        icon: ICONS.placeholder,
-        isLock: false,
-        isPlaceholder: true
-      },
-      activeTabs: [],
-      toBeSelectTabs: []
-    }
-  },
-  computed: {
-    realActiveTabs() {
-      return this.activeTabs.filter(tab => tab.name)
-    },
-    showAddIcon() {
-      return this.isActiveEdit && this.realActiveTabs.length < this.MAX_TAB_LEN
-    }
-  },
-  created() {
-    this.initializeTabs()
-  },
-  methods: {
-    getMovableItem(tab) {
-      return this.isActiveEdit && !tab.isLock && !tab.isPlaceholder
-    },
-    initializeTabs() {
-      const lang = v => this.$t(v)
-      this.activeTabs = [
-        { name: lang('开机'), iconUrl: `${QINIU_URL}Fp5T9lSNakoiioji6S7W4DmFQ_ys`, isLock: true },
-        { name: lang('闪灯鸣笛'), iconUrl: `${QINIU_URL}FpeQsDh2dbeTullNLI-HhWj4WAQS` },
-        { name: lang('打开座桶'), iconUrl: `${QINIU_URL}FppwhbFzrEmDeJQgZJtDTu6WOoMZ` },
-        { name: lang('打开尾箱'), iconUrl: `${QINIU_URL}Fv3KLuYWEeV5IM4_2sMbmur7yZtz` }
-      ]
-      this.toBeSelectTabs = [
-        { name: lang('胎压'), iconUrl: `${QINIU_URL}FmbcjmvoB4J3CT1hrbjNX4kxv9Zq` },
-        { name: lang('点出信息'), iconUrl: `${QINIU_URL}Fnx_4tLoq1ytvVA0UemepWisI73A` },
-        { name: lang('导航'), iconUrl: `${QINIU_URL}FrA_ouJtDp-39g7rMBI0EYr2czVE` }
-      ]
-      this.addPlaceholders()
-    },
-    toggleEdit() {
-      this.isActiveEdit = !this.isActiveEdit
-    },
-    deleteTab(tab) {
-      if (tab.isLock) return
-      const index = this.activeTabs.findIndex(t => t.name === tab.name)
-      if (index !== -1) {
-        const removedTab = this.activeTabs.splice(index, 1)[0]
-        this.toBeSelectTabs.push(removedTab)
-        this.addPlaceholders()
-      }
-    },
-    addItemTab(tab) {
-      const index = this.toBeSelectTabs.findIndex(t => t.name === tab.name)
-      if (index !== -1) {
-        const removedTab = this.toBeSelectTabs.splice(index, 1)[0]
-        const placeholderIndex = this.activeTabs.findIndex(v => v.isPlaceholder)
-        this.activeTabs.splice(placeholderIndex, 1, removedTab)
-        if (this.realActiveTabs.length > this.MAX_TAB_LEN - 1) {
-          this.isActiveEdit = false
-        }
-      }
-    },
-    addPlaceholders() {
-      while (this.activeTabs.length < this.MAX_TAB_LEN) {
-        this.activeTabs.push({ ...this.placeholderTab })
-      }
-    },
-    toUnbind() {
-      uni.navigateTo({
-        url: '/pages/carFunctionSet/unbind'
-      })
-    }
-  }
-}
+	// import draggable from 'vuedraggable'
+	import {
+		QINIU_URL
+	} from '@/common/constant'
+	import BasicDrag from '@/components/basic-drag/index.vue';
+	import {
+		setFunctionTag,
+		getFunctionTag,
+	} from '@/common/storage.js';
+	const ICONS = {
+		lock: `${QINIU_URL}FgMCTZCySvEgLYgkzU65BUR4f4Ls`,
+		edit: `${QINIU_URL}Fq3V1Zi5tKH7ibTwG1nO7N96CU8m`,
+		add: `${QINIU_URL}FqLEWbMe8DcnQtNz6GdDDD87ObZK`,
+		placeholder: `${QINIU_URL}FpKvfFNSDbx0d9RDwyGAQdFb7Kt6`
+	}
+
+	export default {
+		components: {
+			// draggable
+			BasicDrag
+		},
+		data() {
+			const MAX_TAB_LEN = 4
+			return {
+				QINIU_URL,
+				MAX_TAB_LEN,
+				icons: ICONS,
+				isActiveEdit: false,
+				activeTabs: [],
+				toBeSelectTabs: []
+			}
+		},
+		computed: {
+			realActiveTabs() {
+				return this.activeTabs.filter(tab => tab.name)
+			},
+			showAddIcon() {
+				return this.isActiveEdit && this.realActiveTabs.length < this.MAX_TAB_LEN
+			}
+		},
+		created() {
+			this.initializeTabs()
+		},
+		methods: {
+			endFn(list, removedTab) {
+				if (removedTab) {
+					this.toBeSelectTabs.push(removedTab)
+					this.activeTabs = list
+					if (this.activeTabs.length < this.MAX_TAB_LEN) {
+						this.isActiveEdit = true
+					}
+				}
+				this.activeTabsSetFn()
+			},
+			getMovableItem(tab) {
+				return this.isActiveEdit && !tab.isLock && !tab.isPlaceholder
+			},
+			initializeTabs() {
+				const lang = v => this.$t(v)
+				this.activeTabs = getFunctionTag().activeTag
+				this.toBeSelectTabs = getFunctionTag().tag
+			},
+			toggleEdit(e) {
+				this.isActiveEdit = e
+			},
+			addItemTab(tab) {
+				const index = this.toBeSelectTabs.findIndex(t => t.name === tab.name)
+				if (index !== -1) {
+					const removedTab = this.toBeSelectTabs.splice(index, 1)[0]
+					this.activeTabs.push(removedTab)
+					if (this.realActiveTabs.length == this.MAX_TAB_LEN) {
+						this.isActiveEdit = false
+					}
+				}
+				this.activeTabsSetFn()
+			},
+
+			//处理修改之后的数据
+			activeTabsSetFn() {
+				let obj = {
+					activeTag: this.activeTabs,
+					tag: this.toBeSelectTabs,
+				}
+				setFunctionTag(obj)
+			},
+
+
+			toUnbind() {
+				uni.navigateTo({
+					url: '/pages/carFunctionSet/unbind'
+				})
+			}
+		}
+	}
 </script>
 
 <style lang="scss" scoped>
-@import "@/libs/css/layout.scss";
-
-.car-function-set-more {
-  .fn-wrap {
-    width: 100%;
-    background: #FFFFFF;
-    border-radius: 40rpx;
-    margin-bottom: 20rpx;
-    padding: 40rpx 0 48rpx;
-
-    .title {
-      font-family: PingFangSC, PingFang SC;
-      font-weight: 400;
-      font-size: 36rpx;
-      color: #060809;
-      margin-bottom: 16rpx;
-      padding-left: 40rpx;
-
-      .sort-num {
-        margin-left: 12rpx;
-        width: 36rpx;
-        font-family: Futura, Futura;
-        font-size: 30rpx;
-        color: #060809;
-      }
-    }
-
-    .tab-item-container {
-      display: flex;
-
-      &.is-to-be-select {
-        flex-wrap: wrap;
-      }
-    }
-
-    .tab-item {
-      text-align: center;
-      width: 25%;
-      position: relative;
-      margin-top: 24rpx;
-
-      .right-icon {
-        position: absolute;
-        right: 20rpx;
-        top: 0;
-        width: 40rpx;
-        height: 40rpx;
-        z-index: 9;
-      }
-
-      .icon {
-        width: 112rpx;
-        height: 112rpx;
-        margin-bottom: 20rpx;
-      }
-
-      .name {
-        font-size: 28rpx;
-        color: #060809;
-
-        &.shake {
-          animation: shake 0.2s ease-in-out infinite;
-        }
-      }
-    }
-  }
-
-  .tips {
-    font-size: 24rpx;
-    color: #060809;
-    text-align: center;
-    margin-top: 32rpx;
-  }
-
-  .un-bind-btn {
-    position: absolute;
-    bottom: 56rpx;
-    left: 50%;
-    transform: translateX(-50%);
-    width: 93%;
-    padding: 24rpx;
-    text-align: center;
-    background: #E4E7EC;
-    border-radius: 40rpx;
-    font-family: PingFangSC, PingFang SC;
-    font-weight: bold;
-    font-size: 32rpx;
-    color: #060809;
-
-    &:active {
-      opacity: .7;
-    }
-  }
-}
-</style>
+	@import "@/libs/css/layout.scss";
+
+	.car-function-set-more {
+		.fn-wrap {
+			width: 100%;
+			background: #FFFFFF;
+			border-radius: 40rpx;
+			margin-bottom: 20rpx;
+			padding: 40rpx 0 48rpx;
+
+			.title {
+				font-family: PingFangSC, PingFang SC;
+				font-weight: 400;
+				font-size: 36rpx;
+				color: #060809;
+				margin-bottom: 16rpx;
+				padding-left: 40rpx;
+
+				.sort-num {
+					margin-left: 12rpx;
+					width: 36rpx;
+					font-family: Futura, Futura;
+					font-size: 30rpx;
+					color: #060809;
+				}
+			}
+
+			.tab-item-container {
+				display: flex;
+
+				&.is-to-be-select {
+					flex-wrap: wrap;
+				}
+			}
+
+			.tab-item {
+				text-align: center;
+				width: 25%;
+				position: relative;
+				margin-top: 24rpx;
+
+				.right-icon {
+					position: absolute;
+					right: 20rpx;
+					top: 0;
+					width: 40rpx;
+					height: 40rpx;
+					z-index: 9;
+				}
+
+				.icon {
+					width: 112rpx;
+					height: 112rpx;
+					margin-bottom: 20rpx;
+				}
+
+				.name {
+					font-size: 28rpx;
+					color: #060809;
+
+					&.shake {
+						animation: shake 0.2s ease-in-out infinite;
+					}
+				}
+			}
+		}
+
+		.tips {
+			font-size: 24rpx;
+			color: #060809;
+			text-align: center;
+			margin-top: 32rpx;
+		}
+
+		.un-bind-btn {
+			position: absolute;
+			bottom: 56rpx;
+			left: 50%;
+			transform: translateX(-50%);
+			width: 93%;
+			padding: 24rpx;
+			text-align: center;
+			background: #E4E7EC;
+			border-radius: 40rpx;
+			font-family: PingFangSC, PingFang SC;
+			font-weight: bold;
+			font-size: 32rpx;
+			color: #060809;
+
+			&:active {
+				opacity: .7;
+			}
+		}
+	}
+</style>

pages/index/components/control/control.vue

@@ -1,23 +1,11 @@
 <template>
     <view class="container-view-contril">
 		<scroll-view class="scroll-view flex-row" scroll-x="true">
-			<view @tap="tapOpen" class="contril-item flex-row">
-				<img class="contril-item-img"  src="https://qiniu.bms16.com/FmDQhes8TGJh0GZB1Hu3yePuUsRw" alt="">
-				<text>{{$t("开机")}}</text>
+			<view @tap="tapOpen" v-for="(item,index) of contrilList" :key="index" class="contril-item flex-row">
+				<img class="contril-item-img"  :src="item.iconUrl" alt="">
+				<text>{{item.name}}</text>
 			</view>
-			<view @tap="tapOpen" class="contril-item flex-row">
-				<img class="contril-item-img" src="https://qiniu.bms16.com/FjoP6k55xhNkbJa-Zm582KQcbuy8" alt="">
-				<text>{{$t("闪灯鸣笛")}}</text>
-			</view>
-			<view @tap="tapOpen" class="contril-item flex-row">
-				<img class="contril-item-img" src="https://qiniu.bms16.com/FsUx45Qk6skjrCZuFHHMcqp6WR_I" alt="">
-				<text>{{$t("打开座桶")}}</text>
-			</view>
-			<view @tap="tapOpen" class="contril-item flex-row">
-				<img class="contril-item-img" src="https://qiniu.bms16.com/FjgrfPEufqSzOxb6Aobuc_bbbtJE" alt="">
-				<text>{{$t("打开尾箱")}}</text>
-			</view>
-			<view class="contril-item flex-row" @tap="tapOpenMore">
+			<view class="contril-item flex-row" @tap="toMoreFunctionSet">
 				<img class="contril-item-img" src="https://qiniu.bms16.com/Ft3pNyStT22LP8Ds1Mru2LoTHadx" alt="">
 				<text>{{$t("更多功能")}}</text>
 			</view>
@@ -40,7 +28,7 @@
 				<view class="sure-btn ok-btn" >确定</view>
 			</view>
 		</u-popup> -->
-		<view v-if="isShowMore" class="show-more">
+		<!-- <view v-if="isShowMore" class="show-more">
 			<view class="more-info">
 				<view class="flex-row flex-between model-title">
 					<view>{{$t("更多功能")}}</view>
@@ -68,31 +56,33 @@
 				</view>
 			</view>
 		</view>
-    </view>
+   -->
+   
+	</view>
 </template>
 
 <script>
 // component/nomore/nomore.js
+
 export default {
+	props:{
+		contrilList: {
+			type: Array,
+			default: () => []
+		},
+	},
+	
     data() {
         return {
-			contrilList:[
-				{text:'开机',imgSrc:'https://qiniu.bms16.com/FgxiD-W96FGvgyLI_kXUfWVDYLQ9'},
-				{text:'闪灯鸣笛',imgSrc:'https://qiniu.bms16.com/FgxiD-W96FGvgyLI_kXUfWVDYLQ9'},
-				{text:'闪灯鸣笛',imgSrc:'https://qiniu.bms16.com/FgxiD-W96FGvgyLI_kXUfWVDYLQ9'},
-				{text:'闪灯鸣笛',imgSrc:'https://qiniu.bms16.com/FgxiD-W96FGvgyLI_kXUfWVDYLQ9'},
-				{text:'闪灯鸣笛',imgSrc:'https://qiniu.bms16.com/FgxiD-W96FGvgyLI_kXUfWVDYLQ9'},
-				],
 			popupShow:false,
 			controlType:null,//选择的车辆控制
 			isShowMore:false
 		};
     },
-    /**
-     * 组件的属性列表
-     */
-    props: {
-    },
+	mounted() {
+		// this.contrilList = getFunctionTag().activeTag
+	},
+ 
     /**
      * 组件的方法列表
      */
@@ -104,7 +94,7 @@ export default {
 			this.popupShow=false
 		},
 		tapOpenMore(){
-			this.isShowMore=true
+			// this.isShowMore=true
 		},
 		closeMore(){
 			this.isShowMore=false

pages/index/index.vue

@@ -32,7 +32,7 @@
 					<img src="https://qiniu.bms16.com/FsL6XWGoIhfsVB7jRg6EGFVsuaTZ" style="width: 24rpx;height: 32rpx;" alt="">
 				</view>
 			</view>
-			<Control/>
+			<Control :contrilList="contrilList" />
 			<view class="flex-row flex-between map-card-view" >
 				<MapCard latitude="23.099994" longitude="113.324004" :carAddress="carAddress" :carLocation="carLocation"/>
 				<view class="card-right">
@@ -104,11 +104,14 @@
 	import UnleasedPages from './components/unleasedPages/unleasedPages'
 	import CustomTabbar from '@/component/customTabbar/index';
 	import BluetoothUnlockAuth from '../bluetoothUnlock/bluetoothUnlockAuth.vue'
-
+import {
+		getFunctionTag,
+	} from '@/common/storage.js';
 
 	export default {
 		data() {
 			return {
+				contrilList:[],
 				carLocation: [{
 					id: 1345,
 					latitude: 23.099994,
@@ -151,6 +154,9 @@
 		 * 生命周期函数--监听页面显示
 		 */
 		onShow: function() {
+			console.log(33333333)
+			console.log(getFunctionTag().activeTag)
+			this.contrilList = getFunctionTag().activeTag
 			const user_token = storage.getUserToken()
 				if (!user_token) {
 					this.loadIsLogin()

pages/my/my.vue

@@ -53,6 +53,10 @@
   import Confirm from '@/component/comPopup/Confirm'
   import { QINIU_URL, defaultHeadImg } from '@/common/constant'
   import CustomTabbar from '@/component/customTabbar/index'
+  
+  var config = require('../../common/config_gyq.js');
+  var http = require('../../common/request.js');
+  
   export default {
     components: {
       Confirm,
@@ -98,10 +102,14 @@
       user_token && this.loadUserInfo()
     },
     methods: {
-      loadUserInfo() {
+      async loadUserInfo() {
         const userInfo = storage.getUserInfoData()
-        console.log('userInfo', userInfo)
         this.setData({ userInfo })
+		let {data} = await http.postApi(config.API_USER_INFO,{})
+		if(data.code == 200){
+			this.userInfo = data.data.userInfo
+			storage.setUserInfoData(this.userInfo)
+		}
       },
       loginHandle() {
         uni.navigateTo({ url: '/pages/loginRegister/login' })

pages/my/set.vue

@@ -1,6 +1,6 @@
 <template>
     <view class="set-page zx-container">
-      <image :src="userInfo.headImg || defaultHeadImg" class="head-img" />
+      <image @click="editAvatarFn" :src="userInfo.headimg || defaultHeadImg" class="head-img" />
       <view class="list-wrap">
         <view
           v-for="(item, index) in list"
@@ -10,7 +10,7 @@
         >
           <view class="title">{{ item.title }}</view>
           <view :class="['text-right', item.hideArrow && 'hide-arrow']">
-			  <input class="inp" @input="inpfn" v-if="item.textProp == 'nickname'" v-model="userInfo[item.textProp]" type="text" />
+			  <input class="inp" @blur="inpfn" v-if="item.textProp == 'nickname'" v-model="userInfo[item.textProp]" type="text" />
 			  <block v-else>
 				  {{ userInfo[item.textProp] || '' }}
 			  </block>
@@ -51,21 +51,24 @@
     methods: {
 		 inpfn(e){
 			console.log(e.detail.value)
+			this.editUserInfoFn()
 		},
 		editAvatarFn(){
-			common.upLoadImgQiNiu( (imgUrl)=> {
-			   console.log(imgUrl)
+			let _this = this
+			common.upLoadImgQiNiu((imgUrl)=> {
+				_this.userInfo.headimg = imgUrl
+				_this.editUserInfoFn()
 			});
 		},
 		async editUserInfoFn(){
 			let {data} = await http.postApi(config.API_USER_MODIFY_USER_INFO,{
 				nickname:this.userInfo.nickname,
-				head_img:this.userInfo.head_img,
+				head_img:this.userInfo.headimg,
 			})
+			storage.setUserInfoData(this.userInfo)
 		},
       loadUserInfo() {
         const userInfo = storage.getUserInfoData()
-        console.log('userInfo', userInfo)
         this.setData({ userInfo })
       },
       routerLink(url) {