xinyouhe/crm-uni
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

地图页面 及页面加语言编译

Browse Source
This commit is contained in:
浅念
2025-03-19 15:39:21 +08:00
parent 1faedd2fd5
commit bfd28be350
9 changed files with 779 additions and 273 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/customer/add.vue
+53 -35
View File
@@ -1,95 +1,95 @@
<template> <template>
<view> <view>
<uni-nav-bar leftText=" " :fixed="true" :border="false" leftIcon="back" @clickLeft="leftClick" color="#000000" backgroundColor="#fff" :statusBar="true" title="客户资料"></uni-nav-bar> <uni-nav-bar leftText=" " :fixed="true" :border="false" leftIcon="back" @clickLeft="leftClick" color="#000000" backgroundColor="#fff" :statusBar="true" :title="$t('navbar.customerinfo')"></uni-nav-bar>
<view class="content"> <view class="content">
<view class="cell"> <view class="cell">
<view>渠道</view> <view>{{$t('customer.CustomerChannel')}}</view>
<view class="right select" @click="showchannel = true"> <view class="right select" @click="showchannel = true">
<input placeholder="选择渠道" disabled v-model="channel_name" /> <input :placeholder="$t('customer.CustomerChannelinput')" disabled v-model="channel_name" />
<u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="showchannel" @cancel="cancel('showchannel')" :columns="channelList" keyName="name" @confirm="channelChange"></u-picker> <u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="showchannel" @cancel="cancel('showchannel')" :columns="channelList" keyName="name" @confirm="channelChange"></u-picker>
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon> <u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>客户商机</view> <view>{{$t('customer.Medal')}}</view>
<view class="right select" @click="showmagnitude = true"> <view class="right select" @click="showmagnitude = true">
<input placeholder="选择客户商机" disabled v-model="magnitude_name" /> <input :placeholder="$t('customer.Medalinput')" disabled v-model="magnitude_name" />
<u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="showmagnitude" @cancel="cancel('showmagnitude')" :columns="magnitudeList" keyName="name" @confirm="magnitudeChange"></u-picker> <u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="showmagnitude" @cancel="cancel('showmagnitude')" :columns="magnitudeList" keyName="name" @confirm="magnitudeChange"></u-picker>
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon> <u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>客户名称 <text class="red">*</text></view> <view>{{$t('customer.CustomerName')}} <text class="red">*</text></view>
<view class="right"> <view class="right">
<input placeholder="输入名称" v-model="form.contacts" /> <input :placeholder="$t('customer.CustomerNameinput')" v-model="form.contacts" />
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>性别</view> <view>{{$t('gender')}}</view>
<view class="right"> <view class="right">
<u-radio-group v-model="form.sex"> <u-radio-group v-model="form.sex">
<u-radio name="0">未知</u-radio> <u-radio name="0">{{$t('gender0')}}</u-radio>
<u-radio name="1">男</u-radio> <u-radio name="1">{{$t('gender1')}}</u-radio>
<u-radio name="2">女</u-radio> <u-radio name="2">{{$t('gender2')}}</u-radio>
</u-radio-group> </u-radio-group>
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>联系方式 <text class="red">*</text></view> <view>{{$t('mine.lxcall')}} <text class="red">*</text></view>
<view class="right"> <view class="right">
<input placeholder="输入联系方式" v-model="form.phone" /> <input :placeholder="$t('mine.lxcallinputhd')" v-model="form.phone" />
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>Email</view> <view>Email</view>
<view class="right"> <view class="right">
<input placeholder="输入Email" v-model="form.email" /> <input :placeholder="$t('customer.Emailinput')" v-model="form.email" />
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>WhatsApp</view> <view>WhatsApp</view>
<view class="right"> <view class="right">
<input placeholder="输入WhatsApp" v-model="form.WhatsApp" /> <input :placeholder="$t('customer.WhatsAppinput')" v-model="form.WhatsApp" />
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>客户偏好</view> <view>{{$t('customer.Customerph')}}</view>
<view class="right select" @click="showcartype = true"> <view class="right select" @click="showcartype = true">
<input placeholder="选择客户偏好" disabled v-model="car_type_name" /> <input :placeholder="$t('customer.Customerphinput')" disabled v-model="car_type_name" />
<u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="showcartype" @cancel="cancel('showcartype')" :columns="carTypeList" keyName="name" @confirm="cartypesChange"></u-picker> <u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="showcartype" @cancel="cancel('showcartype')" :columns="carTypeList" keyName="name" @confirm="cartypesChange"></u-picker>
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon> <u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>客户分级</view> <view>{{$t('customer.Cstomerfj')}}</view>
<view class="right select" @click="showgrade = true"> <view class="right select" @click="showgrade = true">
<input placeholder="选择客户分级" disabled v-model="grade_name" /> <input :placeholder="$t('customer.Cstomerfjinput')" disabled v-model="grade_name" />
<u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="showgrade" @cancel="cancel('showgrade')" :columns="getGradeList" keyName="name" @confirm="gradeHandler"></u-picker> <u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="showgrade" @cancel="cancel('showgrade')" :columns="getGradeList" keyName="name" @confirm="gradeHandler"></u-picker>
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon> <u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>国家</view> <view>{{$t('customer.Country')}}</view>
<view class="right select" @click="showarea = true"> <view class="right select" @click="showarea = true">
<input placeholder="选择国家" disabled v-model="country_name" /> <input :placeholder="$t('customer.Cstomerfjinput')" disabled v-model="country_name" />
<u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="showarea" @cancel="cancel('showarea')" :columns="areaList" keyName="name" @confirm="areaChange"></u-picker> <u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="showarea" @cancel="cancel('showarea')" :columns="areaList" keyName="name" @confirm="areaChange"></u-picker>
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon> <u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>公司</view> <view>{{$t('customer.Company')}}</view>
<view class="right select" @click="showmap = true"> <view class="right select" @click="gomap">
<input placeholder="去定位" type="text" disabled v-model="form.address"/> <input :placeholder="$t('customer.Companyinput')" type="text" disabled v-model="form.address"/>
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon> <u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
</view> </view>
</view> </view>
@@ -102,29 +102,28 @@
</view> --> </view> -->
<u-line></u-line> <u-line></u-line>
<view class="cell1"> <view class="cell1">
<view>备注(非必填)</view> <view>{{$t('customer.Remarks')}}</view>
<view class=""> <view class="">
<textarea auto-height v-model="form.describe" placeholder="请输入备注内容~"/> <textarea auto-height v-model="form.describe" :placeholder="$t('customer.Remarksinputhd')"/>
</view> </view>
</view> </view>
<u-gap height="100" bgColor="#fff"></u-gap> <u-gap height="100" bgColor="#fff"></u-gap>
</view> </view>
<view class="foot"> <view class="foot">
<button class="btn" @click="saveFn">提交</button> <button class="btn" @click="saveFn">{{$t('submit')}}</button>
</view> </view>
<u-popup :show="showmap" :round="10" mode="bottom" @close="mapclose"> <!-- <u-popup :show="showmap" :round="10" mode="bottom" @close="mapclose" width="90%" height="70%">
<view class="mapcont"> <view class="mapcont">
<view class="header"> <view class="header">
<view class="cancel" @click="mapclose">取消</view> <view class="cancel" @click="mapclose">取消</view>
<view class="title">地图位置</view> <view class="title">地图位置</view>
<view class="confirm" @click="mapconfirm">确定</view> <view class="confirm" @click="mapconfirm">确定</view>
</view> </view>
<view class="map"> <view class="map" id="map">
</view> </view>
</view> </view>
</u-popup> </u-popup> -->
@@ -135,6 +134,7 @@
export default { export default {
data() { data() {
return { return {
mapUrl: '',
showmap: false, showmap: false,
showmagnitude: false, showmagnitude: false,
showgrade: false, showgrade: false,
@@ -163,7 +163,10 @@
channel_id:'', channel_id:'',
magnitude:'', magnitude:'',
address:'', address:'',
} lat:'',
lng:'',
},
location:{}
} }
}, },
onLoad() { onLoad() {
@@ -173,10 +176,28 @@
this.carType() this.carType()
this.area() this.area()
}, },
onShow() {
console.log(uni.getStorageSync('location'))
if(uni.getStorageSync('location')){
this.location = JSON.parse(uni.getStorageSync('location'))
this.form.address = this.location.address
this.form.lng = this.location.lng
this.form.lat = this.location.lat
console.log(this.location)
}
},
mounted() {
// this.initMap();
},
methods: { methods: {
leftClick(){ leftClick(){
uni.navigateBack({}) uni.navigateBack({})
}, },
gomap(){
uni.navigateTo({
url: '/pages/customer/map'
});
},
mapclose(){ mapclose(){
this.showmap = false this.showmap = false
}, },
@@ -312,9 +333,6 @@
padding: 15px; padding: 15px;
border-radius: 10px; border-radius: 10px;
} }
.u-divider{
margin: 0px 0px !important;
}
.uniui-right{ .uniui-right{
position: absolute; position: absolute;
top: 2px; top: 2px;
pages/customer/detile.vue
+100 -46
View File
@@ -1,103 +1,103 @@
<template> <template>
<view> <view>
<uni-nav-bar leftText=" " :fixed="true" :border="false" leftIcon="back" @clickLeft="leftClick" color="#000000" backgroundColor="#fff" :statusBar="true" title="客户资料"></uni-nav-bar> <uni-nav-bar leftText=" " :fixed="true" :border="false" leftIcon="back" @clickLeft="leftClick" color="#000000" backgroundColor="#fff" :statusBar="true" :title="$t('customer.customerinfo')"></uni-nav-bar>
<view class="content"> <view class="content">
<view class="cell"> <view class="cell">
<view>渠道</view> <view>{{$t('customer.CustomerChannel')}}</view>
<view class="right select" @click="showchannel = true"> <view class="right select" @click="showchannel = true">
<input placeholder="选择渠道" disabled v-model="channel_name" /> <input :placeholder="$t('customer.CustomerChannelinput')" disabled v-model="channel_name" />
<u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :defaultIndex="defaultIndexqd" :show="showchannel" @cancel="cancel('showchannel')" :columns="channelList" keyName="name" @confirm="channelChange"></u-picker> <u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :defaultIndex="defaultIndexqd" :show="showchannel" @cancel="cancel('showchannel')" :columns="channelList" keyName="name" @confirm="channelChange"></u-picker>
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon> <u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>客户商机</view> <view>{{$t('customer.Medal')}}</view>
<view class="right select" @click="showmagnitude = true"> <view class="right select" @click="showmagnitude = true">
<input placeholder="选择客户商机" disabled v-model="magnitude_name" /> <input :placeholder="$t('customer.Medalinput')" disabled v-model="magnitude_name" />
<u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :defaultIndex="defaultIndexsj" :show="showmagnitude" @cancel="cancel('showmagnitude')" :columns="magnitudeList" keyName="name" @confirm="magnitudeChange"></u-picker> <u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :defaultIndex="defaultIndexsj" :show="showmagnitude" @cancel="cancel('showmagnitude')" :columns="magnitudeList" keyName="name" @confirm="magnitudeChange"></u-picker>
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon> <u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>客户名称 <text class="red">*</text></view> <view>{{$t('customer.CustomerName')}} <text class="red">*</text></view>
<view class="right"> <view class="right">
<input placeholder="输入名称" v-model="form.contacts" /> <input :placeholder="$t('customer.CustomerNameinput')" v-model="form.contacts" />
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>性别</view> <view>{{$t('gender')}}</view>
<view class="right"> <view class="right">
<u-radio-group v-model="form.sex"> <u-radio-group v-model="form.sex">
<u-radio name="0">未知</u-radio> <u-radio name="0">{{$t('gender0')}}</u-radio>
<u-radio name="1">男</u-radio> <u-radio name="1">{{$t('gender1')}}</u-radio>
<u-radio name="2">女</u-radio> <u-radio name="2">{{$t('gender2')}}</u-radio>
</u-radio-group> </u-radio-group>
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>联系方式 <text class="red">*</text></view> <view>{{$t('customer.lxcall')}} <text class="red">*</text></view>
<view class="right"> <view class="right">
<input placeholder="输入联系方式" v-model="form.phone" /> <input :placeholder="$t('mine.lxcallinputhd')" v-model="form.phone" />
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>Email</view> <view>Email</view>
<view class="right"> <view class="right">
<input placeholder="输入Email" v-model="form.email" /> <input :placeholder="$t('customer.Emailinput')" v-model="form.email" />
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>WhatsApp</view> <view>WhatsApp</view>
<view class="right"> <view class="right">
<input placeholder="输入WhatsApp" v-model="form.WhatsApp" /> <input :placeholder="$t('customer.WhatsAppinput')" v-model="form.WhatsApp" />
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>客户偏好</view> <view>{{$t('customer.Customerph')}}</view>
<view class="right select" @click="showcartype = true"> <view class="right select" @click="showcartype = true">
<input placeholder="选择客户偏好" disabled v-model="car_type_name" /> <input :placeholder="$t('customer.Customerphinput')" disabled v-model="car_type_name" />
<u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')":defaultIndex="defaultIndexph" :show="showcartype" @cancel="cancel('showcartype')" :columns="carTypeList" keyName="name" @confirm="cartypesChange"></u-picker> <u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')":defaultIndex="defaultIndexph" :show="showcartype" @cancel="cancel('showcartype')" :columns="carTypeList" keyName="name" @confirm="cartypesChange"></u-picker>
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon> <u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>客户分级</view> <view>{{$t('customer.Cstomerfj')}}</view>
<view class="right select" @click="showgrade = true"> <view class="right select" @click="showgrade = true">
<input placeholder="选择客户分级" disabled v-model="grade_name" /> <input :placeholder="$t('customer.Cstomerfjinput')" disabled v-model="grade_name" />
<u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :defaultIndex="defaultIndexfj" :show="showgrade" @cancel="cancel('showgrade')" :columns="getGradeList" keyName="name" @confirm="gradeHandler"></u-picker> <u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :defaultIndex="defaultIndexfj" :show="showgrade" @cancel="cancel('showgrade')" :columns="getGradeList" keyName="name" @confirm="gradeHandler"></u-picker>
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon> <u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>国家</view> <view>{{$t('customer.Country')}}</view>
<view class="right select" @click="showarea = true"> <view class="right select" @click="showarea = true">
<input placeholder="选择国家" disabled v-model="country_name" /> <input :placeholder="$t('customer.Cstomerfjinput')" disabled v-model="country_name" />
<u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :defaultIndex="defaultIndexgj" :show="showarea" @cancel="cancel('showarea')" :columns="areaList" keyName="name" @confirm="areaChange"></u-picker> <u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :defaultIndex="defaultIndexgj" :show="showarea" @cancel="cancel('showarea')" :columns="areaList" keyName="name" @confirm="areaChange"></u-picker>
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon> <u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>公司</view> <view>{{$t('customer.Company')}}</view>
<view class="right select" @click="showmap = true"> <view class="right select" @click="gomap">
<input placeholder="去定位" type="text" disabled v-model="form.address"/> <input :placeholder="$t('customer.Companyinput')" type="text" disabled v-model="form.address"/>
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon> <u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell1"> <view class="cell1">
<view>备注(非必填)</view> <view>{{$t('customer.Remarks')}}</view>
<view class=""> <view class="">
<textarea auto-height v-model="form.describe" placeholder="请输入备注内容~"/> <textarea auto-height v-model="form.describe" :placeholder="$t('customer.Remarksinputhd')"/>
</view> </view>
</view> </view>
</view> </view>
@@ -105,10 +105,10 @@
<view class="steps"> <view class="steps">
<view class="title"> <view class="title">
<view class=""> <view class="">
跟进记录 <text class="status">跟进中</text> {{$t('customer.followrecord')}} <text class="status" :style="{color:(datas.follow == 0 ?'#3471FF' : datas.follow == 1 ?'#27C89C': '#FF4040')}">{{datas.follow_txt}}</text>
</view> </view>
<view class="btnjl" @click="followupFn"> <view class="btnjl" @click="followupFn">
添加记录 {{$t('navbar.addfollow')}}
</view> </view>
</view> </view>
<u-steps v-if="followList.length>0" :current="followList.length" direction="column" dot> <u-steps v-if="followList.length>0" :current="followList.length" direction="column" dot>
@@ -117,10 +117,10 @@
<view class="" v-if="item.type==0"> <view class="" v-if="item.type==0">
<view class=""> <view class="">
<view class=""> <view class="">
时间：{{item.created_at}} {{$t('times')}} ：{{item.created_at}}
</view> </view>
<view class="">地址：{{item.address}}</view> <view class="">{{$t('address')}}：{{item.address}}</view>
<view class="">拜访内容：{{item.audio_text}}</view> <view class="">{{$t('customer.Visitcontent')}}：{{item.audio_text}}</view>
</view> </view>
<view class=""> <view class="">
<image :src="item.oss_picture" mode=""></image> <image :src="item.oss_picture" mode=""></image>
@@ -128,7 +128,7 @@
</view> </view>
<view class="" v-else> <view class="" v-else>
<view class=""> <view class="">
时间：{{item.created_at}} {{$t('times')}}：{{item.created_at}}
</view> </view>
<view class=""> <view class="">
<image :src="item.oss_picture" mode=""></image> <image :src="item.oss_picture" mode=""></image>
@@ -141,9 +141,9 @@
</view> </view>
<view class="zw"></view> <view class="zw"></view>
<view class="foot"> <view class="foot">
<button class="btn" @click="nextFn">提交</button> <button class="btn" @click="nextFn">{{$t('submit')}}</button>
</view> </view>
<u-popup :show="showmap" :round="10" mode="bottom" @close="mapclose"> <!-- <u-popup :show="showmap" :round="10" mode="bottom" @close="mapclose">
<view class="mapcont"> <view class="mapcont">
<view class="header"> <view class="header">
<view class="cancel" @click="mapclose">取消</view> <view class="cancel" @click="mapclose">取消</view>
@@ -154,7 +154,7 @@
</view> </view>
</view> </view>
</u-popup> </u-popup> -->
</view> </view>
</template> </template>
@@ -175,6 +175,11 @@
carTypeList:[], carTypeList:[],
channelList:[], channelList:[],
magnitudeList:[], magnitudeList:[],
getGradeList1:[],
carTypeLis1:[],
channelList1:[],
magnitudeList1:[],
areaList1:[],
areaList:[], areaList:[],
grade_name:'', grade_name:'',
car_type_name:'', car_type_name:'',
@@ -188,7 +193,7 @@
defaultIndexgj:[0], defaultIndexgj:[0],
form: { form: {
contacts: '', contacts: '',
sex: '0', sex: 0,
phone: '', phone: '',
email: '', email: '',
describe: '', describe: '',
@@ -198,7 +203,10 @@
channel_id:'', channel_id:'',
magnitude:'', magnitude:'',
address:'', address:'',
} lat:'',
lng:'',
},
datas:''
} }
}, },
@@ -215,14 +223,60 @@
}, },
onShow() { onShow() {
if(uni.getStorageSync('location')){
this.location = JSON.parse(uni.getStorageSync('location'))
this.form.address = this.location.address
this.form.lng = this.location.lng
this.form.lat = this.location.lat
console.log(this.location)
}
this.followlistfn() this.followlistfn()
}, },
methods: { methods: {
leftClick(){ leftClick(){
uni.navigateBack({}) uni.navigateBack({})
}, },
gomap(){
uni.navigateTo({
url: '/pages/customer/map'
});
},
select(){
var that=this;
that.channelList1.forEach((item,index) => {
if(item.id == that.form.channel_id){
that.channel_name = item.name
that.defaultIndexqd=[index]
}
})
that.getGradeList1.forEach((item,index) => {
if(item.id == that.form.grade){
that.grade_name = item.name
that.defaultIndexfj=[index]
}
})
that.carTypeList1.forEach((item,index) => {
if(item.id == that.form.car_type_id){
that.car_type_name = item.name
that.defaultIndexph=[index]
}
})
that.magnitudeList1.forEach((item,index) => {
if(item.id == that.form.magnitude){
that.magnitude_name = item.name
that.defaultIndexsj=[index]
}
})
that.areaList1.forEach((item,index) => {
if(item.id == that.form.country_id){
that.channel_name = item.name
that.defaultIndexgj=[index]
}
})
},
//客户详情 //客户详情
customerdetailfn(){ customerdetailfn(){
var that=this;
request({ request({
url:'customer/detail', url:'customer/detail',
method:'get', method:'get',
@@ -230,14 +284,9 @@
id:this.id, id:this.id,
} }
}).then(res => { }).then(res => {
this.form = res.data.data that.datas = res.data.data
that.channelList.forEach((item,index) => { that.form = res.data.data
if(item.id == this.form.channel_id){ that.select()
that.channel_name = item.name
that.defaultIndexqd=[index]
}
})
console.log(res.data.data)
}) })
}, },
// 跟进记录 // 跟进记录
@@ -272,6 +321,7 @@
method:'get', method:'get',
}).then(res => { }).then(res => {
var list = res.data.data var list = res.data.data
this.channelList1 = list
this.channelList = [list] this.channelList = [list]
}) })
}, },
@@ -283,6 +333,7 @@
}).then(res => { }).then(res => {
var list = res.data.data var list = res.data.data
this.getGradeList = [list] this.getGradeList = [list]
this.getGradeList1 = list
}) })
}, },
//偏好 //偏好
@@ -292,6 +343,7 @@
method:'get', method:'get',
}).then(res => { }).then(res => {
var list = res.data.data var list = res.data.data
this.carTypeList1 = list
this.carTypeList = [list] this.carTypeList = [list]
}) })
}, },
@@ -302,6 +354,7 @@
method:'get', method:'get',
}).then(res => { }).then(res => {
var list = res.data.data var list = res.data.data
this.areaList1 = list
this.areaList = [list] this.areaList = [list]
}) })
}, },
@@ -312,6 +365,7 @@
method:'get', method:'get',
}).then(res => { }).then(res => {
var list = res.data.data var list = res.data.data
this.magnitudeList1 = list
this.magnitudeList = [list] this.magnitudeList = [list]
}) })
}, },
@@ -404,6 +458,7 @@
} }
.steps{ .steps{
padding: 15px; padding: 15px;
background: #fff;
image{ image{
width: 44px; width: 44px;
height:44px; height:44px;
@@ -423,7 +478,6 @@
margin-bottom: 15px; margin-bottom: 15px;
.status{ .status{
font-size: 28rpx; font-size: 28rpx;
color: #3471FF;
margin-left: 10px; margin-left: 10px;
} }
.btnjl{ .btnjl{
pages/customer/followup.vue
+66 -42
View File
@@ -1,26 +1,26 @@
<template> <template>
<view> <view>
<uni-nav-bar leftText=" " :fixed="true" :border="false" leftIcon="back" @clickLeft="leftClick" color="#000000" backgroundColor="#fff" :statusBar="true" title="添加跟进"></uni-nav-bar> <uni-nav-bar leftText=" " :fixed="true" :border="false" leftIcon="back" @clickLeft="leftClick" color="#000000" backgroundColor="#fff" :statusBar="true" :title="$t('navbar.addfollowup')"></uni-nav-bar>
<view class="content"> <view class="content">
<view class="cell"> <view class="cell">
<view>跟进方式</view> <view>{{$t('customer.followtype')}}</view>
<view class="right"> <view class="right">
<u-radio-group v-model="form.type"> <u-radio-group v-model="form.type">
<u-radio name="1">在线跟进</u-radio> <u-radio name="1">{{$t('customer.Online')}}</u-radio>
<u-radio name="0">拜访</u-radio> <u-radio name="0">{{$t('customer.Visit')}}</u-radio>
</u-radio-group> </u-radio-group>
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell"> <view class="cell">
<view>跟进时间</view> <view>{{$t('customer.followtime')}} </view>
<view class="right" @click="show = true"> <view class="right" @click="show = true">
<input placeholder="跟进时间" v-model="form.firstFollowtime" /> <input :placeholder="$t('customer.followtime')" v-model="form.firstFollowtime" />
</view> </view>
</view> </view>
<u-line></u-line> <u-line></u-line>
<view class="cell1" v-if="form.type==1"> <view class="cell1" v-if="form.type==1">
<view>上传跟进最后聊天截图</view> <view>{{$t('customer.updataimg')}}</view>
<view style="margin-top: 10px;"> <view style="margin-top: 10px;">
<uni-file-picker fileMediatype="image" limit="1" :del-icon="false" disable-preview @select="select" @delete="delfn('picture')"> <uni-file-picker fileMediatype="image" limit="1" :del-icon="false" disable-preview @select="select" @delete="delfn('picture')">
<image src="/static/image/customer/upimg.png" mode="" class="addimg"></image> <image src="/static/image/customer/upimg.png" mode="" class="addimg"></image>
@@ -28,14 +28,14 @@
</view> </view>
</view> </view>
<view class="cell" v-if="form.type==0"> <view class="cell" v-if="form.type==0">
<view>当前位置</view> <view>{{$t('customer.followlocation')}}</view>
<view class="right"> <view class="right">
<input placeholder="输入当前位置" v-model="form.address" /> <input :placeholder="$t('customer.followlocation')" disabled v-model="form.address" />
</view> </view>
</view> </view>
<u-line v-if="form.type==0"></u-line> <u-line v-if="form.type==0"></u-line>
<view class="cell1" v-if="form.type==0"> <view class="cell1" v-if="form.type==0">
<view>当前位置拍照上传</view> <view>{{$t('customer.locationimg')}}</view>
<view style="margin-top: 10px;"> <view style="margin-top: 10px;">
<uni-file-picker fileMediatype="image" limit="1" :del-icon="false" disable-preview @select="select1" @delete="delfn('picture')"> <uni-file-picker fileMediatype="image" limit="1" :del-icon="false" disable-preview @select="select1" @delete="delfn('picture')">
<image src="/static/image/customer/upimg.png" mode="" class="addimg"></image> <image src="/static/image/customer/upimg.png" mode="" class="addimg"></image>
@@ -44,25 +44,25 @@
</view> </view>
<u-line v-if="form.type==0"></u-line> <u-line v-if="form.type==0"></u-line>
<view class="cell1" v-if="form.type==0"> <view class="cell1" v-if="form.type==0">
<view>拜访内容</view> <view>{{$t('customer.Visitcontent')}}</view>
<view class="yuyin"> <view class="yuyin">
<textarea auto-height v-model="form.audio_text" placeholder="拜访内容..."/> <textarea auto-height v-model="form.audio_text" :placeholder="$t('customer.Visiinputhd')"/>
<image src="/static/image/customer/yuyin.png" mode="" @tap="startRecognizebd"></image> <image src="/static/image/customer/yuyin.png" mode="" @tap="startRecognizebd"></image>
</view> </view>
</view> </view>
<u-line v-if="form.type==0"></u-line> <u-line v-if="form.type==0"></u-line>
<view class="cell1" v-if="form.type==0"> <view class="cell1" v-if="form.type==0">
<view>备注(非必填)</view> <view>{{$t('customer.Remarks')}}</view>
<view class="yuyin"> <view class="yuyin">
<textarea auto-height v-model="form.remark" placeholder="详细情况..."/> <textarea auto-height v-model="form.remark" :placeholder="$t('customer.Remarksinputhd')"/>
<image src="/static/image/customer/yuyin.png" mode="" @tap="startRecognize"></image> <!-- <image src="/static/image/customer/yuyin.png" mode="" @tap="startRecognize"></image> -->
</view> </view>
</view> </view>
</view> </view>
<u-gap height="10" bgColor="#F6F6F6"></u-gap> <u-gap height="10" bgColor="#F6F6F6"></u-gap>
<view class="steps"> <view class="steps">
<view class="title"> <view class="title">
跟进记录 <text class="status">跟进中</text> {{$t('customer.followrecord')}} <text class="status" :style="{color:(datas.follow == 0 ?'#3471FF' : datas.follow == 1 ?'#27C89C': '#FF4040')}">{{datas.follow_txt}}</text>
</view> </view>
<u-steps v-if="followList.length>0" :current="followList.length" direction="column" dot> <u-steps v-if="followList.length>0" :current="followList.length" direction="column" dot>
<u-steps-item :title="item.type_txt" v-for="(item, index) in followList" :key="index"> <u-steps-item :title="item.type_txt" v-for="(item, index) in followList" :key="index">
@@ -70,10 +70,10 @@
<view class="" v-if="item.type==0"> <view class="" v-if="item.type==0">
<view class=""> <view class="">
<view class=""> <view class="">
时间：{{item.created_at}} {{$t('times')}} ：{{item.created_at}}
</view> </view>
<view class="">地址：{{item.address}}</view> <view class="">{{$t('address')}}：{{item.address}}</view>
<view class="">拜访内容：{{item.audio_text}}</view> <view class="">{{$t('customer.Visitcontent')}}：{{item.audio_text}}</view>
</view> </view>
<view class=""> <view class="">
<image :src="item.oss_picture" mode=""></image> <image :src="item.oss_picture" mode=""></image>
@@ -81,7 +81,7 @@
</view> </view>
<view class="" v-else> <view class="" v-else>
<view class=""> <view class="">
时间：{{item.created_at}} {{$t('times')}}：{{item.created_at}}
</view> </view>
<view class=""> <view class="">
<image :src="item.oss_picture" mode=""></image> <image :src="item.oss_picture" mode=""></image>
@@ -94,8 +94,8 @@
</view> </view>
<u-gap height="100" bgColor="#fff"></u-gap> <u-gap height="100" bgColor="#fff"></u-gap>
<view class="foot"> <view class="foot">
<button class="btn1" @click="shownexttime=true">下次跟进提醒</button> <button class="btn1" @click="shownexttime=true">{{$t('customer.NextReminder')}}</button>
<button class="btn" @click="nextFn">提交</button> <button class="btn" @click="nextFn">{{$t('submit')}}</button>
</view> </view>
<u-datetime-picker <u-datetime-picker
:show="show" :show="show"
@@ -136,7 +136,8 @@
audio_text:'', audio_text:'',
remark:'', remark:'',
picture:'' picture:''
} },
datas:''
} }
}, },
onLoad(options) { onLoad(options) {
@@ -154,27 +155,30 @@
// 获取当前位置 // 获取当前位置
getarrd(longitude,latitude){ getarrd(longitude,latitude){
const apiKey = 'AIzaSyBGvV-vX7C72PEbcYrTdmUj3qrubejWzNw'; const apiKey = 'AIzaSyBGvV-vX7C72PEbcYrTdmUj3qrubejWzNw';
uni.request({
url: `https://www.google.com/maps/embed/v1/view?key=${apiKey}&location=${longitude},${latitude}`, uni.request({
success: (res) => { url: `https://maps.googleapis.com/maps/api/geocode/json?latlng=${latitude},${longitude}&key=${apiKey}`,
console.log('逆地理编码结果：', res.data); success: (res) => {
if (res.data.status === '1') { if (res.data.results && res.data.results.length > 0) {
const address = res.data.regeocode.formatted_address; // 具体地址 this.form.address = res.data.results[0].formatted_address; // 获取格式化地址
console.log('具体地址：', address); console.log(res.data.results[0].formatted_address)
} } else {
}, console.error('未找到地址');
fail: (err) => { }
console.log('逆地理编码失败：', err); },
} fail: (err) => {
console.error('请求失败：', err);
},
}); });
}, },
getlocahost(){ getlocahost(){
var that = this
uni.getLocation({ uni.getLocation({
type: 'wgs84', // 默认为 wgs84 坐标系，可选 gcj02 type: 'wgs84', // 默认为 wgs84 坐标系，可选 gcj02
success: function (res) { success: function (res) {
console.log('当前位置的经度：' + res.longitude); console.log('当前位置的经度：' + res.longitude);
console.log('当前位置的纬度：' + res.latitude); console.log('当前位置的纬度：' + res.latitude);
getarrd(res.longitude,res.latitude) that.getarrd(res.longitude,res.latitude)
// 如果需要将经纬度转换为具体地址，可以使用逆地理编码 // 如果需要将经纬度转换为具体地址，可以使用逆地理编码
// 这里调用 uni.chooseLocation 或第三方地图服务（如高德、腾讯地图） // 这里调用 uni.chooseLocation 或第三方地图服务（如高德、腾讯地图）
}, },
@@ -207,6 +211,7 @@
customer_id:this.id, customer_id:this.id,
} }
}).then(res => { }).then(res => {
this.datas = res.data.data
this.followList = res.data.data this.followList = res.data.data
console.log(res.data.data) console.log(res.data.data)
}) })
@@ -223,12 +228,9 @@
icon: 'none' icon: 'none'
}); });
if(res.data.code ==0){ if(res.data.code ==0){
// setTimeout(() => { setTimeout(() => {
// uni.reLaunch({ uni.navigateBack({})
// url: '/pages/index/index',// 替换为你要跳转的页面路径 }, 1000);
// });
// }, 1000);
} }
}) })
}, },
@@ -262,6 +264,25 @@
this.shownexttime = false this.shownexttime = false
this.nexttime = this.result(e.value, e.mode) this.nexttime = this.result(e.value, e.mode)
console.log(this.nexttime) console.log(this.nexttime)
request({
url:'customer/followNext',
method:'post',
data:{
id:this.id,
follow_next:e.value
}
}).then(res => {
uni.showToast({
title: res.data.message,
icon: 'none'
});
if(res.data.code ==0){
setTimeout(() => {
uni.navigateBack({})
}, 1000);
}
})
}, },
change(e) { change(e) {
// console.log('change', e) // console.log('change', e)
@@ -422,6 +443,7 @@
padding-top: 20px; padding-top: 20px;
} }
.btn{ .btn{
font-size: 28rpx;
background: linear-gradient(to right, #3471FF, #6776FF); background: linear-gradient(to right, #3471FF, #6776FF);
color: white; color: white;
border-radius: 50px; border-radius: 50px;
@@ -431,6 +453,7 @@
margin-top: 20px; margin-top: 20px;
} }
.btn1{ .btn1{
font-size: 28rpx;
border: 1px solid #3471FF; border: 1px solid #3471FF;
background: #fff; background: #fff;
color: #3471FF; color: #3471FF;
@@ -456,6 +479,7 @@
} }
.steps{ .steps{
padding: 15px; padding: 15px;
background: #fff;
image{ image{
width: 44px; width: 44px;
height:44px; height:44px;
pages/customer/map.vue
+63
View File
@@ -0,0 +1,63 @@
<template>
<view>
<uni-nav-bar leftText=" " :fixed="true" :border="false" leftIcon="back" @clickLeft="leftClick" color="#000000" backgroundColor="#fff" :statusBar="true" title="map"></uni-nav-bar>
<web-view :src="src" style="width: 100%; height: 100%;" @message="postMessagefn"></web-view>
</view>
</template>
<script>
function receiveMessage(event){
// console.log(event.data)
if(event.data.type){
}else{
uni.setStorageSync('location', event.data);
uni.navigateBack({})
}
}
window.addEventListener("message", receiveMessage, false);
export default {
data() {
return {
src:''
}
},
onLoad() {
// 获取当前位置
this.getlocahost()
},
methods:{
postMessagefn(e){
console.log(e)
},
leftClick(){
uni.navigateBack({})
},
// 获取当前位置
getlocahost(){
var that = this;
uni.getLocation({
type: 'wgs84', // 默认为 wgs84 坐标系，可选 gcj02
success: function (res) {
var obj={}
obj.lng=res.longitude
obj.lat=res.latitude
var arr=[]
arr.push(obj)
console.log(arr)
that.src = 'http://219.157.255.213:8082?arr='+encodeURIComponent(JSON.stringify(arr))
},
fail: function (err) {
console.log('获取位置失败：', err);
},
complete: function () {
console.log('获取位置完成');
}
})
},
},
}
</script>
pages/index/customer.vue
+43 -8
View File
@@ -6,7 +6,7 @@
<view class="navbar">{{$t('customer.title')}}</view> <view class="navbar">{{$t('customer.title')}}</view>
<view class="topSearch"> <view class="topSearch">
<view class="left"> <view class="left">
<u-search v-model="value5" bgColor="#fff" search-icon=" " :show-action="false" :placeholder="$t('customer.inputhd')"></u-search> <u-search v-model="keyword" bgColor="#fff" search-icon=" " :show-action="false" :placeholder="$t('customer.inputhd')"></u-search>
<view @click="searchCli" class="search"> <view @click="searchCli" class="search">
<image src="/static/image/customer/search1.png" mode=""></image> <image src="/static/image/customer/search1.png" mode=""></image>
</view> </view>
@@ -56,7 +56,7 @@
</view> </view>
<view class="cent"> <view class="cent">
<view class="btn1" @click="showts = !showts">{{$t('cancel')}}</view> <view class="btn1" @click="showts = !showts">{{$t('cancel')}}</view>
<view class="btn" @click="showts = !showts">{{$t('confirm')}}</view> <view class="btn" @click="delfn()">{{$t('confirm')}}</view>
</view> </view>
</u-popup> </u-popup>
<movable-area class="movable-area"> <movable-area class="movable-area">
@@ -76,19 +76,24 @@
return { return {
x: 300, //x坐标 x: 300, //x坐标
y: 550, //y坐标 y: 550, //y坐标
value5:'', keyword:'',
follow_last:'',
show:false, show:false,
showts:false, showts:false,
del_id:'',
columns:[ columns:[
[{ [{
label: '全部',
id:''
},{
label: '当天跟进客户', label: '当天跟进客户',
id: 1 id: 0
}, { }, {
label: '近三天跟进客户', label: '近三天跟进客户',
id: 2 id: 1
}, { }, {
label: '近七天跟进客户', label: '近七天跟进客户',
id: 3 id: 2
}] }]
], ],
datalist:[], datalist:[],
@@ -98,16 +103,20 @@
const { windowWidth, windowHeight } = uni.getSystemInfoSync(); const { windowWidth, windowHeight } = uni.getSystemInfoSync();
this.x = windowWidth-70 this.x = windowWidth-70
this.y = windowHeight-55 this.y = windowHeight-55
uni.removeStorageSync('location')
}, },
methods: { methods: {
searchCli(){ searchCli(){
this.queryList(1, 10)
}, },
close() { close() {
this.show= false this.show= false
}, },
confirm(e) { confirm(e) {
console.log(e)
this.follow_last = e.value[0].id
this.show = false this.show = false
this.queryList(1, 10)
}, },
cancel() { cancel() {
this.show = false this.show = false
@@ -120,7 +129,9 @@
method:'get', method:'get',
data: { data: {
page:pageNo, page:pageNo,
per_page:10 per_page:10,
keyword:this.keyword,
follow_last:this.follow_last,
} }
}).then(res => { }).then(res => {
console.log(res.data) console.log(res.data)
@@ -167,8 +178,31 @@
}); });
}, },
delClick(item){ delClick(item){
this.del_id = item.id
this.showts=true this.showts=true
}, },
delfn(){
this.showts=false
request({
url:'customer/delete',
method:'get',
data: {
id:this.del_id,
}
}).then(res => {
uni.showToast({
title: res.data.message,
icon: 'none'
});
if(res.data.code ==0){
setTimeout(() => {
uni.reLaunch({
url: '/pages/index/customer',// 替换为你要跳转的页面路径
});
}, 1000);
}
})
},
addcustomer(){ addcustomer(){
uni.navigateTo({ uni.navigateTo({
url: '/pages/customer/add' url: '/pages/customer/add'
@@ -189,6 +223,7 @@
height: calc(100vh - 50px); height: calc(100vh - 50px);
} }
.navbar{ .navbar{
padding-top: 44px;
height: 44px; height: 44px;
line-height: 44px; line-height: 44px;
text-align: center; text-align: center;
pages/index/index.vue
+178 -114
View File
@@ -1,80 +1,88 @@
<template> <template>
<view class="content"> <view class="content">
<z-paging ref="paging" v-model="datalist" @query="queryList" style="background: #F3F3F3;" empty-view-text='暂无数据!'> <z-paging ref="paging" v-model="datalist" @query="queryList" style="background: #F3F3F3;"
<view class="contop"> empty-view-text='暂无数据!'>
<view class="changeyy" @click="showlang = true" > <template #top>
<image src="/static/image/change.png" mode=""></image>{{$t('home.langbtn')}} <view class="contop">
</view> <view class="changeyy" @click="showlang = true">
<view class="title"> <image src="/static/image/change.png" mode=""></image>{{$t('home.langbtn')}}
{{$t('home.title')}} HESU CRM </view>
</view> <view class="title">
<view class="num"> {{$t('home.title')}} HESU CRM
66 <text>{{$t('home.day')}}</text> </view>
</view> <view class="num">
</view> 66 <text>{{$t('home.day')}}</text>
<view class="data-briefing"> </view>
<view class="top"> </view>
<text>{{$t('home.databf')}}</text> <view class="data-briefing">
<view class="time" @click="show = true"> <view class="top">
<image src="/static/image/time.png" mode=""></image> <text>{{$t('home.databf')}}</text>
<u--input v-model="time" border="none" disabled disabledColor="#ffffff" style="width: 65px;margin-left: 5px;"></u--input> <view class="time" @click="show = true">
<u-icon name="arrow-down" color="#666666" size="16"></u-icon> <image src="/static/image/time.png" mode=""></image>
<u--input v-model="time" border="none" disabled disabledColor="#ffffff"
style="width: 65px;margin-left: 5px;"></u--input>
<u-icon name="arrow-down" color="#666666" size="16"></u-icon>
</view>
</view>
<view class="cont">
<u-grid :border="false">
<u-grid-item>
<text class="grid-num">{{statisticsdata.customer}}</text>
<text class="grid-text">{{$t('home.addkh')}}</text>
</u-grid-item>
<u-grid-item>
<text class="grid-num">{{statisticsdata.visit}}</text>
<text class="grid-text">{{$t('home.addbf')}}</text>
</u-grid-item>
<u-grid-item>
<text class="grid-num">{{statisticsdata.follow}}</text>
<text class="grid-text">{{$t('home.addgj')}}</text>
</u-grid-item>
</u-grid>
</view>
</view> </view>
</view>
<view class="cont">
<u-grid :border="false">
<u-grid-item>
<text class="grid-num">20</text>
<text class="grid-text">{{$t('home.addkh')}}</text>
</u-grid-item>
<u-grid-item>
<text class="grid-num">20</text>
<text class="grid-text">{{$t('home.addbf')}}</text>
</u-grid-item>
<u-grid-item>
<text class="grid-num">20</text>
<text class="grid-text">{{$t('home.addgj')}}</text>
</u-grid-item>
</u-grid>
</view>
</view>
<view class="userlist">
<u-sticky offset-top="-44" >
<view class="tabsbg"> <view class="tabsbg">
<u-tabs :list="list1" :scrollable="false"></u-tabs> <u-tabs :list="list1" :scrollable="false" @click="tabclick"></u-tabs>
</view> </view>
</u-sticky> </template>
<view class="userlist">
<view class="list"> <view class="list">
<userlist :list="datalist" @click="godetile"> <userlist :list="datalist" @click="godetile">
</userlist> </userlist>
</view> </view>
</view> </view>
</z-paging> </z-paging>
<u-datetime-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="show" v-model="value1" @confirm="confirm" @cancel="cancel" mode="year-month"></u-datetime-picker> <u-datetime-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="show" v-model="value1"
<u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="showlang" :columns="columns" @cancel="cancellang" @confirm="confirmlang" :title="$t('home.langbtn')" keyName="label"></u-picker> @confirm="confirm" @cancel="cancel" mode="year-month"></u-datetime-picker>
<u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="showlang" :columns="columns"
@cancel="cancellang" @confirm="confirmlang" :title="$t('home.langbtn')" keyName="label"></u-picker>
</view> </view>
</template> </template>
<script> <script>
import { request,showToast } from '@/api/apiT.js' import {
request,
showToast
} from '@/api/apiT.js'
import userlist from '@/components/userlist/index.vue'; import userlist from '@/components/userlist/index.vue';
export default { export default {
components: { components: {
userlist userlist
}, },
data() { data() {
return { return {
statisticsdata:{},
headerBgColor: 'transparent', // 初始背景色为透明 headerBgColor: 'transparent', // 初始背景色为透明
home: this.$t('tabbar.home'), home: this.$t('tabbar.home'),
value0: 0, value0: 0,
show: false, show: false,
showlang: false, showlang: false,
value1: Number(new Date()), value1: Number(new Date()),
timevalue:this.result(Number(new Date())), timevalue: this.result(Number(new Date())),
time:this.result(Number(new Date())), time: this.result(Number(new Date())),
datalist:[], datalist: [],
columns:[ follow:'',
columns: [
[{ [{
label: '中文', label: '中文',
id: 'zh' id: 'zh'
@@ -86,50 +94,77 @@
id: 'ru' id: 'ru'
}] }]
], ],
list1: [ list1: [{
{ name: this.$t('all'),
name: this.$t('all'), id:'all'
}, { }, {
name: this.$t('followup'), name: this.$t('followup'),
}, { id:'followup'
name: this.$t('deal') }, {
}, { name: this.$t('deal'),
name: this.$t('lost') id:'deal'
} }, {
] name: this.$t('lost'),
id:'lost'
}]
} }
}, },
onLoad() { onLoad() {
uni.removeStorageSync('location')
// this.getcustomerlist() // this.getcustomerlist()
uni.setTabBarItem({
index: 0,
text: this.$t('tabbar.home')
})
uni.setTabBarItem({
index: 1,
text: this.$t('tabbar.customer')
})
uni.setTabBarItem({
index: 2,
text: this.$t('tabbar.mine')
})
this.getstatistics()
}, },
methods: { methods: {
// 处理滚动事件 // 处理滚动事件
onPageScroll(event) { onPageScroll(event) {
const scrollTop = event.scrollTop || 0; const scrollTop = event.scrollTop || 0;
if (scrollTop > 310) { // 吸顶条件 if (scrollTop > 310) { // 吸顶条件
this.headerBgColor = '#E6EDFF'; // 吸顶时设置背景色 this.headerBgColor = '#E6EDFF'; // 吸顶时设置背景色
} else { } else {
this.headerBgColor = 'transparent'; // 取消吸顶时恢复背景色 this.headerBgColor = 'transparent'; // 取消吸顶时恢复背景色
} }
},
//统计数据
getstatistics(){
request({
url:'customer/statistics',
method:'get',
data:{
created:this.timevalue
}
}).then(res => {
console.log(res.data.data)
this.statisticsdata = res.data.data
})
}, },
cancellang() { cancellang() {
this.showlang = false this.showlang = false
}, },
//语言切换事件 //语言切换事件
confirmlang(e) { confirmlang(e) {
this.$i18n.locale = e.value[0].id this.$i18n.locale = e.value[0].id
this.showlang = false this.showlang = false
this.list1 = [ this.list1 = [{
{ name: this.$t('all'),
name: this.$t('all'), }, {
}, { name: this.$t('followup'),
name: this.$t('followup'), }, {
}, { name: this.$t('deal')
name: this.$t('deal') }, {
}, { name: this.$t('lost')
name: this.$t('lost') }];
}
];
uni.setTabBarItem({ uni.setTabBarItem({
index: 0, index: 0,
text: this.$t('tabbar.home') text: this.$t('tabbar.home')
@@ -143,6 +178,16 @@
text: this.$t('tabbar.mine') text: this.$t('tabbar.mine')
}) })
}, },
//tab标签切换
tabclick(e){
console.log(e)
if(e.id=='all'){
this.follow=''
}else{
this.follow=e.index - 1
}
this.queryList(1, 10)
},
//日期选择组件 //日期选择组件
confirm(e) { confirm(e) {
this.show = false this.show = false
@@ -152,40 +197,43 @@
}, },
confirm(e) { confirm(e) {
this.show = false this.show = false
const timeFormat = uni.$u.timeFormat
this.timevalue = timeFormat(e.value, 'yyyy-mm')
this.result(e.value, e.mode) this.result(e.value, e.mode)
this.getstatistics()
}, },
result(time, mode) { result(time, mode) {
const timeFormat = uni.$u.timeFormat const timeFormat = uni.$u.timeFormat
this.timevalue=timeFormat(time, 'yyyy-mm') this.time = timeFormat(time, 'yyyy-mm')
this.time=timeFormat(time, 'yyyy-mm')
return timeFormat(time, 'yyyy-mm') return timeFormat(time, 'yyyy-mm')
}, },
//客户列表数据 //客户列表数据
queryList(pageNo, pageSize) { queryList(pageNo, pageSize) {
var that = this; var that = this;
request({ request({
url:'customer/list', url: 'customer/list',
method:'get', method: 'get',
data: { data: {
page:pageNo, page: pageNo,
per_page:10 per_page: 10,
follow:this.follow
} }
}).then(res => { }).then(res => {
console.log(res.data) console.log(res.data)
if(res.data.code ==0){ if (res.data.code == 0) {
var datas = res.data.data.list; var datas = res.data.data.list;
this.$refs.paging.complete(datas); this.$refs.paging.complete(datas);
}else{ } else {
// this.$refs.paging.complete(null); // this.$refs.paging.complete(null);
// that.listlength=0 // that.listlength=0
} }
uni.stopPullDownRefresh(); uni.stopPullDownRefresh();
}) })
}, },
godetile(item){ godetile(item) {
console.log(item) console.log(item)
uni.navigateTo({ uni.navigateTo({
url: '/pages/customer/detile' url: '/pages/customer/detile?id='+item.id
}); });
} }
} }
@@ -193,89 +241,103 @@
</script> </script>
<style lang="scss"> <style lang="scss">
.u-pageicon{ .u-pageicon {
width: 18px; width: 18px;
height: 18px; height: 18px;
} }
.tabsbg{
.tabsbg {
border-radius: 16px 16px 0px 0px; border-radius: 16px 16px 0px 0px;
background:linear-gradient(to bottom, #E6EDFF, #eaeffa); background: #E6EDFF
} }
.changeyy{
.changeyy {
padding: 10px 15px; padding: 10px 15px;
border-radius: 50px; border-radius: 50px;
background-color: rgba(255, 255,255, 0.2); background-color: rgba(255, 255, 255, 0.2);
margin-bottom: 50rpx; margin-bottom: 50rpx;
display: inline-block; display: inline-block;
image{
image {
width: 14px; width: 14px;
height: 12px; height: 12px;
margin-right: 5px; margin-right: 5px;
} }
} }
.content{
.content {
width: 100%; width: 100%;
font-size: 28rpx; font-size: 28rpx;
position: relative; position: relative;
background: #F6F6F6; background: #F6F6F6;
.contop{ .contop {
background-image: url("/static/image/topbg.png"); background-image: url("/static/image/topbg.png");
background-size: 100%; background-size: 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
padding: 88rpx 30rpx 240rpx; padding: 88rpx 30rpx 240rpx;
color: #FFFFFF; color: #FFFFFF;
.title{ .title {
font-size: 32rpx; font-size: 32rpx;
margin-bottom: 20px; margin-bottom: 20px;
width: 58%; width: 58%;
} }
.num{
.num {
font-size: 60rpx; font-size: 60rpx;
font-weight: bold; font-weight: bold;
font-family: PingFang SC-Regular; font-family: PingFang SC-Regular;
text{
text {
font-size: 36rpx; font-size: 36rpx;
font-weight: 300; font-weight: 300;
margin-left: 6px; margin-left: 6px;
} }
} }
} }
.data-briefing{
.data-briefing {
background-color: #FFFFFF; background-color: #FFFFFF;
margin: 15px; margin: 15px;
padding: 15px; padding: 15px;
border-radius: 10px; border-radius: 10px;
margin-top: -21%; margin-top: -21%;
.top{
.top {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
text{
text {
font-size: 32rpx; font-size: 32rpx;
color: #222222; color: #222222;
font-weight: bold; font-weight: bold;
} }
.time{
.time {
display: flex; display: flex;
align-items: center; align-items: center;
color: #666666; color: #666666;
image{
image {
width: 15px; width: 15px;
height: 15px; height: 15px;
} }
} }
} }
.cont{
.cont {
margin-top: 20px; margin-top: 20px;
.grid-num{
.grid-num {
font-size: 36rpx; font-size: 36rpx;
color: #000000; color: #000000;
font-weight: bold; font-weight: bold;
} }
.grid-text{
.grid-text {
color: #222222; color: #222222;
font-size: 24rpx; font-size: 24rpx;
} }
@@ -283,11 +345,13 @@
} }
.userlist{
background-image: url(/static/image/cbg.png); .userlist {
background: linear-gradient(to bottom, #E6EDFF, #ffffff);
background-size: 100%; background-size: 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
.list{
.list {
padding: 15px; padding: 15px;
} }
} }
pages/index/mine.vue
+1
View File
@@ -135,6 +135,7 @@
background-repeat: no-repeat; background-repeat: no-repeat;
} }
.navbar{ .navbar{
padding-top: 44px;
height: 50px; height: 50px;
line-height: 50px; line-height: 50px;
text-align: center; text-align: center;
pages/login/index.vue
+34 -20
View File
@@ -8,50 +8,51 @@
<view class="inputs_button"> <view class="inputs_button">
<view class="inputs"> <view class="inputs">
<view class="account"> <view class="account">
<input type="text" v-model="email" placeholder="账号" /> <input type="text" v-model="email" :placeholder="$t('account')" />
</view> </view>
<view class="password"> <view class="password">
<u--input <u--input
type="password" type="password"
placeholder="密码" :placeholder="$t('password')"
v-model="password" v-model="password"
border="none" border="none"
></u--input> ></u--input>
</view> </view>
</view> </view>
<view class="forgot-password"> <view class="forgot-password">
<text @click="forgotPassword">忘记密码？</text> <view @click="regin">{{$t('reg')}}</view>
<view @click="forgotPassword">{{$t('fgpassword')}}？</view>
</view> </view>
<view class="button"> <view class="button">
<view @click="login"> <view @click="login">
登录 {{$t('login')}}
</view> </view>
</view> </view>
</view> </view>
<view class="three"> <view class="three">
<u-divider text="第三方登录" style="padding: 0px 40px;"></u-divider> <u-divider :text="$t('threelogin')" style="padding: 0px 40px;"></u-divider>
<u-grid :border="false" @click="click" align="center"> <u-grid :border="false" @click="click" align="center">
<u-grid-item> <u-grid-item>
<image src="/static/image/login/fenshu.png" mode=""></image> <image src="/static/image/login/fenshu.png" mode=""></image>
<text class="grid-text">飞书</text> <text class="grid-text">{{$t('Facebook')}}</text>
</u-grid-item> </u-grid-item>
<u-grid-item> <u-grid-item>
<image src="/static/image/login/emali.png" mode=""></image> <image src="/static/image/login/emali.png" mode=""></image>
<text class="grid-text">邮箱</text> <text class="grid-text">{{$t('email')}}</text>
</u-grid-item> </u-grid-item>
<u-grid-item> <u-grid-item>
<image src="/static/image/login/phone.png" mode=""></image> <image src="/static/image/login/phone.png" mode=""></image>
<text class="grid-text">手机</text> <text class="grid-text">{{$t('phone')}}</text>
</u-grid-item> </u-grid-item>
</u-grid> </u-grid>
</view> </view>
<view class="pact">
<radio :checked="pactChecked" activeBackgroundColor="#3264ed" activeBorderColor="#3264ed"
borderColor="#3264ed" color="#fff" @click="pactChange" />
<view>我已经阅读并同意<text @click="toPact">《用户协议》</text>和<text @click="toPact">《隐私协议》</text></view>
</view>
</view>
</view>
<view class="pact">
<radio :checked="pactChecked" activeBackgroundColor="#3264ed" activeBorderColor="#3264ed"
borderColor="#3264ed" color="#fff" @click="pactChange" />
<view>{{$t('agreeMsg')}}<text @click="toPact">{{$t('UserAgreement')}}</text>{{$t('and')}}<text @click="toPact">{{$t('Privacy')}}</text></view>
</view>
</view> </view>
</template> </template>
@@ -72,24 +73,34 @@
pactChange() { pactChange() {
this.pactChecked = !this.pactChecked this.pactChecked = !this.pactChecked
}, },
regin(){
uni.navigateTo({
url: '/pages/login/register'
})
},
forgotPassword(){
uni.navigateTo({
url: '/pages/mine/resetPwd'
})
},
login() { login() {
if(this.email==''){ if(this.email==''){
uni.showToast({ uni.showToast({
title:'邮箱不能为空', title:this.$t('emailerr'),
icon: 'none' icon: 'none'
}); });
return false return false
} }
if(this.password==''){ if(this.password==''){
uni.showToast({ uni.showToast({
title:'密码不能为空', title:this.$t('passworerr'),
icon: 'none' icon: 'none'
}); });
return false return false
} }
if(!this.pactChecked){ if(!this.pactChecked){
uni.showToast({ uni.showToast({
title:'请先勾选同意用户服务协议以及隐私政策', title:this.$t('agreementarr'),
icon: 'none' icon: 'none'
}); });
return false return false
@@ -105,7 +116,7 @@
console.log(res.data.data) console.log(res.data.data)
if (res.data.code == -1) { if (res.data.code == -1) {
uni.showToast({ uni.showToast({
title: res.data.msg, title: res.data.message,
icon: 'none' icon: 'none'
});token });token
@@ -199,7 +210,10 @@
} }
} }
.forgot-password { .forgot-password {
text-align: right; display: flex;
align-items: center;
justify-content:space-between;
// text-align: right;
margin-bottom: 20px; margin-bottom: 20px;
} }
.pact { .pact {
@@ -207,7 +221,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 24rpx; font-size: 24rpx;
margin-bottom: 20px;
text { text {
color: #3264ed; color: #3264ed;
} }
pages/login/register.vue
+233
View File
@@ -0,0 +1,233 @@
<template>
<view class="page">
<view class="title">
<image src="/static/image/hesu.png" mode=""></image>
</view>
<view class="form">
<view class="inputs_button">
<view class="inputs">
<view class="laber">{{$t('email')}}</view>
<view class="vcode">
<u--input
type="text"
v-model="email"
:placeholder="$t('email')"
border="none"
></u--input>
<text v-if="vcodeTime==0" @click="getVcode">{{$t('getcode')}}</text>
<text v-else style="color:#fff">({{vcodeTime}}s)</text>
</view>
<view class="password">
<u--input
type="text"
v-model="code"
:placeholder="$t('code')"
border="none"
></u--input>
</view>
<view class="laber">{{$t('password')}}</view>
<view class="account">
<u--input
type="password"
v-model="password"
:placeholder="$t('password')"
border="none"
></u--input>
</view>
</view>
<view class="button">
<view @click="login">
{{$t('reg')}}
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import { request,showToast } from '@/api/apiT.js'
export default {
data() {
return {
email: "",
code:'',
password: "",
pactChecked: false,
vcodeTime: 0,
vcodeTimer: null
}
},
onLoad() {
},
methods: {
leftClick(){
uni.navigateBack({})
},
login() {
if(this.email==''){
uni.showToast({
title:this.$t('emailerr'),
icon: 'none'
});
return false
}
if(this.password==''){
uni.showToast({
title:this.$t('passworerr'),
icon: 'none'
});
return false
}
if(this.code==''){
uni.showToast({
title:this.$t('codeerr'),
icon: 'none'
});
return false
}
request({
url:'user/register',
method:'POST',
data:{
email: this.email,
password: this.password,
code: this.code,
}
}).then(res => {
console.log(res.data.data)
uni.showToast({
title: res.data.message,
icon: 'none'
});
if(res.data.code ==0){
setTimeout(() => {
uni.navigateTo({
url: '/pages/login/index'
})
}, 1000);
}
})
},
getVcode() {
if(this.email==''){
uni.showToast({
title:this.$t('emailerr'),
icon: 'none'
});
return false
}
this.vcodeTime = 60
this.vcodeTimer = setInterval(() => {
if (this.vcodeTime > 0) {
this.vcodeTime--
} else {
clearInterval(this.vcodeTimer)
this.vcodeTimer = null
}
}, 1000)
request({
url:'user/sendCode',
method:'POST',
data:{
email: this.email,
}
}).then(res => {
console.log(res.data.data)
uni.showToast({
title:res.data.message,
icon: 'none'
})
})
},
}
}
</script>
<style lang="scss" scoped>
.page {
min-height: 100vh;
background-image: url("../../static/image/login/loginbg.png");
background-size: 100%;
background-repeat: no-repeat;
display: flex;
flex-direction: column;
justify-content: space-between;
.title {
padding-top: 220rpx;
text-align: center;
image{
width: 160px;
height: 37px;
}
}
.form {
flex: 1;
margin: 0 76rpx;
overflow: hidden;
.inputs_button {
.inputs {
padding: 150rpx 0px 0;
margin-bottom: 20rpx;
.laber{
color: #222222;
font-size: 32rpx;
line-height: 48px;
padding-left: 15px;
}
.account,
.vcode,
.password{
height: 80rpx;
border-radius: 50px;
padding: 0 30rpx;
display: flex;
align-items: center;
background-color: #F6F6F6;
input {
flex: 1;
}
}
.account {
margin-bottom: 48rpx;
}
.vcode {
margin-bottom: 10px;
padding-right: 0px;
text {
text-wrap: nowrap;
font-size: 26rpx;
padding: 14rpx 30rpx;
background-color: #3471FF;
border-radius: 50px;
color: #fff;
}
}
}
.button {
padding: 0 32rpx;
margin-top: 80rpx;
view {
line-height: 80rpx;
border-radius: 50px;
text-align: center;
font-size: 32rpx;
background: linear-gradient(to right, #3471FF, #6776FF);
color: #fff;
}
}
}
}
}
</style>