Skip to content

肖康 / H5_2.0

Go to a project
Commit 05b68135 by LJM
Options

保存品牌

parent 276575ec
Inline Side-by-side
Showing with 354 additions and 55 deletions
assets/css/mine/company.scss
......@@ -112,10 +112,10 @@
}
.layer-box {
padding: 0 24rpx 30rpx 24rpx;
background: linear-gradient(180deg, #f0f6ff 0%, #ffffff 88rpx);
border-radius: 10rpx 10rpx 0px 0px;
.title {
padding: 0 24rpx;
height: 88rpx;
margin-bottom: 13rpx;
.left {
......@@ -131,6 +131,7 @@
}
}
.search {
margin: 0 24rpx;
height: 72rpx;
background: #f5f5f7;
border-radius: 10rpx;
......@@ -145,7 +146,7 @@
}
}
.info {
padding: 16rpx 0 16rpx 24rpx;
padding: 16rpx 24rpx 16rpx 24rpx;
.t1 {
font-size: 22rpx;
color: #484b59;
......@@ -158,6 +159,8 @@
.list {
background: #f5f5f7;
padding: 24rpx;
max-height: 500rpx;
overflow-y: auto;
margin-bottom: 24rpx;
.box {
padding-left: 24rpx;
......@@ -172,6 +175,10 @@
background-size: cover;
}
.tt {
max-width: 80%;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
margin-left: 24rpx;
font-size: 24rpx;
color: #484b59;
......
pages/mine/company.vue
......@@ -4,32 +4,32 @@
<view class="form-box">
<view class="input-box column">
<text class="tt">公司名称：</text>
<view><input type="text" placeholder="请输入公司名称" class="uni-input" /></view>
<view><input type="text" placeholder="请输入公司名称" class="uni-input" v-model="formParams.com_name" /></view>
</view>
<view class="input-box column">
<text class="tt">公司座机：</text>
<view><input type="text" placeholder="请输入公司座机" class="uni-input" /></view>
<view><input type="text" placeholder="请输入公司座机" class="uni-input" v-model="formParams.com_telphone" /></view>
</view>
<view class="input-box column">
<text class="tt">移动电话：</text>
<view class="row verCenter mobile">
<view class="picker-box">
<picker @change="bindPickerChange" :value="index" :range="array">
<picker @change="bindPickerChange($event, 1)" :value="index" :range="array">
<view class="row verCenter bothSide">
<view class="uni-inputs">{{ array[index] }}</view>
<view class="iconfont icon-arrbot"></view>
</view>
</picker>
</view>
<input type="number" placeholder="请输入电话号码" placeholder-style="color:#919399;" class="uni-input" v-model="formParams.account" />
<input type="number" placeholder="请输入电话号码" placeholder-style="color:#919399;" class="uni-input" v-model="formParams.com_mobile" />
</view>
</view>
<view class="input-box column">
<text class="tt">公司类型：</text>
<view class="select-box">
<picker @change="bindPickerChange" :value="index" :range="array">
<picker @change="bindPickerChange($event, 2)" :value="typeIndex" :range="typeArr" :range-key="'name'">
<view class="row verCenter bothSide">
<view class="uni-input row verCenter">{{ array[index] }}</view>
<view class="uni-input row verCenter">{{ typeIndex == -1 ? '请选择' : typeArr[typeIndex].name }}</view>
<view class="iconfont icon-arrbot"></view>
</view>
</picker>
......@@ -37,33 +37,34 @@
</view>
<view class="input-box column">
<text class="tt">传真号码：</text>
<view><input type="text" placeholder="请输入传真号码" class="uni-input" /></view>
<view><input type="text" placeholder="请输入传真号码" class="uni-input" v-model="formParams.com_fax" /></view>
</view>
<view class="input-box column">
<text class="tt">公司地址：</text>
<view class="select-box">
<picker @change="bindPickerChange" :value="index" :range="array">
<picker mode="multiSelector" @change="pickerChange" @columnchange="bindMultiPickerColumnChange" :value="multiIndex" :range="multiArray" :range-key="'name'">
<view class="row verCenter bothSide">
<view class="uni-input row verCenter">{{ array[index] }}</view>
<view class="uni-input row verCenter">{{ selectText }}</view>
<view class="iconfont icon-arrbot"></view>
</view>
</picker>
</view>
<view class="textarea-box" style="margin-top: 16rpx;"><textarea placeholder="请输入详情地址"></textarea></view>
<view class="textarea-box" style="margin-top: 16rpx;"><textarea placeholder="请输入详情地址" v-model="formParams.com_address"></textarea></view>
</view>
<view class="input-box column">
<view class="row bothSide verCenter">
<text class="tt">主营品牌：</text>
<text class="sel" @click="open()">选择品牌</text>
</view>
<view class="textarea-box" style="margin-top: 16rpx;"><textarea placeholder="请选择品牌"></textarea></view>
<view class="textarea-box" style="margin-top: 16rpx;"><textarea placeholder="请选择品牌" v-model="brand_text"></textarea></view>
</view>
<view class="input-box column">
<text class="tt">公司简介：</text>
<view class="textarea-box" style="margin-top: 16rpx;"><textarea placeholder="请输入公司简介"></textarea></view>
<view class="textarea-box" style="margin-top: 16rpx;"><textarea placeholder="请输入公司简介" v-model="formParams.com_desc"></textarea></view>
</view>
</view>
<view class="btn"><view class="btn1 row rowCenter verCenter">保存</view></view>
<view class="btn"><view class="btn1 row rowCenter verCenter" @click="changeUserInfo()">保存</view></view>
<!-- 选择品牌 -->
<uni-popup ref="popup" type="bottom">
<view class="layer-box">
<view class="title row verCenter bothSide">
......@@ -71,37 +72,21 @@
<view class="right row"><text class="iconfont icon-xxx" @click="close()"></text></view>
</view>
<view class="search row bothSide verCenter">
<input type="text" placeholder="请输入品牌" class="input" />
<input type="text" placeholder="请输入品牌" class="input" @click="handleInput" v-model="brand_name" />
<text class="iconfont icon-search"></text>
</view>
<view class="info">
<text class="t1">当前已选</text>
<text class="t2">2</text>
<text class="t2">{{ filter_id.length }}</text>
<text class="t1">个品牌</text>
</view>
<view class="list">
<view class="box row verCenter curr">
<view class="box row verCenter" v-for="(item, index) in brandList" :key="item.brand_id" @click="filterChange(index)" :class="{ curr: filter_list[index] }">
<text class="arrow"></text>
<text class="tt">AVAGO TECHNOLOGIES LIMITED</text>
<text class="tt">{{ item.brand_name }}</text>
</view>
<view class="box row verCenter">
<text class="arrow"></text>
<text class="tt">AVAGO TECHNOLOGIES LIMITED</text>
</view>
<view class="box row verCenter">
<text class="arrow"></text>
<text class="tt">AVAGO TECHNOLOGIES LIMITED</text>
</view>
<view class="box row verCenter">
<text class="arrow"></text>
<text class="tt">AVAGO TECHNOLOGIES LIMITED</text>
</view>
<view class="box row verCenter">
<text class="arrow"></text>
<text class="tt">AVAGO TECHNOLOGIES LIMITED</text>
</view>
</view>
<view class="save row rowCenter verCenter">保存</view>
<view class="save row rowCenter verCenter" @click="saveBrandList()">保存</view>
</view>
</uni-popup>
</view>
......@@ -110,30 +95,309 @@
<script>
import { Api_Url } from '@/util/api.js';
import navElement from '@/components/nav.vue';
import debounce from 'lodash/debounce';
import { createArray } from '@/util/util.js';
export default {
components: {
navElement
},
data() {
return {
companyInfo: {},
index: 0,
array: ['0086', '00886', '00853', '00852'],
typeArr: [{ name: '代理商', value: 3 }, { name: '终端采购商', value: 1 }, { name: '代工厂', value: 2 }, { name: '学校、科研机构', value: 4 }, { name: '贸易商', value: 5 }, { name: '个人', value: 0 }, { name: '其他', value: 6 }],
typeIndex: -1,
selectText: '请选择省市区',
multiArray: [[], [], []],
multiIndex: [0, 0, 0],
brandList: [],
brand_name: '',
brand_text: '',
filter_list: [], //筛选已选中的列表
filter_id: [], //过滤处理的idsss
formParams: {
account: ''
com_name: '',
com_telphone: '',
com_mobile: '',
type_id: '',
intl_code: '',
com_fax: '',
com_province_id: '',
com_city_id: '',
com_area_id: '',
com_address: '',
com_desc: ''
}
};
},
onShow() {},
onShow() {
this.getData();
},
methods: {
bindPickerChange: function(e) {
/**
* 搜索
* @param {Object} event
*/
handleInput: debounce(function(event) {
this.getBrandList();
}, 800),
/**
* @param {Object} arr
* @param {Object} target
* @param {Object} type
*/
findIndex(arr, target, type) {
const result = [];
arr.map((item, index) => {
if (type) {
if (item.value == target) {
result.push(index);
}
} else {
if (item == target) {
result.push(index);
}
}
});
return result;
},
/**
* 筛选过滤出选中的元素
*/
filterChange(index) {
this.$set(this.filter_list, index, (this.filter_list[index] = !this.filter_list[index]));
let filter_arr = this.findIndex(this.filter_list, true);
this.filter_id = filter_arr.map(i => this.brandList[i].brand_id);
},
/**
* 获取品牌
*/
getBrandList() {
this.request(Api_Url + '/public/getBrandList', 'POST', { brand_name: this.brand_name }, true, true).then(res => {
if (res.err_code === 0) {
this.brandList = res.data;
this.filter_list = createArray(res.data.length, false);
}
});
},
getData() {
this.request(Api_Url + '/user/getUserType', 'POST', {}, true, true).then(res => {
if (res.err_code === 0) {
this.formParams.com_name = res.data.company_info.com_name;
this.formParams.com_telphone = res.data.company_info.com_telphone;
this.formParams.com_mobile = res.data.company_info.com_mobile;
this.formParams.com_desc = res.data.company_info.com_desc;
this.formParams.com_fax = res.data.company_info.com_fax;
this.formParams.com_province_id = res.data.company_info.com_province_id;
this.formParams.com_city_id = res.data.company_info.com_city_id;
this.formParams.com_area_id = res.data.company_info.com_area_id;
this.formParams.com_address = res.data.company_info.com_address;
this.formParams.type_id = res.data.company_info.type_id;
this.formParams.intl_code = res.data.company_info.intl_code;
//品牌
if (res.data.company_info.brand_list.length > 0) {
var brand_name = res.data.company_info.brand_list.map(function(brand) {
return brand.brand_name;
});
this.brand_text = brand_name.join(',');
} else {
this.brand_text = '';
}
//intl_code
let index = this.findIndex(this.array, res.data.company_info.intl_code);
this.index = index;
//公司类型
let typeIndex = this.findIndex(this.typeArr, res.data.company_info.type_id, true);
this.typeIndex = typeIndex;
//初始化省市区
this.getProvince(1, res.data.company_info.com_province_id);
this.selectText = `${res.data.company_info.province_name + ',' + res.data.company_info.city_name + ',' + res.data.company_info.area_name}`;
} else if (res.err_code === 11012) {
uni.navigateTo({
url: '/login'
});
}
});
},
/**
* 保存品牌
*/
saveBrandList() {
this.request(Api_Url + '/user/saveBrandList', 'POST', { brand_id: this.filter_id.join(',') }, false, true).then(res => {
if (res.err_code === 0) {
uni.showToast({
title: '保存成功',
icon: 'success'
});
setTimeout(() => {
this.request(Api_Url + '/user/getUserType', 'POST', {}, true, true).then(res => {
if (res.err_code === 0) {
//品牌
if (res.data.company_info.brand_list.length > 0) {
var brand_name = res.data.company_info.brand_list.map(function(brand) {
return brand.brand_name;
});
this.brand_text = brand_name.join(',');
} else {
this.brand_text = '';
}
}
});
this.close();
}, 2000);
} else {
uni.showToast({
title: res.err_msg,
icon: 'none'
});
}
});
},
bindPickerChange: function(e, type) {
console.log('picker发送选择改变，携带值为', e.detail.value);
if (type == 1) {
this.index = e.detail.value;
this.formParams.intl_code = this.array[e.detail.value];
} else {
this.typeIndex = e.detail.value;
this.formParams.type_id = this.typeArr[e.detail.value].value;
}
},
/**
* 地址监听
* @param {Object} e
*/
bindMultiPickerColumnChange(e) {
console.log(e.detail);
if (e.detail.column === 0) {
// 第一列滑动
this.multiIndex[0] = e.detail.value;
this.getCity(this.multiArray[0][e.detail.value].value, true);
// 第一列滑动之后 第二列 和第三列 都变为第一个
this.multiIndex.splice(1, 1, 0);
this.multiIndex.splice(2, 1, 0);
} else if (e.detail.column === 1) {
// 第二列滑动
this.multiIndex[1] = e.detail.value;
this.getDistrict(this.multiArray[1][e.detail.value].value);
// 第二列滑动之后 第三列 变成第一个
this.multiIndex.splice(2, 1, 0);
} else if (e.detail.column === 2) {
// 第三列滑动
this.multiIndex[2] = e.detail.value;
}
this.$forceUpdate();
},
/**
* 省市区完成
* @param {Object} e
*/
pickerChange(e) {
this.multiIndex = e.detail.value;
this.formParams.com_province_id = this.multiArray[0][this.multiIndex[0]].value;
this.formParams.com_city_id = this.multiArray[1][this.multiIndex[1]].value;
this.formParams.com_area_id = this.multiArray[2][this.multiIndex[2]].value;
this.selectText = `${this.multiArray[0][this.multiIndex[0]].name + ',' + this.multiArray[1][this.multiIndex[1]].name + ',' + this.multiArray[2][this.multiIndex[2]].name}`;
},
open() {
this.getBrandList();
this.$refs.popup.open('bottom');
},
close() {
this.$refs.popup.close();
},
/**
* 获取省数据
*/
getProvince(id = 1, defaultValue) {
console.log('获取省数据id：' + id);
this.request(Api_Url + '/address/pcd', 'POST', { id: id }, false, true).then(res => {
if (res.err_code === 0) {
var arr = [];
for (var key in res.data) {
arr.push({ name: res.data[key], value: parseInt(key) });
}
this.multiArray[0] = arr;
if (defaultValue) {
let index = this.findIndex(arr, defaultValue, true);
this.multiIndex.splice(0, 1, index[0]);
}
this.getCity(this.formParams.com_province_id, this.formParams.com_city_id);
this.$forceUpdate();
}
});
},
/**
* @param {Object} id
* @param {Object} defaultValue
*/
getCity(id, defaultValue) {
console.log('获取市数据id：' + id);
this.request(Api_Url + '/address/pcd', 'POST', { id: id }, false, true).then(res => {
if (res.err_code === 0) {
var arr = [];
for (var key in res.data) {
arr.push({ name: res.data[key], value: parseInt(key) });
}
this.multiArray[1] = arr;
if (defaultValue) {
let index = this.findIndex(arr, defaultValue, true);
this.multiIndex.splice(1, 1, index[0]);
this.getDistrict(this.formParams.com_city_id, this.formParams.com_area_id);
}
this.$forceUpdate();
}
});
},
/**
* 获取区数据
* @param {Object} id
*/
getDistrict(id, defaultValue) {
console.log('获取区数据id：' + id);
this.request(Api_Url + '/address/pcd', 'POST', { id: id }, false, true).then(res => {
if (res.err_code === 0) {
var arr = [];
for (var key in res.data) {
arr.push({ name: res.data[key], value: parseInt(key) });
}
this.multiArray[2] = arr;
if (defaultValue) {
let index = this.findIndex(arr, defaultValue, true);
this.multiIndex.splice(2, 1, index[0]);
}
this.$forceUpdate();
}
});
},
changeUserInfo() {
this.request(Api_Url + '/user/changeUserInfo', 'POST', this.formParams, true, true).then(res => {
if (res.err_code === 0) {
uni.showToast({
title: '保存成功',
icon: 'success'
});
setTimeout(() => {
uni.navigateBack({
delta: 1
});
}, 2000);
} else {
uni.showToast({
title: res.err_msg,
icon: 'none'
});
}
});
}
}
};
......
pages/mine/setting.vue
<template>
<view class="page-setting">
<navElement title="账户设置"></navElement>
<view class="list">
<view class="list" v-if="userInfo.user_info">
<navigator class="box row bothSide verCenter" url="/forget" hover-class="none">
<view class="text">
<text class="t1">手机号</text>
<text class="t2">18589050841</text>
<text class="t2">{{ userInfo.user_info.mobile }}</text>
</view>
<view class="right">
<text class="t1">修改密码</text>
<text class="iconfont icon-jt"></text>
</view>
</navigator>
<navigator class="box row bothSide verCenter curr" url="/user/bindMail" hover-class="none">
<view class="text"><text class="t1">邮箱</text></view>
<navigator class="box row bothSide verCenter" url="/user/bindMail" hover-class="none">
<view class="text">
<text class="t1">邮箱</text>
<text class="t2">{{ userInfo.user_info.email }}</text>
</view>
<view class="right">
<text class="t1">绑定</text>
<text class="iconfont icon-jt"></text>
......@@ -44,35 +47,35 @@
<view class="show-info">
<view class="label-box">
<text class="t1">公司名称：</text>
<text class="t2">深圳市猎芯科技有限公司</text>
<text class="t2">{{ userInfo.company_info.com_name }}</text>
</view>
<view class="label-box">
<text class="t1">公司坐机：</text>
<text class="t2">0755-12345678</text>
<text class="t1">公司座机：</text>
<text class="t2">{{ userInfo.company_info.com_telphone }}</text>
</view>
<view class="label-box">
<text class="t1">移动电话：</text>
<text class="t2">13800138000</text>
<text class="t2">{{ userInfo.company_info.com_mobile }}</text>
</view>
<view class="label-box">
<text class="t1">公司类型：</text>
<text class="t2">个人</text>
<text class="t2">{{ userInfo.company_info.type_name }}</text>
</view>
<view class="label-box">
<text class="t1">传真号码：</text>
<text class="t2">0755-12345678</text>
<text class="t2">{{ userInfo.company_info.com_fax }}</text>
</view>
<view class="label-box row">
<text class="t1">公司地址：</text>
<text class="t2">深圳市龙岗区坂田街道岗头社区清湖工业区宝能科技园(南区)一期B区B3栋1101</text>
<text class="t2">{{ userInfo.company_info.province_name }}{{ userInfo.company_info.city_name }}{{ userInfo.company_info.area_name }}{{ userInfo.company_info.com_address }}</text>
</view>
<view class="label-box row">
<text class="t1">主营品牌：</text>
<text class="t2" style="color: #1969F9;">SAMWIN（西安芯派）</text>
<text class="t2" style="color: #1969F9;">--</text>
</view>
<view class="label-box row">
<text class="t1">公司简介：</text>
<text class="t2">深圳市龙岗区坂田街道岗头社区清湖工业区宝能科技园(南区)一期B区B3栋1101</text>
<text class="t2">{{ userInfo.company_info.com_desc }}</text>
</view>
</view>
</view>
......@@ -90,10 +93,25 @@ export default {
navElement
},
data() {
return {};
return {
userInfo: {}
};
},
onShow() {
this.getData();
},
onShow() {},
methods: {
getData() {
this.request(Api_Url + '/user/getUserType', 'POST', {}, true, true).then(res => {
if (res.err_code === 0) {
this.userInfo = res.data;
} else if (res.err_code === 11012) {
uni.navigateTo({
url: '/login'
});
}
});
},
exit() {
uni.showModal({
title: '',
......
util/util.js
......@@ -156,11 +156,20 @@ const startCountdown = (options) => {
};
}
/**
* 来创建指定长度且所有元素都被初始化为 false 的数组
*/
const createArray = (length, value) => {
return Array(length).fill(value);
}
module.exports = {
request,
getPlatform,
setCookie,
getCookie,
delCookie,
startCountdown
startCountdown,
createArray
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment