askbot-dragon 1.1.0 → 1.1.2
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.
- package/package.json +1 -1
- package/public/index.html +1 -1
- package/src/components/AnswerDocknowledge.vue +53 -8
- package/src/components/ConversationContainer.vue +420 -1082
- package/src/components/associationIntention.vue +33 -3
- package/src/components/attachmentPreview.vue +91 -0
- package/src/components/fielListView.vue +19 -53
- package/src/components/formTemplate.vue +23 -6
- package/src/components/previewDoc.vue +86 -0
|
@@ -23,10 +23,10 @@
|
|
|
23
23
|
<Recommend :msg="msg" @onRadioClickReco="onRadioClickReco"></Recommend>
|
|
24
24
|
</div>
|
|
25
25
|
<div v-if="msg.type === 'answer_rich_text' && !(msg.content.recommend && msg.content.recommend.status)">
|
|
26
|
-
<p v-html="$options.filters.imageStyle(msg.content.html)"></p>
|
|
26
|
+
<p v-html="$options.filters.imageStyle(msg.content.html)" @click="lookAttach($event)"></p>
|
|
27
27
|
</div>
|
|
28
28
|
<div v-else-if="msg.type == 'answer_rich_text' && (msg.content.recommend && msg.content.recommend.status)">
|
|
29
|
-
<p v-html="$options.filters.imageStyle(msg.content.html)" class="answer-rich-text"></p>
|
|
29
|
+
<p v-html="$options.filters.imageStyle(msg.content.html)" class="answer-rich-text" @click="lookAttach($event)"></p>
|
|
30
30
|
<Recommend :msg="msg.content" @onRadioClickReco="onRadioClickReco"></Recommend>
|
|
31
31
|
</div>
|
|
32
32
|
<div v-else-if="msgType === 'answer_image'" >
|
|
@@ -63,15 +63,17 @@
|
|
|
63
63
|
</div>
|
|
64
64
|
<Recommend v-if="msg.recommend && msg.recommend.list && msg.recommend.list.length > 0" :msg="msg" @onRadioClickReco="onRadioClickReco"></Recommend>
|
|
65
65
|
</div>
|
|
66
|
+
<previewDoc ref="previewDoc" :url="previewHref"></previewDoc>
|
|
66
67
|
</div>
|
|
67
68
|
</template>
|
|
68
69
|
|
|
69
70
|
<script>
|
|
70
71
|
import askVideo from "./askVideo";
|
|
71
72
|
import Recommend from "./recommend";
|
|
73
|
+
import previewDoc from "./previewDoc";
|
|
72
74
|
export default {
|
|
73
75
|
name: "associationIntention",
|
|
74
|
-
components: {Recommend, askVideo},
|
|
76
|
+
components: {Recommend, askVideo, previewDoc},
|
|
75
77
|
props: ["msg",'msgType','isOpen','sourceOhm','isOhmPc'],
|
|
76
78
|
filters: {
|
|
77
79
|
imageStyle: function (html) {
|
|
@@ -88,6 +90,11 @@
|
|
|
88
90
|
return msg
|
|
89
91
|
},
|
|
90
92
|
},
|
|
93
|
+
data() {
|
|
94
|
+
return {
|
|
95
|
+
previewHref: ""
|
|
96
|
+
}
|
|
97
|
+
},
|
|
91
98
|
mounted() {
|
|
92
99
|
},
|
|
93
100
|
methods:{
|
|
@@ -220,6 +227,25 @@
|
|
|
220
227
|
return reg.test(msg);
|
|
221
228
|
|
|
222
229
|
},
|
|
230
|
+
//预览图片
|
|
231
|
+
lookAttach(e){
|
|
232
|
+
if (e.target.localName == 'a'){
|
|
233
|
+
console.debug('lookImage',e.target.href)
|
|
234
|
+
this.previewHref = e.target.href
|
|
235
|
+
this.$refs.previewDoc.previewShowPopup = true
|
|
236
|
+
// let url = ''
|
|
237
|
+
// try {
|
|
238
|
+
// url = btoa(e.target.href)
|
|
239
|
+
// }
|
|
240
|
+
// catch {
|
|
241
|
+
// url = encodeURIComponent(btoa(e.target.href))
|
|
242
|
+
// }
|
|
243
|
+
// window.open('https://test.open.askbot.cn/kkfileview/onlinePreview?url=' + url)
|
|
244
|
+
// e.stopPropagation()
|
|
245
|
+
// e.preventDefault()
|
|
246
|
+
e.returnValue = false
|
|
247
|
+
}
|
|
248
|
+
},
|
|
223
249
|
},
|
|
224
250
|
watch:{
|
|
225
251
|
isOpen:{
|
|
@@ -265,6 +291,10 @@
|
|
|
265
291
|
/*padding-bottom: 10px;
|
|
266
292
|
border-bottom: 1px solid #EEEEEE;*/
|
|
267
293
|
}
|
|
294
|
+
/deep/a{
|
|
295
|
+
disabled:true
|
|
296
|
+
//pointer-events: none;
|
|
297
|
+
}
|
|
268
298
|
}
|
|
269
299
|
|
|
270
300
|
</style>
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<view class="attachment">
|
|
3
|
+
<view class="attachment-container">
|
|
4
|
+
<iframe width="100%" height="100%" :src="iframeSrc"
|
|
5
|
+
v-if="type!=='video'"
|
|
6
|
+
id="iframePreview"
|
|
7
|
+
frameborder="no"
|
|
8
|
+
border="0"
|
|
9
|
+
scrolling="no"
|
|
10
|
+
seamless></iframe>
|
|
11
|
+
<video :src="videoUrl" controls v-else></video>
|
|
12
|
+
</view>
|
|
13
|
+
</view>
|
|
14
|
+
|
|
15
|
+
</template>
|
|
16
|
+
|
|
17
|
+
<script>
|
|
18
|
+
export default {
|
|
19
|
+
name: "attachmentPreview",
|
|
20
|
+
data(){
|
|
21
|
+
return{
|
|
22
|
+
iframeSrc:"",
|
|
23
|
+
type:"",
|
|
24
|
+
videoUrl:""
|
|
25
|
+
}
|
|
26
|
+
},
|
|
27
|
+
mounted(){
|
|
28
|
+
let option = {}
|
|
29
|
+
this.iframeSrc = option.url ? option.url : "";
|
|
30
|
+
this.type = option.type ? option.type : "";
|
|
31
|
+
this.videoUrl = option.videoUrl ? option.videoUrl : ""
|
|
32
|
+
},
|
|
33
|
+
methods:{
|
|
34
|
+
|
|
35
|
+
}
|
|
36
|
+
};
|
|
37
|
+
</script>
|
|
38
|
+
|
|
39
|
+
<style scoped lang="less">
|
|
40
|
+
video{
|
|
41
|
+
width: 100%;
|
|
42
|
+
height: 100%;
|
|
43
|
+
}
|
|
44
|
+
.attachment{
|
|
45
|
+
height: 100%;
|
|
46
|
+
.attachment-container{
|
|
47
|
+
height: 100%;
|
|
48
|
+
overflow: hidden;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
.attachment-footer{
|
|
52
|
+
position: absolute;
|
|
53
|
+
bottom: 0;
|
|
54
|
+
padding: 10px 0;
|
|
55
|
+
width:100%;
|
|
56
|
+
background-color: white;
|
|
57
|
+
display: flex;
|
|
58
|
+
justify-content: space-around;
|
|
59
|
+
align-items: center;
|
|
60
|
+
box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.07);
|
|
61
|
+
// z-index:0;
|
|
62
|
+
.cacelBtn{
|
|
63
|
+
flex: 0.3;
|
|
64
|
+
height: 48px;
|
|
65
|
+
background: #EFF2F5;
|
|
66
|
+
color: #999999;
|
|
67
|
+
border-radius: 28px;
|
|
68
|
+
display: flex;
|
|
69
|
+
align-items: center;
|
|
70
|
+
justify-content: center;
|
|
71
|
+
cursor: pointer;
|
|
72
|
+
i{
|
|
73
|
+
margin-right: 8px;
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
.confirmBtn{
|
|
77
|
+
background-color: #366AFF;
|
|
78
|
+
color: white;
|
|
79
|
+
flex: 0.5;
|
|
80
|
+
height: 48px;
|
|
81
|
+
display: flex;
|
|
82
|
+
align-items: center;
|
|
83
|
+
justify-content: center;
|
|
84
|
+
border-radius: 28px;
|
|
85
|
+
cursor: pointer;
|
|
86
|
+
i{
|
|
87
|
+
margin-right: 8px;
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
</style>
|
|
@@ -1,44 +1,14 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div id="attachment-upload">
|
|
3
3
|
<div v-if="attachmentList.length != 0" class="image-list">
|
|
4
|
-
<!-- <template v-if="items.field.type === 'IMAGE'">
|
|
5
|
-
<div v-for="(item, index) in attachmentList" class="image-item" :key="item.url + index">
|
|
6
|
-
<template v-if="typeof item == 'object'">
|
|
7
|
-
<el-image style="width: 60px; height: 60px" :src="item.url" :preview-src-list="[item.url]">
|
|
8
|
-
</el-image>
|
|
9
|
-
</template>
|
|
10
|
-
<template v-else>
|
|
11
|
-
<el-image style="width: 60px; height: 60px" :src="item"
|
|
12
|
-
:preview-src-list="attachmentList">
|
|
13
|
-
</el-image>
|
|
14
|
-
</template>
|
|
15
|
-
<span class="delete" @click="deleteAttch(index)"><i
|
|
16
|
-
class="iconfont guoran-tongyichicun-16-09-shanchu2"></i></span>
|
|
17
|
-
</div>
|
|
18
|
-
</template>
|
|
19
|
-
<template v-else-if="items.field.type === 'VIDEO'">
|
|
20
|
-
<div v-for="(item, index) in attachmentList" class="video-item" :key="item.url + index">
|
|
21
|
-
<template v-if="typeof item == 'object'">
|
|
22
|
-
<img src="../assets/image/play.png"
|
|
23
|
-
@click="openDialog(item.url, item.name)">
|
|
24
|
-
</template>
|
|
25
|
-
<template v-else>
|
|
26
|
-
<img src="../assets/images/play.png"
|
|
27
|
-
@click="openDialog(item, item.name)">
|
|
28
|
-
</template>
|
|
29
|
-
<span class="delete" @click="deleteAttch(index)"><i
|
|
30
|
-
class="iconfont guoran-tongyichicun-16-09-shanchu2"></i></span>
|
|
31
|
-
</div>
|
|
32
|
-
</template> -->
|
|
33
4
|
<template>
|
|
34
5
|
<div v-for="(item, index) in attachmentList" class="attch-item" :key="item.url + index"
|
|
35
6
|
>
|
|
36
|
-
<!-- @click="openDialog(item, item.name)" -->
|
|
37
7
|
<span @click.stop="deleteAttch(index)"><i class="iconfont guoran-a-16-09"></i></span>
|
|
38
|
-
<div class="attch-item-left">
|
|
8
|
+
<div class="attch-item-left" @click="lookAttach(item.url)">
|
|
39
9
|
<i v-if="item.url == ''" class="el-icon-loading" style="color:#366AFF;margin: 5px;"></i>
|
|
40
10
|
<img src="../assets/image/video.png"
|
|
41
|
-
v-else-if="setSrc(item.name) == 'video'"
|
|
11
|
+
v-else-if="setSrc(item.name) == 'video'"/>
|
|
42
12
|
<img src="../assets/image/image.png"
|
|
43
13
|
v-else-if="setSrc(item.name) == 'image'" />
|
|
44
14
|
<img src="../assets/image/txt.png"
|
|
@@ -77,40 +47,28 @@
|
|
|
77
47
|
<embed :src="dialogUrl" width="100%" height="100%" />
|
|
78
48
|
</div>
|
|
79
49
|
</el-dialog> -->
|
|
50
|
+
<previewDoc ref="previewDoc" :url="previewHref"></previewDoc>
|
|
80
51
|
</div>
|
|
81
52
|
</template>
|
|
82
53
|
|
|
83
54
|
<script>
|
|
84
|
-
|
|
55
|
+
import previewDoc from './previewDoc.vue';
|
|
85
56
|
export default {
|
|
86
57
|
name: "customUpload",
|
|
87
|
-
components: {},
|
|
58
|
+
components: {previewDoc},
|
|
88
59
|
data () {
|
|
89
60
|
return {
|
|
90
|
-
dialogUrl: "",
|
|
91
61
|
dialogVisible: false,
|
|
92
|
-
|
|
62
|
+
previewHref:""
|
|
93
63
|
}
|
|
94
64
|
},
|
|
95
65
|
props: ["attachmentList"],
|
|
96
66
|
methods: {
|
|
97
67
|
//查看视频
|
|
98
|
-
openDialog (item
|
|
68
|
+
openDialog (item) {
|
|
99
69
|
let url = typeof item == 'object' ? item.url : item
|
|
100
|
-
this.
|
|
101
|
-
|
|
102
|
-
this.dialogUrl = url;
|
|
103
|
-
if (fileType === '.mp4' || fileType === '.MP4') {
|
|
104
|
-
this.fieldType = 'VIDEO'
|
|
105
|
-
this.dialogVisible = true;
|
|
106
|
-
}
|
|
107
|
-
else if (fileType === '.jpg' || fileType === '.png' || fileType === '.JPG' || fileType === '.PNG') {
|
|
108
|
-
this.fieldType = 'IMAGE'
|
|
109
|
-
this.dialogVisible = true;
|
|
110
|
-
}
|
|
111
|
-
else {
|
|
112
|
-
window.open(url, 'target');
|
|
113
|
-
}
|
|
70
|
+
this.previewHref = url
|
|
71
|
+
this.$refs.previewDoc.previewShowPopup = true
|
|
114
72
|
},
|
|
115
73
|
deleteAttch (index) {
|
|
116
74
|
this.$emit('attachDeleteAttch', index)
|
|
@@ -119,7 +77,7 @@ export default {
|
|
|
119
77
|
setSrc (fileName) {
|
|
120
78
|
let file = ""
|
|
121
79
|
const fileType = fileName.substring(fileName.lastIndexOf('.'));
|
|
122
|
-
if (fileType === '.mp4' || fileType === '.MP4') {
|
|
80
|
+
if (fileType === '.mp4' || fileType === '.MP4' || fileType === '.mov' || fileType === '.MOV') {
|
|
123
81
|
file = 'video'
|
|
124
82
|
}
|
|
125
83
|
else if (fileType === '.jpg' || fileType === '.png' || fileType === '.JPG' || fileType === '.PNG') {
|
|
@@ -146,6 +104,12 @@ export default {
|
|
|
146
104
|
updownload () {
|
|
147
105
|
window.location.href = this.dialogUrl
|
|
148
106
|
/*window.open(this.dialogUrl,'_black')*/
|
|
107
|
+
},
|
|
108
|
+
lookAttach(url){
|
|
109
|
+
if(url !== '') {
|
|
110
|
+
this.previewHref = url
|
|
111
|
+
this.$refs.previewDoc.previewShowPopup = true
|
|
112
|
+
}
|
|
149
113
|
}
|
|
150
114
|
}
|
|
151
115
|
};
|
|
@@ -224,7 +188,9 @@ export default {
|
|
|
224
188
|
align-items: center;
|
|
225
189
|
flex: none;
|
|
226
190
|
width: 97%;
|
|
227
|
-
|
|
191
|
+
overflow: hidden;
|
|
192
|
+
text-overflow: ellipsis;
|
|
193
|
+
margin-left: 6px;
|
|
228
194
|
img {
|
|
229
195
|
margin-right: 4px;
|
|
230
196
|
}
|
|
@@ -202,8 +202,8 @@
|
|
|
202
202
|
v-else-if="item.formField.extInfo.cascadeDown.length != 0"
|
|
203
203
|
></el-cascader>-->
|
|
204
204
|
</template>
|
|
205
|
-
<
|
|
206
|
-
<div @click="checkUpload(item.fieldId,item.formField.extInfo)" @mouseover="checkUpload(item.fieldId,item.formField.extInfo)" style="
|
|
205
|
+
<template v-else-if="item.formField.type==='FILE' || item.formField.type === 'IMAGE' || item.formField.type === 'ATTACHMENT' || item.formField.type === 'VIDEO'">
|
|
206
|
+
<div @click="checkUpload(item.fieldId,item.formField.extInfo)" @mouseover="checkUpload(item.fieldId,item.formField.extInfo)" class="form-field-file" style="display:flex;flex-direction: column">
|
|
207
207
|
<el-upload
|
|
208
208
|
|
|
209
209
|
ref="upload"
|
|
@@ -220,14 +220,16 @@
|
|
|
220
220
|
:http-request="aliyunOssRequest"
|
|
221
221
|
:on-change="handleEditChange"
|
|
222
222
|
:on-success="successUpload"
|
|
223
|
+
:show-file-list="item.formField.type === 'IMAGE' ? true : false"
|
|
223
224
|
>
|
|
224
225
|
<div class="upload-demo">
|
|
225
226
|
<i class="el-icon-plus"></i>
|
|
226
227
|
</div>
|
|
227
228
|
<!-- <el-button size="small" type="primary" v-else class="uploadBtn">点击上传</el-button>-->
|
|
228
229
|
</el-upload>
|
|
230
|
+
<file-list-view :attachmentList="extInfoFieldValue[item.fieldId]" v-if="extInfoFieldValue[item.fieldId] && item.formField.type !== 'IMAGE'" @attachDeleteAttch="attachDeleteFile($event,item.fieldId)"></file-list-view>
|
|
229
231
|
</div>
|
|
230
|
-
</
|
|
232
|
+
</template>
|
|
231
233
|
<div v-else-if="item.formField.type == 'REF_TEMPLATE' || item.formField.type == 'REF'">
|
|
232
234
|
<el-select
|
|
233
235
|
v-model=item.value
|
|
@@ -656,11 +658,13 @@
|
|
|
656
658
|
:after-read="afterRead"
|
|
657
659
|
:accept="acceptFieldType(item.formField.type)"
|
|
658
660
|
:multiple="item.formField.extInfo&&item.formField.extInfo.limitNum&&item.formField.extInfo.limitNum>1?true:false"
|
|
661
|
+
:preview-image="item.formField.type === 'IMAGE' ? true : false"
|
|
659
662
|
>
|
|
660
663
|
<div class="vant-upload--picture-card">
|
|
661
664
|
<i class="el-icon-plus"></i>
|
|
662
665
|
</div>
|
|
663
666
|
</van-uploader>
|
|
667
|
+
<file-list-view :attachmentList="extInfoFieldValue[item.fieldId]" v-if="extInfoFieldValue[item.fieldId] && item.formField.type !== 'IMAGE' && !fileUpload" @attachDeleteAttch="attachDeleteFile($event,item.fieldId)"></file-list-view>
|
|
664
668
|
</div>
|
|
665
669
|
</div>
|
|
666
670
|
</div>
|
|
@@ -957,12 +961,10 @@ export default {
|
|
|
957
961
|
}
|
|
958
962
|
})
|
|
959
963
|
let newArr = arr.filter(item=>item.relationDisplay)
|
|
960
|
-
console.debug('formFieldRelation',arr,newArr)
|
|
961
964
|
return newArr;
|
|
962
965
|
},
|
|
963
966
|
acceptFieldType(){
|
|
964
967
|
return (type)=>{
|
|
965
|
-
console.debug('type',type)
|
|
966
968
|
if (type == 'FILE'){
|
|
967
969
|
return 'image/*'
|
|
968
970
|
} else if( type == 'IMAGE') {
|
|
@@ -2384,7 +2386,7 @@ export default {
|
|
|
2384
2386
|
}
|
|
2385
2387
|
if (!this.extInfoFieldValue[this.filedId])
|
|
2386
2388
|
{
|
|
2387
|
-
this.extInfoFieldValue
|
|
2389
|
+
this.$set(this.extInfoFieldValue,this.filedId,[])
|
|
2388
2390
|
}
|
|
2389
2391
|
this.extInfoFieldValue[this.filedId].push(imgInfo)
|
|
2390
2392
|
this.loading.close()
|
|
@@ -2854,6 +2856,9 @@ export default {
|
|
|
2854
2856
|
attachDeleteAttch (index) {
|
|
2855
2857
|
this.attachments.splice(index, 1)
|
|
2856
2858
|
this.attachmentList.splice(index, 1)
|
|
2859
|
+
},
|
|
2860
|
+
attachDeleteFile(index,fieldId){
|
|
2861
|
+
this.extInfoFieldValue[fieldId].splice(index,1)
|
|
2857
2862
|
}
|
|
2858
2863
|
},
|
|
2859
2864
|
watch:{
|
|
@@ -2996,6 +3001,13 @@ export default {
|
|
|
2996
3001
|
font-size: 1em;
|
|
2997
3002
|
padding-bottom: 8px;
|
|
2998
3003
|
}
|
|
3004
|
+
.form-field-file{
|
|
3005
|
+
#attachment-upload{
|
|
3006
|
+
/deep/.image-list{
|
|
3007
|
+
padding: 0;
|
|
3008
|
+
}
|
|
3009
|
+
}
|
|
3010
|
+
}
|
|
2999
3011
|
}
|
|
3000
3012
|
.pcFormClass{
|
|
3001
3013
|
width: 400px;
|
|
@@ -3134,6 +3146,11 @@ export default {
|
|
|
3134
3146
|
color: #A9B3C6;
|
|
3135
3147
|
/* color: #000000;*/
|
|
3136
3148
|
}
|
|
3149
|
+
#attachment-upload{
|
|
3150
|
+
/deep/.image-list{
|
|
3151
|
+
padding: 0;
|
|
3152
|
+
}
|
|
3153
|
+
}
|
|
3137
3154
|
}
|
|
3138
3155
|
.workorder_description{
|
|
3139
3156
|
/* padding: 8px 16px;*/
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<van-popup v-model="previewShowPopup" position="bottom" :style="{ height: '90%', background:'#FFFFFF'}">
|
|
3
|
+
<div class="footer">
|
|
4
|
+
<span>查看详情</span>
|
|
5
|
+
<section @click="close">
|
|
6
|
+
<i class="iconfont guoran-shanchu"></i>
|
|
7
|
+
</section>
|
|
8
|
+
</div>
|
|
9
|
+
<div v-if="fileType == 'VIDEO'" style="width: 100%;height: calc(100% - 70px)">
|
|
10
|
+
<video :src="url" controls width="100%;" height="98%"></video>
|
|
11
|
+
</div>
|
|
12
|
+
<template v-else-if="url.includes('https://www') || url.includes('http://www')">
|
|
13
|
+
<iframe class="preview_iframe"
|
|
14
|
+
:src="url"
|
|
15
|
+
width="100%"
|
|
16
|
+
height="100%"
|
|
17
|
+
scrolling="100%"
|
|
18
|
+
frameborder="no"
|
|
19
|
+
border="0"></iframe>
|
|
20
|
+
</template>
|
|
21
|
+
<template v-else>
|
|
22
|
+
<iframe class="preview_iframe" :src="previewUrl" style="border:none;"></iframe>
|
|
23
|
+
</template>
|
|
24
|
+
</van-popup>
|
|
25
|
+
</template>
|
|
26
|
+
|
|
27
|
+
<script>
|
|
28
|
+
export default {
|
|
29
|
+
data () {
|
|
30
|
+
return {
|
|
31
|
+
previewShowPopup: false
|
|
32
|
+
}
|
|
33
|
+
},
|
|
34
|
+
props:{
|
|
35
|
+
url:{
|
|
36
|
+
type: String,
|
|
37
|
+
required: true,
|
|
38
|
+
}
|
|
39
|
+
},
|
|
40
|
+
computed:{
|
|
41
|
+
previewUrl() {
|
|
42
|
+
console.debug('VUE_APP_ENV',process.env.VUE_APP_ENV)
|
|
43
|
+
let url = process.env.VUE_APP_ENV === 'production' ? 'https://kkfileview.askbot.cn/onlinePreview?url=' : 'https://test.open.askbot.cn/kkfileview/onlinePreview?url='
|
|
44
|
+
if(this.url != '') {
|
|
45
|
+
if(/[\u4E00-\u9FA5]+/g.test(this.url)) {
|
|
46
|
+
url += btoa(encodeURIComponent(this.url))
|
|
47
|
+
} else {
|
|
48
|
+
url += btoa(this.url)
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
return url
|
|
52
|
+
},
|
|
53
|
+
fileType() {
|
|
54
|
+
const fileType = this.url.substring(this.url.lastIndexOf('.'));
|
|
55
|
+
if (fileType === '.mp4' || fileType === '.MP4' || fileType === '.MOV' || fileType === '.mov') {
|
|
56
|
+
return 'VIDEO'
|
|
57
|
+
} else {
|
|
58
|
+
return 'OTHER'
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
}
|
|
62
|
+
},
|
|
63
|
+
methods :{
|
|
64
|
+
close() {
|
|
65
|
+
this.previewShowPopup = false
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
</script>
|
|
70
|
+
|
|
71
|
+
<style lang="less" scoped>
|
|
72
|
+
.preview_iframe {
|
|
73
|
+
width: 100%;
|
|
74
|
+
height: calc(100% - 52px);
|
|
75
|
+
}
|
|
76
|
+
.footer {
|
|
77
|
+
width: calc(100% - 40px);
|
|
78
|
+
height: 50px;
|
|
79
|
+
display: flex;
|
|
80
|
+
align-items: center;
|
|
81
|
+
justify-content: space-between;
|
|
82
|
+
cursor: pointer;
|
|
83
|
+
padding: 0 20px;
|
|
84
|
+
border-bottom: 1px solid #cccccc;
|
|
85
|
+
}
|
|
86
|
+
</style>
|