bonus
/
Zlpt_Portal_h5
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

消息列表功能完善 发送消息功能完善

This commit is contained in:
BianLzhaoMin 2024-12-23 18:21:01 +08:00
parent 2b8ef76798
commit 1e572b05b8
9 changed files with 325 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
index.html
View File

@ -19,7 +19,9 @@
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
(coverSupport ? ', viewport-fit=cover' : '') + '" />')
</script>
<title></title>
<title>
安徽租赁商城
</title>
<!--preload-links-->
<!--app-context-->
</head>

7
package-lock.json generated
View File

@ -26,6 +26,7 @@
"@vant/area-data": "^2.0.0",
"less": "^4.2.1",
"less-loader": "^12.2.0",
"lodash-es": "^4.17.21",
"moment": "^2.30.1",
"pinia": "^2.3.0",
"pinia-plugin-persistedstate": "^4.1.3",
@ -9504,6 +9505,12 @@
"dev": true,
"license": "MIT"
},
"node_modules/lodash-es": {
"version": "4.17.21",
"resolved": "https://repo.huaweicloud.com/repository/npm/lodash-es/-/lodash-es-4.17.21.tgz",
"integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==",
"license": "MIT"
},
"node_modules/lodash.camelcase": {
"version": "4.3.0",
"resolved": "https://repo.huaweicloud.com/repository/npm/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",

1
package.json
View File

@ -60,6 +60,7 @@
"@vant/area-data": "^2.0.0",
"less": "^4.2.1",
"less-loader": "^12.2.0",
"lodash-es": "^4.17.21",
"moment": "^2.30.1",
"pinia": "^2.3.0",
"pinia-plugin-persistedstate": "^4.1.3",

10
src/pages/goods-details/components/details-model.vue
View File

@ -47,7 +47,7 @@
</view>
<van-action-bar v-if="memberStore.userType === 2">
<van-action-bar-icon icon="chat-o" text="在线聊" />
<van-action-bar-icon icon="chat-o" text="在线聊" @click="onLineMessage" />
<van-action-bar-icon
icon="shop-o"
text="预约车"
@ -152,6 +152,14 @@ const onCartBarPage = () => {
uni.switchTab({ url: '/pages/cart/index' })
}
// 在线聊
const onLineMessage = () => {
const { companyId, companyName, ownId } = deviceInfo.value
uni.navigateTo({
url: `/pages/message-pages/index?id=${companyId}&name=${companyName}&ownId=${ownId}`,
})
}
onLoad(() => {
userCompanyId.value = memberStore.userInfo.companyId
getDeviceDetailsData()

227
src/pages/goods-list/index.vue
View File

@ -12,20 +12,32 @@
<view class="goods-items">
<view class="filter-box">
<view class="flex-row-start">
<view>
使用年限
<van-icon name="sort" />
</view>
<view>
租金
<van-icon name="sort" />
</view>
<view>
上架时间
<van-icon name="sort" />
<view class="filter-items">
使用年限
<view class="filter-type">
<van-icon name="play" size="12" />
<van-icon name="play" size="12" />
</view>
</view>
<view class="filter-items">
租金
<view class="filter-type">
<van-icon name="play" size="12" />
<van-icon name="play" size="12" />
</view>
</view>
<view class="filter-items">
上架时间
<view class="filter-type">
<van-icon name="play" size="12" />
<van-icon name="play" size="12" />
</view>
</view>
</view>
<view @click="onFilter">
筛选
<van-icon name="filter-o" />
</view>
</view>
@ -40,6 +52,49 @@
</van-grid-item>
</van-grid>
</scroll-view>
<van-popup position="bottom" v-model:show="showBottom" :style="{ height: '60%' }">
<view class="filter-bottom">
<view style="text-align: right; padding: 4px 8px">
<van-icon name="close" color="#575B66" size="20" />
</view>
<view
style="
text-align: center;
font-weight: bold;
color: #333333;
font-family: PingFangSC, PingFang SC;
"
>
全部筛选
</view>
<view class="filter-content">
<van-sidebar v-model="activeSelect">
<van-sidebar-item
:key="index"
:title="item.selectName"
v-for="(item, index) in selectList"
/>
</van-sidebar>
<scroll-view scroll-y class="right-btns">
<view>
<view> {{ selectList[activeSelect].selectName }} </view>
<view class="btns">
<view
class="active_btn"
v-for="(item, index) in selectList[activeSelect].val_list"
:key="index"
>
{{ item.name }}
</view>
</view>
</view>
</scroll-view>
</view>
</view>
</van-popup>
</view>
</template>
@ -50,8 +105,76 @@ import Navbar from '@/components/Navbar/index'
import { getDeviceListAPI } from '@/services/index/index.js'
import { onLoad } from '@dcloudio/uni-app'
import { ref } from 'vue'
const active = ref('')
const activeSelect = ref(0)
const showBottom = ref(false)
const deviceList = ref([])
const selectList = ref([
{
selectName: '使用年限',
val_list: [
{
name: '全部',
value: '',
},
{
name: '0-1年',
value: [0, 1],
},
],
},
{
selectName: '设备类型',
val_list: [
{
name: '全部',
value: '',
},
{
name: '0-1年',
value: [0, 1],
},
],
},
{
selectName: '下级分类',
val_list: [
{
name: '全部',
value: '',
},
{
name: '0-1年',
value: [0, 1],
},
],
},
{
selectName: '价格区间',
val_list: [
{
name: '全部',
value: '',
},
{
name: '0-1年',
value: [0, 1],
},
],
},
{
selectName: '设备所属公司',
val_list: [
{
name: '全部',
value: '',
},
{
name: '0-1年',
value: [0, 1],
},
],
},
])
const onScrollTolower = () => {
console.log('滚动触底')
}
@ -82,6 +205,10 @@ const onClickLeft = () => {
url: '/pages/index/index',
})
}
const onFilter = () => {
showBottom.value = true
}
onLoad(() => {
getDeviceListData()
})
@ -116,15 +243,40 @@ onLoad(() => {
}
.goods-items {
display: flex;
justify-content: space-between;
padding: 10px;
box-sizing: border-box;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
background: $uni-bg-color;
}
.flex-row-start view {
margin-right: 6px;
.filter-box {
display: flex;
align-items: center;
.filter-items {
display: flex;
align-items: center;
.filter-type {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 0 6px;
& .van-icon:first-child {
transform: rotateZ(-90deg);
margin-bottom: -3px;
}
& .van-icon:last-child {
transform: rotateZ(90deg);
margin-top: -3px;
}
}
}
}
}
.van-tabbar {
@ -141,4 +293,47 @@ onLoad(() => {
:deep(.van-nav-bar__title) {
color: #333;
}
.filter-bottom {
height: 100%;
display: flex;
flex-direction: column;
overflow-y: hidden;
}
.filter-content {
flex: 1;
height: 100%;
display: flex;
.right-btns {
flex: 1;
padding: 10px;
box-sizing: border-box;
.btns {
display: flex;
flex-wrap: wrap;
margin-top: 15px;
view {
width: calc((100% - 20px) / 3);
margin-bottom: 10px;
margin-right: 10px;
height: 28px;
line-height: 28px;
text-align: center;
border-radius: 14px;
}
.active_btn {
color: #22ab9b;
background-color: #d1eae7;
}
& view:nth-child(3n) {
margin-right: 0;
}
}
}
}
</style>

56
src/pages/message-pages/index.vue
View File

@ -3,15 +3,15 @@
<view class="h5-container message-pages">
<view style="padding: 15px">
<van-icon name="arrow-left" @click="onClickLeft" />
<text style="color: #000"> 老张租赁 </text>
<text style="color: #000"> {{ contactUser }} </text>
</view>
<scroll-view scroll-y style="padding-bottom: 60px">
<van-cell-group inset style="flex: 1">
<view v-for="item in 20" :key="item">
<view class="message-items left-message" v-if="item === 2 || item === 4">
<view v-for="item in messageList" :key="item.uuid">
<view class="message-items left-message" v-if="myCompanyId == item.fromCompany">
<view style="flex: 1">
<text> 你还有货吗 </text>
<text> {{ item.messageContent }} </text>
</view>
<van-image
round
@ -21,7 +21,7 @@
src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
/>
</view>
<view class="message-items right-message" v-if="item === 3 || item === 5">
<view class="message-items right-message" v-else>
<van-image
round
fit="cover"
@ -30,7 +30,7 @@
src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
/>
<view style="flex: 1">
<text> 你还有货吗 </text>
<text> {{ item.messageContent }} </text>
</view>
</view>
</view>
@ -38,8 +38,8 @@
</scroll-view>
<view class="message-ipt">
<van-field rows="1" autosize type="textarea" />
<van-icon name="guide-o" color="#22ab9a" size="24" />
<van-field rows="1" autosize type="textarea" v-model="sendParams.messageContent" />
<van-icon name="guide-o" color="#22ab9a" size="24" @click="onSendMessage" />
</view>
</view>
</template>
@ -48,17 +48,44 @@
import { ref } from 'vue'
import { useMemberStore } from '@/stores/index.js'
import { onLoad } from '@dcloudio/uni-app'
import { debounce } from 'lodash-es'
import { sendMessageAPI, getMessageInfoAPI } from '@/services/message/index.js'
const memberStore = useMemberStore()
const userName = ref('')
const userAccount = ref('')
const contactUser = ref('')
const messageList = ref([])
const myCompanyId = ref()
const sendParams = ref({
toUser: '',
toCompany: '',
messageContent: '',
})
const onClickLeft = () => {
uni.navigateBack()
}
onLoad(() => {
userName.value = memberStore.userInfo.nickName
userAccount.value = memberStore.userInfo.userName
const getMessageInfoData = async () => {
const { data: res } = await getMessageInfoAPI({ toCompany: sendParams.value.toCompany })
messageList.value = res
}
// 发送按钮
const onSendMessage = debounce(async () => {
const res = await sendMessageAPI(sendParams.value)
if (res.code === 200) {
getMessageInfoData()
} else {
showNotify({ type: 'success', message: '发送失败' })
}
}, 500)
onLoad((options) => {
myCompanyId.value = memberStore.userInfo?.companyId
sendParams.value.toCompany = options?.id
sendParams.value.toUser = options?.ownId
contactUser.value = options?.name
getMessageInfoData()
})
</script>
@ -138,7 +165,8 @@ onLoad(() => {
bottom: 0;
left: 0;
padding: 12px 0;
height: 60px;
// height: 60px;
height: auto;
width: 100%;
display: flex;
align-items: center;

19
src/pages/message/index.vue
View File

@ -53,16 +53,33 @@
<script setup>
import { ref } from 'vue'
import { onLoad, onUnload } from '@dcloudio/uni-app'
import { useMemberStore } from '@/stores/index.js'
import { onLoad } from '@dcloudio/uni-app'
import { getMessageListAPI } from '@/services/message/index.js'
const memberStore = useMemberStore()
const userName = ref('')
const userAccount = ref('')
const messageInterval = ref(null)
onLoad(() => {
userName.value = memberStore.userInfo.nickName
userAccount.value = memberStore.userInfo.userName
messageInterval.value = setInterval(() => {
getMessageListData()
}, 3000)
})
onUnload(() => {
if (messageInterval.value) {
clearInterval(messageInterval.value)
messageInterval.value = null
}
})
const getMessageListData = async () => {
const res = await getMessageListAPI()
}
const onJumpToMessagePages = () => {
uni.navigateTo({ url: '/pages/message-pages/index' })
}

32
src/services/message/index.js Normal file
View File

@ -0,0 +1,32 @@
import { http } from '@/utils/http'
/**
* 消息 发送消息
*/
export const sendMessageAPI = (data) => {
return http({
method: 'POSt',
url: '/material-mall/bm_message',
data,
})
}
/**
* 消息 消息详情
*/
export const getMessageInfoAPI = (data) => {
return http({
method: 'GET',
url: '/material-mall/bm_message/listOneToOne',
data,
})
}
/**
* 消息 消息列表
*/
export const getMessageListAPI = (data) => {
return http({
method: 'GET',
url: '/material-mall/bm_message/list',
data,
})
}

4
vite.config.js
View File

@ -31,8 +31,8 @@ export default defineConfig({
proxy: {
// 在此处编写代理规则
'/api': {
target: 'http://36.33.26.201:17788/proxyApi',
// target: 'http://192.168.0.244:28580',
// target: 'http://36.33.26.201:17788/proxyApi',
target: 'http://192.168.2.123:28080',
changeOrigin: true,
rewrite: (path) => {
return path.replace(/\/api/, '')