react_hsbc_teller 0.3.6 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/lib/hsbc.js +1 -1
  2. package/lib/hsbc.js.LICENSE.txt +21 -0
  3. package/package.json +2 -1
  4. package/packages/api/api.js +20 -0
  5. package/packages/assets/img/jingyin.png +0 -0
  6. package/packages/pages/foot/foot.jsx +70 -62
  7. package/packages/pages/foot/foot.less +1 -1
  8. package/packages/pages/video/video.jsx +763 -260
  9. package/packages/pages/video/video.less +91 -59
  10. package/lib/2347dc49865b40fb00382d9117c6cf56.png +0 -0
package/packages/pages/video/video.less CHANGED
@@ -12,6 +12,10 @@
12
12
  height: 100%;
13
13
  float: right
14
14
  }
15
+ .imgClassVoice{
16
+ width: 60px;
17
+ height: 60px;
18
+ }
15
19
  .sharedScreen{
16
20
  font-size: 10px;
17
21
  position: absolute;
@@ -20,49 +24,29 @@
20
24
  color: red;
21
25
  }
22
26
  .wrapper {
23
- overflow: hidden;
27
+ overflow: auto;
24
28
  height: 100%;
25
- width: 100%;
29
+ width: 20%;
26
30
  background: #f3f3f3;
27
31
  text-align: center;
28
- display: grid;
29
- grid-template-columns: 16.6% 16.6% 16.6% 16.6% 16.6% 16.6%;
30
- grid-template-rows: 16.6% 16.6% 16.6% 16.6% 16.6% 16.6%;
32
+ // display: grid;
33
+ // grid-template-columns: 16.6% 16.6% 16.6% 16.6% 16.6% 16.6%;
34
+ // grid-template-rows: 16.6% 16.6% 16.6% 16.6% 16.6% 16.6%;
31
35
  }
32
36
  .itemed {
33
37
  text-align: center;
34
38
  // border: 1px solid #fff;
35
39
  color: #fff;
36
40
  font-weight: bold;
37
- line-height: 150px;
41
+ height: 170px;
38
42
  position: relative;
39
43
  }
40
- .item1 {
41
- grid-column-start: 1;
42
- grid-column-end: 6;
43
- grid-row-start: 1;
44
- grid-row-end: 7;
45
- }
46
- .item2 {
47
- grid-column-start: 1;
48
- grid-column-end: 3;
49
- grid-row-start: 4;
50
- grid-row-end: 1;
51
- position: absolute;
52
- z-index: 2000;
53
- }
54
44
  .videoFit{
55
45
  object-fit: contain !important;
56
46
  }
57
- .itemPublic {
58
- grid-column-start: 1;
59
- grid-column-end: 7;
60
- grid-row-start: 1;
61
- grid-row-end: 7;
62
- }
63
47
  .isBack {
64
48
  transform: rotateY(180deg);
65
- background: #333;
49
+ // background: #333;
66
50
  }
67
51
  .video1{
68
52
  width: 100%;
@@ -79,8 +63,10 @@
79
63
  height: 100%;
80
64
  }
81
65
  .health{
82
- margin: 20px 20px 0 20px;
83
- height: ~"calc(100vh - 130px)";
66
+ width: ~"calc(100% - 40px)";
67
+ margin: 0px 20px 0 20px;
68
+ height: ~"calc(100vh - 150px)";
69
+ display: inline-flex;
84
70
  }
85
71
  .all{
86
72
  height: 100%;
@@ -144,33 +130,13 @@
144
130
  }
145
131
  .projection{
146
132
  width: 80%;
147
- height: ~"calc(100vh - 130px)";
148
- position: absolute;
149
- z-index: 1;
133
+ position: relative;
134
+ background: rgba(0,0,0,0.65);
135
+ color: #fff;
136
+ // height: ~"calc(100vh - 130px)";
137
+ // position: absolute;
138
+ // z-index: 1;
150
139
  // background: #fff;
151
- .button{
152
- display: inline-flex;
153
- // width: 100%;
154
- position: absolute;
155
- z-index: 1;
156
- top: 0;
157
- left: 80px;
158
- .selectSee{
159
- background: #00847F;
160
- border-radius: 0px 0px 2px 2px;
161
- border: 1px solid #00847F;
162
- }
163
- .noSelest{
164
- background: rgba(51, 51, 51, 0.25);
165
- border-radius: 0px 0px 2px 2px;
166
- }
167
- div{
168
- font-size: 16px;
169
- margin: 0 15px;
170
- color: #FFFFFF;
171
- padding: 6px 13px;
172
- }
173
- }
174
140
  .videoDiv{
175
141
  width: 100%;
176
142
  height: 100%;
@@ -183,9 +149,10 @@ border-radius: 0px 0px 2px 2px;
183
149
  }
184
150
  .customerTitle{
185
151
  position: absolute;
186
- top: 0;
152
+ // top: 0;
153
+ bottom: 0;
187
154
  left: 0px;
188
- width: 80px;
155
+ // width: 30%;
189
156
  line-height: 30px;
190
157
  height: 30px;
191
158
  // background: rgba(219, 0, 17, 0.1);
@@ -195,14 +162,79 @@ border-radius: 0px 0px 2px 2px;
195
162
  }
196
163
  .tellerTitle{
197
164
  position: absolute;
198
- top: 0;
165
+ // top: 0;
199
166
  right: 0px;
200
- width: 80px;
167
+ // width: 80px;
201
168
  line-height: 30px;
169
+
170
+ bottom: 0;
202
171
  height: 30px;
203
172
  // background: rgba(219, 0, 17, 0.1);
204
173
  border-radius: 4px 0px 2px 0px;
205
174
  transform: rotateY(180deg);
206
175
  // color: #DB0011;
207
176
  font-size: 14px;
177
+ }
178
+ .titleBig{
179
+ max-width: 30%;
180
+ }
181
+ .titleSamlle{
182
+ max-width: 70%;
183
+ }
184
+ .titleName{
185
+ white-space: nowrap;
186
+ text-overflow: ellipsis;
187
+ overflow: hidden;
188
+ padding: 0 10px;
189
+ }
190
+ .themeClass{
191
+ position: absolute;
192
+ top: 50%;
193
+ left: 40%;
194
+ ul{
195
+ li{
196
+ list-style: none;
197
+ span{
198
+ font-size: 20px;
199
+ }
200
+ label{
201
+ font-size: 16px;
202
+ }
203
+ }
204
+ }
205
+ }
206
+ .button{
207
+ display: inline-flex;
208
+ margin-left: 7px;
209
+ // width: 100%;
210
+ // position: absolute;
211
+ // z-index: 1;
212
+ // top: 0;
213
+ // left: 0;
214
+ .selectSee{
215
+ background: #00847F;
216
+ border-radius: 0px 0px 2px 2px;
217
+ border: 1px solid #00847F;
218
+ }
219
+ .noSelest{
220
+ background: rgba(51, 51, 51, 0.25);
221
+ border-radius: 0px 0px 2px 2px;
222
+ }
223
+ div{
224
+ font-size: 16px;
225
+ margin: 0 15px;
226
+ color: #FFFFFF;
227
+ padding: 6px 13px;
228
+ }
229
+ }
230
+ .voiceClass{
231
+ position: absolute;
232
+ bottom: 0;
233
+ left: 0;
234
+ transform: rotateY(180deg);
235
+ }
236
+ .voiceVideoClass{
237
+ position: absolute;
238
+ bottom: 0;
239
+ right: 0;
208
240
  }