Merge branch 'main' of git.zdool.com:xs/yxdt/h5
This commit is contained in:
duanxiaohai
commit
571bea0520
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 826 B After Width: | Height: | Size: 826 B |
Binary file not shown.
|
After Width: | Height: | Size: 613 B |
|
|
@ -164,7 +164,7 @@
|
|||
</div>
|
||||
<div v-else-if="message.type == 'card4'" class="card3">
|
||||
<div class="c_top">
|
||||
推荐您可以挂神经内科，您还可根据自身偏好重新选择，继续为您推荐，如偏好因素不在其列，可继续提出您的需求。
|
||||
{{ message.text }}
|
||||
</div>
|
||||
<div class="c_bt">
|
||||
<div class="cbt_it" v-for=" v in 3">
|
||||
|
|
@ -173,6 +173,32 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="message.type == 'card5'" class="card5">
|
||||
<div class="card_container">
|
||||
<div class="cd_l">
|
||||
<img src="@/assets/c2.png" alt="">
|
||||
</div>
|
||||
<div class="cd_r">
|
||||
<div class="hostbital_name">象山第一人民医院</div>
|
||||
<div class="second">
|
||||
<div class="howway">
|
||||
<img src="@/assets/c5.png" alt="">
|
||||
<span>3公里</span>
|
||||
</div>
|
||||
<div class="addr">宁波市象山县东谷路28991</div>
|
||||
</div>
|
||||
<div class="tag_wrp">
|
||||
<div class="tag">医保定点</div>
|
||||
<div style="width: 4px;"></div>
|
||||
<div class="tag">危重孕产妇救治中心</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <img src="@/assets/c5.png" alt=""> -->
|
||||
</div>
|
||||
<div class="guid_img">
|
||||
<img src="@/assets/c3.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="Right" v-else>
|
||||
|
|
@ -202,7 +228,7 @@
|
|||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, reactive, nextTick } from 'vue'
|
||||
import { ref, reactive, nextTick, onMounted } from 'vue'
|
||||
let inputText = ref('')
|
||||
let messages = reactive([
|
||||
{ id: 1, type: 'fstxt', text: '您可以点击下方快捷方式选择问题，或直接编辑问题发送给我哟', isMe: false },
|
||||
|
|
@ -216,7 +242,8 @@ let messages = reactive([
|
|||
{ id: 9, type: 'txt', text: '人民医院怎么走', isMe: true },
|
||||
{ id: 10, type: 'card5', text: '卡片5', isMe: false },
|
||||
]);
|
||||
let sendMessage = () => {
|
||||
|
||||
const sendMessage = () => {
|
||||
console.log("dddd", inputText.value)
|
||||
/* setTimeout(() => {
|
||||
console.log("inputText.value:", inputText.value);
|
||||
|
|
@ -230,7 +257,7 @@ let sendMessage = () => {
|
|||
inputText.value = '';
|
||||
}
|
||||
}
|
||||
let scollToButtom = () => {
|
||||
const scollToButtom = () => {
|
||||
nextTick(() => {
|
||||
let chatForm = document.getElementById('chatform'); // 获取对象
|
||||
if (chatForm) {
|
||||
|
|
@ -238,7 +265,7 @@ let scollToButtom = () => {
|
|||
}
|
||||
});
|
||||
}
|
||||
// scollToButtom()
|
||||
// onMounted(scrollToBottom);
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
::-webkit-input-placeholder {
|
||||
|
|
@ -366,7 +393,8 @@ let scollToButtom = () => {
|
|||
.tag {
|
||||
font-size: 10px;
|
||||
color: #4379FF;
|
||||
width: 48px;
|
||||
// width: 48px;
|
||||
padding: 0px 2px;
|
||||
height: 16px;
|
||||
text-align: center;
|
||||
line-height: 16px;
|
||||
|
|
@ -576,7 +604,9 @@ let scollToButtom = () => {
|
|||
padding: 16px;
|
||||
border: 1px solid red;
|
||||
|
||||
.c_top {margin-bottom: 12px;}
|
||||
.c_top {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.c_bt {}
|
||||
|
||||
|
|
@ -591,6 +621,7 @@ let scollToButtom = () => {
|
|||
justify-content: space-between;
|
||||
padding: 8px;
|
||||
box-sizing: border-box;
|
||||
|
||||
.it_name {
|
||||
font-size: 14px;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
|
|
@ -610,6 +641,100 @@ let scollToButtom = () => {
|
|||
}
|
||||
}
|
||||
|
||||
.card4 {}
|
||||
|
||||
.card5 {
|
||||
width: 280px;
|
||||
height: 90px;
|
||||
border-radius: 16px;
|
||||
background-color: #fff;
|
||||
position: relative;
|
||||
|
||||
.guid_img {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-44%);
|
||||
right: -35px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.card_container {
|
||||
padding: 16px;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
|
||||
.cd_l {
|
||||
img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.cd_r {
|
||||
margin-left: 8px;
|
||||
|
||||
.hostbital_name {
|
||||
font-size: 14px;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.second {
|
||||
display: flex;
|
||||
color: #999999;
|
||||
margin-bottom: 6px;
|
||||
|
||||
.howway {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
img {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
span {
|
||||
margin-right: 8px;
|
||||
font-size: 12px;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.addr {
|
||||
font-size: 12px;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.tag_wrp {
|
||||
display: flex;
|
||||
|
||||
.tag {
|
||||
font-size: 10px;
|
||||
color: #4379FF;
|
||||
// width: 48px;
|
||||
padding: 0px 2px;
|
||||
height: 16px;
|
||||
text-align: center;
|
||||
line-height: 16px;
|
||||
border-radius: 2px 2px 2px 2px;
|
||||
opacity: 1;
|
||||
border: 1px solid #B8CCFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.txt {
|
||||
min-height: 44px;
|
||||
padding: 10px 16px;
|
||||
|
|
|
|||
|
|
@ -43,12 +43,14 @@
|
|||
<div v-for="(data, index) in records.list" :key="data.id">
|
||||
<listNoImg v-if="data.display == 0" :newData="data" />
|
||||
<listRightImg v-if="data.display == 1" :newData="data" />
|
||||
<div class="container">
|
||||
<div class="line"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, reactive } from "vue";
|
||||
|
|
@ -172,7 +174,7 @@ const records = reactive({
|
|||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 70px;
|
||||
min-width: 70px;
|
||||
height: 24px;
|
||||
background: #457aff;
|
||||
opacity: 1;
|
||||
|
|
@ -196,9 +198,11 @@ const records = reactive({
|
|||
font-weight: 600;
|
||||
color: #333333;
|
||||
line-height: 24px;
|
||||
// white-space: nowrap;
|
||||
overflow: hidden;
|
||||
// text-overflow: ellipsis;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
.time {
|
||||
margin-top: 24px;
|
||||
|
|
@ -228,7 +232,7 @@ const records = reactive({
|
|||
padding-top: 0;
|
||||
// overflow: hidden;
|
||||
background-color: #ffffff;
|
||||
height: 68vh;
|
||||
// height:calc(100vh - 150px);
|
||||
.main-t {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -263,7 +267,8 @@ const records = reactive({
|
|||
.list {
|
||||
// box-sizing: border-box;
|
||||
width: 100vw;
|
||||
height: 59vh;
|
||||
height: calc(100vh - 280px);
|
||||
background-color: #ffffff;
|
||||
overflow: auto;
|
||||
// border: 1px solid yellow;
|
||||
}
|
||||
|
|
@ -280,13 +285,18 @@ const records = reactive({
|
|||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
.container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.line {
|
||||
width: 100vw;
|
||||
width: calc(100vw - 32px);
|
||||
height: 0px;
|
||||
border-radius: 0px 0px 0px 0px;
|
||||
opacity: 1;
|
||||
border: 1px solid #f1f1f1;
|
||||
margin-top: 16px;
|
||||
margin-top: 12px;
|
||||
margin-bottom: 16px;
|
||||
text-align: center;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue