样式调整

master
jiangjunjie 2 weeks ago
parent 2c3347cdae
commit 8c57e16513
  1. 47
      src/components/footer-bar-btn.vue
  2. 12
      src/components/footer-bar-input.vue

@ -15,6 +15,7 @@ import { ref, computed, onMounted } from 'vue'
import { storeToRefs } from 'pinia'
import { useAppStore } from '@/store/app.js'
import { Post } from '@/utils/https'
import { jumpOpenWeb } from '@/utils'
import footerBarBtnIcon from '@/assets/images/footer-bar-btn-icon.png'
import footerBarBtnIcon2 from '@/assets/images/footer-bar-btn-icon2.png'
import footerBarBtnIcon3 from '@/assets/images/footer-bar-btn-icon3.png'
@ -23,15 +24,15 @@ import footerBarBtnIcon4 from '@/assets/images/footer-bar-btn-icon4.png'
defineEmits(['onFooterBtnChoose'])
const store = useAppStore()
const { source, planCode, userInfo, manualService, mescrollContent, elder } = storeToRefs(store)
const { source, planCode, userInfo, manualService, mescrollContent, elder, isChatLoading } =
storeToRefs(store)
const keywordslist = ref([
{ name: "查保单", icon: footerBarBtnIcon },
{ name: "查收益", icon: footerBarBtnIcon2 },
{ name: "贷还款", icon: footerBarBtnIcon3 },
{ name: "续期交费", icon: footerBarBtnIcon4 },
{ name: "查保单", icon: footerBarBtnIcon, URL: "https://yzsslfw.cpiccdn.com/accept_pad/index.html#/phone/base/wxxcxHomeSearch?source=wxxcx&bqtype=search&ticket=%s" },
{ name: "查收益", icon: footerBarBtnIcon2, URL: "https://yzsslfw.cpiccdn.com/accept_pad/index.html#/phone/base/wxxcxHomeSearch?source=wxxcx&bqtype=search&ticket=%s" },
{ name: "贷还款", icon: footerBarBtnIcon3, URL: "https://yzsslfw.cpiccdn.com/accept_pad/index.html#/phone/infoChange/eye?source=wxxcx&bqtype=search&ticket=%s" },
{ name: "续期交费", icon: footerBarBtnIcon4, URL: "/packageAgent/pages/renewalPayment/renewalPayment?source_channel=GDFW&ticket=%s" },
])
const issubmit = ref(true) // 防止重复发送
const keyWordshow = computed(() => keywordslist.value.length > 0)
const isRobotService = computed(() => String(manualService.value) === '1')
@ -49,25 +50,13 @@ function scrollTopBody() {
}
function keywordsClick(item) {
// const sendParmas = {
// reqAndResType: '1', // 1文本 2图片 3问题评价
// msgText: item.name,
// msgSource: manualService.value, // 1机器人 2人工
// questionType: 1,
// }
// if (!issubmit.value) return
// issubmit.value = false
// scrollTopBody()
// 只把问题写入对话气泡,不走对话接口
store.addSendMessageList({ msgText: item.name, reqAndResType: '1' })
// 没有机器人回复来复位打字动画,这里手动复位,避免"正在输入"一直转
isChatLoading.value = false
scrollTopBody()
// store
// .sendingRobot(sendParmas)
// .catch((err) => {
// console.log(err)
// })
// .finally(() => {
// issubmit.value = true
// })
jumpOpenWeb('YY_GWXCX', item.URL)
}
async function initFooterBtn() {
@ -140,12 +129,18 @@ onMounted(() => {
letter-spacing: 0;
text-align: justify;
padding: 6.5rem 10rem;
background: linear-gradient(140deg, #dcfcff 6%, #ffffffbf 18%, #ffffff 56%);
position: relative;
border-radius: 82rem;
/* border-radius: 82rem; */
-webkit-animation: slideInRight 0.5s ease-in-out both;
animation: slideInRight 0.5s ease-in-out both;
display: flex;
background: linear-gradient(140deg, #dcfcff 6%, #ffffffbf 18%, #ffffff 56%);
box-sizing: border-box;
border-image: linear-gradient(115deg, #ffffff 4%, #ffffff 89%) 1.2;
backdrop-filter: blur(14px);
box-shadow: 0px 4px 10px 0px rgba(181, 189, 216, 0.3);
z-index: 3;
border-radius: 101rem;
}
.footerBtn .footer-items-list:active {

@ -95,7 +95,8 @@
<!-- 表情符号 -->
<!-- <transition name="draw"> -->
<emoticon-box class="smile-emoticon-box" :class="{ min_heightauto: !smileFlag }" @onFaceChoose="handleFaceChoose"></emoticon-box>
<emoticon-box class="smile-emoticon-box" :class="{ min_heightauto: !smileFlag }"
@onFaceChoose="handleFaceChoose"></emoticon-box>
<!-- </transition> -->
<upload-image ref="uploadImageRef" @image-selected="handleImageSelected" @image-sent="handleImageSent"
@ -810,7 +811,6 @@ watch(sendMessage, (newValue, oldValue) => {
height: auto;
min-height: 10rem;
line-height: 10rem;
background: #fff;
border-radius: 30rem;
padding: 7.5rem 20rem 7.5rem 15rem;
vertical-align: middle;
@ -826,6 +826,14 @@ watch(sendMessage, (newValue, oldValue) => {
overflow: hidden;
display: flex;
align-items: center;
background: linear-gradient(111deg, #dcfcff 0%, #ffffffbf 12%, #ffffff 38%);
box-sizing: border-box;
/* border: 1.2px solid; */
border-image: linear-gradient(99deg, #ffffff 4%, #ffffff 88%) 1.2;
backdrop-filter: blur(14px);
box-shadow: 0px 4px 10px 0px rgba(181, 189, 216, 0.3);
z-index: 0;
}
.input-text-tips {

Loading…
Cancel
Save