8000 feat: карточки ItemsList · popstas/yandex-dialogs-client@acad67f · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

Commit acad67f

Browse files
IBS\\AEpikhinpopstas
IBS\\AEpikhin
authored and
popstas
committed
feat: карточки ItemsList
1 parent 29ae113 commit acad67f

File tree

4 files changed

+104
-3
lines changed

4 files changed

+104
-3
lines changed

‎components/CardItem.vue

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
<template>
2+
<div class="card-item" @click="onClick">
3+
<div v-bind:style="cardItemIconStyle"></div>
4+
<div :title="title" class="card-item-text" v-html="text"></div>
5+
</div>
6+
</template>
7+
8+
<style lang="scss">
9+
.card-item {
10+
display: flex;
11+
padding: 10px;
12+
color: #666;
13+
&:hover {
14+
color: #999;
15+
}
16+
}
17+
.card-item-text {
18+
padding: inherit;
19+
color: inherit;
20+
}
21+
</style>
22+
23+
<script>
24+
import {
25+
AUTHOR_NAME,
26+
ADD_MESSAGE,
27+
ALICE_REQUEST,
28+
RUN_TEST,
29+
SET_WEBHOOK_URL
30+
} from "~/store";
31+
export default {
32+
props: ["title", "image", "url", "payload", "hide"],
33+
34+
computed: {
35+
// показывается человеку
36+
text() {
37+
return this.title || this.value;
38+
},
39+
40+
// отправляется боту
41+
sendText() {
42+
return this.value || this.title;
43+
},
44+
45+
cardItemIconStyle() {
46+
return {
47+
'background-image': 'url(https://avatars.mds.yandex.net/get-dialogs-skill-card/' + this.image + '/menu-list-x1',
48+
width: '60px',
49+
height: '60px',
50+
overflow: 'hidden',
51+
position: 'relative',
52+
'background-size': 'cover',
53+
'background-repeat': 'no-repeat',
54+
'background-position': '0 0'
55+
}
56+
}
57+
},
58+
59+
methods: {
60+
onClick() {
61+
// open url
62+
if (this.url) {
63+
window.open(this.url, "_blank");
64+
return;
65+
}
66+
67+
// add send message
68+
this.$store.commit(ADD_MESSAGE, {
69+
text: this.sendText,
70+
author: AUTHOR_NAME
71+
});
72+
73+
// send to alice
74+
this.$store.dispatch(ALICE_REQUEST, {
75+
command: this.sendText,
76+
type: "ButtonPressed",
77+
payload: this.payload,
78+
url: this.url,
79+
hide: this.hide
80+
});
81+
}
82+
}
83+
};
84+
</script>

‎components/Message.vue

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,15 @@
66
</div>
77

88
<div class="message__text-wrap">
9-
<div class="message__text" v-html="text"></div>
9+
<div class="message__text">
10+
<span v-html="text"></span>
11+
<div class="card-items-list" v-if="message.card && message.card.items && message.card.items.length>0">
12+
<span v-if="message.card.header" class="card-items-header" v-html="message.card.header.text"></span>
13+
<CardItem v-for="item in message.card.items" :key="item.image_id"
14+
:image="item.image_id" :title="item.title" :payload="item.button.payload">
15+
</CardItem>
16+
</div>
17+
</div>
1018
</div>
1119

1220
<div class="message__buttons">
@@ -17,6 +25,13 @@
1725
</template>
1826

1927
<style lang="scss">
28+
.card-items-list {
29+
background: white;
30+
}
31+
.card-items-header {
32+
font-weight: bold;
33+
padding: 5px;
34+
}
2035
.message {
2136
margin-top: 15px;
2237
margin-bottom: 15px;
@@ -107,9 +122,10 @@
107122
<script>
108123
import { AUTHOR_NAME, ADD_MESSAGE, ALICE_REQUEST } from '~/store';
109124
import MessageButton from '~/components/MessageButton';
125+
import CardItem from '~/components/CardItem';
110126
111127
export default {
112-
components: { MessageButton },
128+
components: { MessageButton,CardItem },
113129
props: ['message'],
114130
115131
computed: {

‎components/MessageButton.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ export default {
5656
}
5757
5858
// run tests
59-
if (this.payload) {
59+
if (this.payload && 957C typeof this.payload ==="string") {
6060
const payload = JSON.parse(this.payload);
6161
if (payload.scenarios_test) {
6262
this.$store.dispatch(RUN_TEST, payload.scenarios_test);

‎store/index.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -256,6 +256,7 @@ export const actions = {
256256

257257
commit(ADD_MESSAGE, {
258258
text: responseData.response.text,
259+
card: responseData.response.card || {header:{},items:[]},
259260
buttons: responseData.response.buttons,
260261
end_session: responseData.response.end_session,
261262
author: 'Робот',

0 commit comments

Comments
 (0)
0