commie/im
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

4

Browse Source
This commit is contained in:
commie
2025-11-25 05:36:02 +08:00
parent 8e036cc171
commit b10e4b4336
65 changed files with 2672 additions and 2270 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/conversation/chating/components/ChatingFooter/ChatingActionBar.vue
+100 -68
View File
@@ -1,80 +1,112 @@
<template>
<view class="chat_action_bar">
<u-row class="action_row">
<u-col
v-for="item in actionList"
:key="item.idx"
@click="actionClick(item)"
span="3"
>
<view class="action_item">
<image :src="item.icon" alt="" srcset="" />
<text class="action_item_title">{{ item.title }}</text>
</view>
</u-col>
</u-row>
</view>
<view class="chat_action_bar">
<u-row class="action_row">
<u-col v-for="item in actionList" :key="item.idx" @click="actionClick(item)" span="3">
<view class="action_item">
<image :src="item.icon" alt="" srcset="" />
<text class="action_item_title">{{ item.title }}</text>
</view>
</u-col>
</u-row>
</view>
</template>
<script>
import {
ChatingFooterActionTypes,
} from "@/constant";
import {ChatingFooterActionTypes,} from "@/constant";
export default {
components: {},
data() {
return {
actionList: [
{
idx: 0,
type: ChatingFooterActionTypes.Album,
title: "相册",
icon: require("static/images/chating_action_image.png"),
}
],
};
},
methods: {
async actionClick(action) {
switch (action.type) {
case ChatingFooterActionTypes.Album:
this.$emit("prepareMediaMessage", action.type);
break;
default:
break;
}
},
},
};
export default {
components: {},
data() {
return {
actionList: [
{
idx: 0,
type: ChatingFooterActionTypes.Album,
title: "照片",
icon: require("static/images/chating_action_image.png"),
},
{
idx: 1,
type: ChatingFooterActionTypes.Camera,
title: "拍摄",
icon: require("static/images/chating_action_image.png"),
},
{
idx: 2,
type: ChatingFooterActionTypes.Video,
title: "视频通话",
icon: require("static/images/chating_action_image.png"),
},
{
idx: 3,
type: ChatingFooterActionTypes.Location,
title: "位置",
icon: require("static/images/chating_action_image.png"),
},
// {
// idx: 0,
// type: ChatingFooterActionTypes.Album,
// title: "红包",
// icon: require("static/images/chating_action_image.png"),
// },
// {
// idx: 0,
// type: ChatingFooterActionTypes.Album,
// title: "转账",
// icon: require("static/images/chating_action_image.png"),
// }
],
};
},
methods: {
async actionClick(action) {
switch (action.type) {
case ChatingFooterActionTypes.Video:
this.$emit("prepareMediaMessage", action.type);
break;
case ChatingFooterActionTypes.Album:
this.$emit("prepareMediaMessage", action.type);
break;
case ChatingFooterActionTypes.Camera:
this.$emit("prepareMediaMessage", action.type);
break;
case ChatingFooterActionTypes.Location:
this.$emit("prepareMediaMessage", action.type);
break;
default:
break;
}
},
},
};
</script>
<style lang="scss" scoped>
.chat_action_bar {
position: relative;
background: #f0f2f6;
padding: 24rpx 36rpx;
.chat_action_bar {
position: relative;
background: #f0f2f6;
padding: 24rpx 36rpx;
.action_row {
flex-wrap: wrap;
margin-bottom: 24rpx;
}
.action_row {
flex-wrap: wrap;
margin-bottom: 24rpx;
}
.action_item {
@include centerBox();
flex-direction: column;
margin-top: 24rpx;
.action_item {
@include centerBox();
flex-direction: column;
margin-top: 24rpx;
image {
width: 96rpx;
height: 96rpx;
}
image {
width: 96rpx;
height: 96rpx;
}
&_title {
font-size: 24rpx;
color: #999;
margin-top: 6rpx;
}
}
}
</style>
&_title {
font-size: 24rpx;
color: #999;
margin-top: 6rpx;
}
}
}
</style>