页面功能修改

This commit is contained in:
浅念
2025-03-21 17:57:32 +08:00
parent ddcf63d131
commit 7d1884ad0b
18 changed files with 1403 additions and 590 deletions
+94 -43
View File
@@ -3,7 +3,9 @@
<z-paging ref="paging" v-model="datalist" @query="queryList" empty-view-text='暂无数据!'>
<template #top>
<view class="top">
<view class="navbar">{{$t('customer.title')}}</view>
<!-- <view class="navbar">{{$t('customer.title')}}</view> -->
<uni-nav-bar leftText=" " :fixed="true" :border="false" @clickLeft="leftClick" color="#fff" backgroundColor="#3471ff" :statusBar="true" :title="$t('customer.title')"></uni-nav-bar>
<view class="topSearch">
<view class="left">
<u-search v-model="keyword" bgColor="#fff" search-icon=" " :show-action="false" :placeholder="$t('customer.inputhd')"></u-search>
@@ -16,37 +18,43 @@
</view>
</view>
</view>
<view class="tabsbg">
<u-tabs :list="list1" lineColor="#fff" :scrollable="false" @click="tabclick" :inactiveStyle="{color: '#fff'}" :activeStyle="{color: '#fff',fontWeight: 'bold',transform: 'scale(1.05)'}"></u-tabs>
</view>
</template>
<view class="list">
<view class="contents" v-for="(item, index) in datalist" :key="index" >
<view class="" @click="godetile(item)">
<view class="top">
<view class="">{{item.created_at}}</view>
<view class="right">
<text class="medal" :style="{color:(item.magnitude == 0 ?'#F5AB00' : item.magnitude == 1 ?'#8495B8': '#9B7200')}">{{item.magnitude_txt}}</text>
<text class="tag" :style="{background:(item.follow == 0 ?'#3471FF' : item.follow == 1 ?'#27C89C': '#FF4040')}">{{item.follow_txt}}</text>
<u-swipe-action>
<u-swipe-action-item :options="options1" v-for="(item, index) in datalist" :key="index" @click="delClick(item)">
<view class="contents" >
<view class="" @click="godetile(item)">
<view class="top">
<view class="">{{item.created_at}}</view>
<view class="right">
<text class="medal" :style="{color:(item.magnitude == 0 ?'#F5AB00' : item.magnitude == 1 ?'#8495B8': '#9B7200')}">{{item.magnitude_txt}}</text>
<text class="tag" :style="{background:(item.follow == 0 ?'#3471FF' : item.follow == 1 ?'#27C89C': '#FF4040')}">{{item.follow_txt}}</text>
</view>
</view>
<u-line margin="20rpx 0px"></u-line>
<view class="cont">
<view class="title">
<view class=""><text class="name">{{item.contacts}}</text><text class="phone">{{item.phone}}</text></view>
<view class="ststus">{{item.grade_txt}}</view>
</view>
<view class="info"><text class="sex">{{item.sex_txt}}</text> | <text class="addr">{{item.country_name}}</text><text class="type">{{item.car_type_name}}</text>
</view>
</view>
</view>
<view class="desc1">
<view class="" @click="callPhone(item)"><image src="/static/image/customer/phone.png" mode=""></image> {{$t('call')}}</view>
<view class="" @click="editClick(item)"><image src="/static/image/customer/edit.png" mode=""></image> {{$t('customer.addfollow')}}</view>
<!-- <view class="" @click="delClick(item)"><image src="/static/image/customer/trash.png" mode=""></image> {{$t('delete')}}</view> -->
</view>
</view>
<u-line margin="20rpx 0px"></u-line>
<view class="cont">
<view class="title">
<view class=""><text class="name">{{item.contacts}}</text><text class="phone">{{item.phone}}</text></view>
<view class="ststus">{{item.grade_txt}}</view>
</view>
<view class="info"><text class="sex">{{item.sex_txt}}</text> | <text class="addr">{{item.country_name}}</text><text class="type">{{item.car_type_name}}</text>
</view>
</view>
</view>
<view class="desc1">
<view class="" @click="callPhone(item)"><image src="/static/image/customer/phone.png" mode=""></image> {{$t('call')}}</view>
<view class="" @click="editClick(item)"><image src="/static/image/customer/edit.png" mode=""></image> {{$t('followup')}}</view>
<view class="" @click="delClick(item)"><image src="/static/image/customer/trash.png" mode=""></image> {{$t('delete')}}</view>
</view>
</view>
</u-swipe-action-item>
</u-swipe-action>
</view>
</z-paging>
<u-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="show" :columns="columns" @cancel="cancel" @confirm="confirm" :title="$t('customer.CustomerScreening')" keyName="label"></u-picker>
<u-picker closeOnClickOverlay :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="show" :columns="columns" @cancel="cancel" @close="cancel" @confirm="confirm" :title="$t('customer.CustomerScreening')" keyName="label"></u-picker>
<u-popup :show="showts" :closeOnClickOverlay="false" :round="20" mode="center">
<view class="popupcontent">
<view class="title">{{$t('prompt')}}</view>
@@ -74,28 +82,17 @@
export default {
data() {
return {
options1: [],
x: 300, //x坐标
y: 550, //y坐标
keyword:'',
follow_last:'',
follow:'',
show:false,
showts:false,
del_id:'',
columns:[
[{
label: this.$t('all'),
id:''
},{
label:this.$t('tday'),
id: 0
}, {
label: this.$t('threeday'),
id: 1
}, {
label: this.$t('sevenday'),
id: 2
}]
],
columns:[],
list1: [],
datalist:[],
}
},
@@ -105,6 +102,42 @@
this.y = windowHeight-55
uni.removeStorageSync('location')
},
onShow() {
this.options1=[{
text: this.$t('delete'),
style: {
backgroundColor: '#f56c6c'
}
}]
this.list1=[{
name: this.$t('all'),
id:'all'
}, {
name: this.$t('followup'),
id:'followup'
}, {
name: this.$t('deal'),
id:'deal'
}, {
name: this.$t('lost'),
id:'lost'
}]
this.columns=[
[{
label: this.$t('all'),
id:''
},{
label:this.$t('tday'),
id: 0
}, {
label: this.$t('threeday'),
id: 1
}, {
label: this.$t('sevenday'),
id: 2
}]
]
},
methods: {
searchCli(){
this.queryList(1, 10)
@@ -121,6 +154,16 @@
cancel() {
this.show = false
},
//tab标签切换
tabclick(e){
console.log(e)
if(e.id=='all'){
this.follow=''
}else{
this.follow=e.index - 1
}
this.queryList(1, 10)
},
//客户列表数据
queryList(pageNo, pageSize) {
var that = this;
@@ -128,6 +171,7 @@
url:'customer/list',
method:'get',
data: {
follow:this.follow,
page:pageNo,
per_page:10,
keyword:this.keyword,
@@ -216,6 +260,10 @@
uni-page-body {
background-color: #F6F6F6 !important;
}
.u-swipe-action-item {
margin-bottom: 10px;
border-radius: 10px;
}
.conts{
background-image: url("/static/image/customer/bg.png");
background-size: 100%;
@@ -224,7 +272,7 @@
}
.navbar{
/* #ifdef APP-PLUS */
padding-top: 44px;
// padding-top: 20px;
/* #endif */
height: 44px;
line-height: 44px;
@@ -257,7 +305,10 @@
padding: 6px 16px 2px;
text-align: center;
position: absolute;
top: 3px;
/* #ifdef APP-PLUS */
top: 3px;
/* #endif */
top: 2px;
right: 5px;
font-size: 12px;
image{
+68 -125
View File
@@ -1,57 +1,55 @@
<template>
<view class="content">
<z-paging ref="paging" v-model="datalist" @query="queryList" style="background: #F3F3F3;"
empty-view-text='暂无数据!' >
<template #top>
<view class="contop">
<view class="changeyy" @click="showlang = true">
<image src="/static/image/change.png" mode=""></image>{{$t('home.langbtn')}}
</view>
<view class="title">
{{$t('home.title')}} CRM
</view>
<view class="num">
{{statisticsdata.day}}<text>{{$t('home.day')}}</text>
</view>
</view>
<view class="data-briefing">
<view class="top">
<text>{{$t('home.databf')}}</text>
<view class="time" @click="show = true">
<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 class="tabsbg">
<u-tabs :list="list1" :scrollable="false" @click="tabclick"></u-tabs>
</view>
</template>
<view class="userlist">
<view class="list">
<userlist :list="datalist" @click="godetile">
</userlist>
<view class="contop">
<view class="changeyy" @click="showlang = true">
<image src="/static/image/change.png" mode=""></image>{{$t('home.langbtn')}}
</view>
<view class="title">
{{$t('home.title')}} CRM
</view>
<view class="num">
{{statisticsdata.day}}<text>{{$t('home.day')}}</text>
</view>
</view>
<view class="data-briefing">
<view class="top">
<text>{{$t('home.databf')}}</text>
<view class="time" @click="show = true">
<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>
</z-paging>
<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-item>
<text class="grid-num">{{statisticsdata.customer_init}}</text>
<text class="grid-text">{{$t('followup')}}</text>
</u-grid-item>
<u-grid-item>
<text class="grid-num">{{statisticsdata.customero_fllow}}</text>
<text class="grid-text">{{$t('deal')}}</text>
</u-grid-item>
<u-grid-item>
<text class="grid-num">{{statisticsdata.customer_deal}}</text>
<text class="grid-text">{{$t('lost')}}</text>
</u-grid-item>
</u-grid>
</view>
</view>
<u-datetime-picker closeOnClickOverlay :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="show" @close="close('show')" v-model="value1"
@confirm="confirm" @cancel="cancel" mode="year-month"></u-datetime-picker>
<u-picker closeOnClickOverlay :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" @close="close('showlang')" :show="showlang" :columns="columns"
@@ -64,11 +62,7 @@
request,
showToast
} from '@/api/apiT.js'
import userlist from '@/components/userlist/index.vue';
export default {
components: {
userlist
},
data() {
return {
statisticsdata:{},
@@ -94,19 +88,7 @@
id: 'ru'
}]
],
list1: [{
name: this.$t('all'),
id:'all'
}, {
name: this.$t('followup'),
id:'followup'
}, {
name: this.$t('deal'),
id:'deal'
}, {
name: this.$t('lost'),
id:'lost'
}]
}
},
onLoad() {
@@ -130,15 +112,6 @@
close(value){
this[value] = false
},
// 处理滚动事件
onPageScroll(event) {
const scrollTop = event.scrollTop || 0;
if (scrollTop > 310) { // 吸顶条件
this.headerBgColor = '#E6EDFF'; // 吸顶时设置背景色
} else {
this.headerBgColor = 'transparent'; // 取消吸顶时恢复背景色
}
},
//统计数据
getstatistics(){
request({
@@ -173,15 +146,6 @@
id: 'ru'
}]
];
this.list1 = [{
name: this.$t('all'),
}, {
name: this.$t('followup'),
}, {
name: this.$t('deal')
}, {
name: this.$t('lost')
}];
uni.setTabBarItem({
index: 0,
text: this.$t('tabbar.home')
@@ -194,16 +158,22 @@
index: 2,
text: this.$t('tabbar.mine')
})
},
//tab标签切换
tabclick(e){
console.log(e)
if(e.id=='all'){
this.follow=''
}else{
this.follow=e.index - 1
var language = e.value[0].id
if(e.value[0].id=='zh-Hans'){
language= 'zh_CN'
}
this.queryList(1, 10)
request({
url:'user/language',
method:'POST',
data:{
language: language,
}
}).then(res => {
uni.showToast({
title: res.data.message,
icon: 'none'
});
})
},
//日期选择组件
confirm(e) {
@@ -224,35 +194,6 @@
this.time = timeFormat(time, 'yyyy-mm')
return timeFormat(time, 'yyyy-mm')
},
//客户列表数据
queryList(pageNo, pageSize) {
var that = this;
request({
url: 'customer/list',
method: 'get',
data: {
page: pageNo,
per_page: 10,
follow:this.follow
}
}).then(res => {
console.log(res.data)
if (res.data.code == 0) {
var datas = res.data.data.list;
this.$refs.paging.complete(datas);
} else {
// this.$refs.paging.complete(null);
// that.listlength=0
}
uni.stopPullDownRefresh();
})
},
godetile(item) {
console.log(item)
uni.navigateTo({
url: '/pages/customer/detile?id='+item.id
});
}
}
}
</script>
@@ -262,7 +203,9 @@
width: 18px;
height: 18px;
}
.u-grid-item{
margin-bottom: 20px;
}
.tabsbg {
border-radius: 16px 16px 0px 0px;
background: #E6EDFF
@@ -287,7 +230,7 @@
font-size: 28rpx;
position: relative;
background: #F6F6F6;
height: 100vh;
.contop {
background-image: url("/static/image/topbg.png");
background-size: 100%;
+33 -25
View File
@@ -1,24 +1,28 @@
<template>
<view class="contents">
<view class="navbar">{{$t('mine.title')}}</view>
<!-- <uni-nav-bar leftText=" " :fixed="true" :border="false" @clickLeft="leftClick" color="#fff" backgroundColor="#4579ff" :statusBar="true" :title="$t('mine.title')"></uni-nav-bar> -->
<!-- <view class="navbar">{{$t('mine.title')}}</view> -->
<view class="navbar"></view>
<view class="content">
<view class="contop">
<view class="">
<!-- <image class="userimg" :src="userinfo.avatar" mode=""></image> -->
<image class="userimg" src="/static/image/mine/user.png" mode=""></image>
</view>
<view class="right" @click="changinfo">
<!-- <view class="right" @click="changinfo"> -->
<view class="right">
<view class="">
<text>迪士尼公主</text>
<image src="/static/image/mine/edit.png" mode=""></image>
<text>{{userinfo.email}}</text>
<!-- <image src="/static/image/mine/edit.png" mode=""></image> -->
</view>
<view class="mineid">
ID:080427
ID:{{userinfo.id}}
</view>
</view>
</view>
<view class="bottomCon">
<view class="sonContent" @click="navTo('/pages/mine/massege')">
<!-- <view class="sonContent" @click="navTo('/pages/mine/massege')">
<image class="son-img-bg" src="/static/image/mine/icon1.png"></image>
<span>{{$t('mine.msg')}}</span>
<view class="">
@@ -27,33 +31,33 @@
</view>
<uni-icons type="right" class="icon" size="18"></uni-icons>
</view>
</view>
<view class="sonContent" @click="navTo('/pages/mine/resetPwd')">
</view> -->
<!-- <view class="sonContent" @click="navTo('/pages/mine/resetPwd')">
<image class="son-img-bg" src="/static/image/mine/icon2.png"></image>
<span>{{$t('mine.cpassword')}}</span>
<uni-icons type="right" class="icon" size="18"></uni-icons>
</view>
</view> -->
<view class="sonContent" @click="show=true">
<image class="son-img-bg" src="/static/image/mine/icon3.png"></image>
<span>{{$t('mine.contact')}}</span>
<uni-icons type="right" size="18" class="icon"></uni-icons>
</view>
<view class="sonContent" @click="navTo('/pages/mine/feedback')">
<!-- <view class="sonContent" @click="navTo('/pages/mine/feedback')">
<image class="son-img-bg" src="/static/image/mine/icon4.png"></image>
<span>{{$t('mine.feedback')}}</span>
<uni-icons type="right" class="icon" size="18"></uni-icons>
</view>
</view> -->
<view class="sonContent" @click="navTo('/pages/mine/about')">
<image class="son-img-bg" src="/static/image/mine/icon5.png"></image>
<span>{{$t('mine.about')}}</span>
<uni-icons type="right" class="icon" size="18"></uni-icons>
</view>
<view class="sonContent" @click="navTo('/pages/mine/logoff')">
<!-- <view class="sonContent" @click="navTo('/pages/mine/logoff')">
<image class="son-img-bg" src="/static/image/mine/icon6.png"></image>
<span>{{$t('mine.logoff')}}</span>
<uni-icons type="right" class="icon" size="18"></uni-icons>
</view>
<view class="sonContent" @click="navTo('/pages/login/index')">
</view> -->
<view class="sonContent" @click="logout">
<image class="son-img-bg" src="/static/image/mine/icon7.png"></image>
<span>{{$t('mine.logout')}}</span>
<uni-icons type="right" class="icon" size="18"></uni-icons>
@@ -67,8 +71,8 @@
<view class="popupcontent">
<image class="log1" src="/static/image/mine/kefu.png"></image>
<view class="title">{{$t('mine.kfphone')}}</view>
<view class="calls">13545678952</view>
<button class="btn" @click="callPhone()">{{$t('call')}}</button>
<view class="calls">18137110386</view>
<button class="btn" @click="callPhone('18137110386')">{{$t('call')}}</button>
</view>
</u-popup>
</view>
@@ -84,7 +88,7 @@
}
},
onLoad() {
this.userinfo =JSON.parse(uni.getStorageSync('userinfo'))
},
onShow() {
},
@@ -122,6 +126,13 @@
},
});
},
//退出登录
logout(){
uni.clearStorageSync();
uni.reLaunch({
url: '/pages/login/index',// 替换为你要跳转的页面路径
});
}
}
}
</script>
@@ -148,19 +159,17 @@
background-repeat: no-repeat;
}
.navbar{
padding-top: 30px;
height: 50px;
line-height: 50px;
text-align: center;
color: #fff;
font-size: 32rpx;
/* #ifdef APP-PLUS */
height:44px;
/* #endif */
height:30px;
}
.content{
padding:10px 15px 15px;
.contop{
display: flex;
align-items: center;
margin: 15px 0px 30px;
margin: 0px 0px 30px;
font-size: 34rpx;
color: white;
.right{
@@ -198,7 +207,6 @@
height: 220rpx;
}
.bottomCon {
margin-top: 40rpx;
color: #000;
font-weight: 400;
// padding: 0 24rpx 20rpx;