askbot-dragon 0.9.30 → 1.0.0

package/src/components/feedBack.vue

@@ -1,137 +1,137 @@
-<template>
-  <div id="feedBack" class="companyNotRem" :class="{phoneClass:isPhone,companyClass:isCompany,notClick:isDisabled===true}">
-    <span :class="!positiveClick?'feed-button':'feed-check-button'" class="feed-commen">
-      <el-button plain class="btnClass" @click="positiveFeedback(feedBack,1)"   v-html="feedBack.positiveFeedback.text" v-if="!positiveClick">{{feedBack.positiveFeedback.text}}</el-button>
-      <el-button plain class="btnClassActive"  v-html="feedBack.positiveFeedback.text" v-else>{{feedBack.positiveFeedback.text}}</el-button>
-    </span>
-    <span  :class="!negativeClick?'feed-button':'feed-check-button'">
-      <el-button plain class="btnClass" @click="positiveFeedback(feedBack,2)"   v-html="feedBack.negativeFeedback.text" v-if="!negativeClick">{{feedBack.negativeFeedback.text}}</el-button>
-      <el-button plain class="btnClassActive"  v-html="feedBack.negativeFeedback.text" v-else>{{feedBack.negativeFeedback.text}}</el-button>
-    </span>
-  </div>
-</template>
-<script>
-export default {
-name: "feedBack",
-  data(){
-    return{
-      isPhone:false,
-      isCompany:false,
-      isDisabled:false,
-      positiveClick:false,
-      negativeClick:false
-    }
-  },
-  props:{
-    feedBack:Object,
-    rem:String,
-    disable:Boolean,
-  },
-  beforeMount() {
-    if(this.disable===true)
-    {
-      this.isDisabled=true
-    }
-    else
-    {
-      this.isDisabled=false
-    }
-  },
-  mounted() {
-  this.isMobile()
-  },
-  methods:{
-    isMobile() {
-      let flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i);
-      if (flag) {
-        this.isPhone=true
-      }
-      else
-      {
-        this.isCompany=true
-      }
-    },
-    positiveFeedback(Feedback,index){
-      let feedbackObj={};
-      let feedback={};
-      if(index===1)
-      {
-        feedbackObj['positiveFeedback']=Feedback.positiveFeedback;
-        feedback['feedback']=feedbackObj;
-        feedback['feedbackActions']=Feedback.feedbackActions
-        feedback['feedbackUid']=Feedback.feedbackUid
-        this.positiveClick=true
-      }
-      else if(index === 2)
-      {
-        feedbackObj['negativeFeedback']=Feedback.negativeFeedback;
-        feedback['feedback']=feedbackObj;
-        feedback['feedbackActions']=Feedback.feedbackActions
-        feedback['feedbackUid']=Feedback.feedbackUid
-        this.negativeClick=true
-      }
-      feedback.feedbackUid = this.feedBack.feedbackUid;
-      feedback.apiKey=this.feedBack.apiKey
-      this.$emit('positiveFeedback',feedback,this.feedBack.apiKey);
-      this.isDisabled=true
-    },
-  }
-}
-</script>
-
-<style scoped lang="less">
-#feedBack{
-  .feed-commen{
-    margin-right: 8px;
-  }
-  .feed-button{
-    /deep/.el-button{
-      border: 1px solid #BEC5DB;
-      color: #616161;
-      border-radius: 14px;
-      font-weight: 400;
-    }
-  }
-  .feed-check-button{
-    /deep/.el-button{
-      border: 1px solid #BBCDFF;
-      color: #366aff;
-      border-radius: 14px;
-      font-weight: 400;
-    }
-  }
-
-  /deep/.el-button.is-plain{
-    padding: 9px 20px;
-  }
-}
-.phoneClass{
-  width: 100vw;
-  text-align: left;
-  /*margin: 0 auto;*/
-  line-height: 34px;
-  height: 56px;
-  padding-left: 20px;
-  .el-button{
-    min-width: 60px;
-    height: 31px;
-    line-height: 0.9;
-  }
-}
-.companyClass{
-/*  min-width: 300px;*/
-  width: 370px;
-  text-align: left;
-  /*margin: 0 auto;*/
-  line-height: 34px;
-  padding-left: 20px;
-  .el-button{
-    min-width: 60px;
-    height: 32px;
-    line-height: 0.9;
-  }
-}
-.notClick{
-  pointer-events: none;
-}
+<template>
+  <div id="feedBack" class="companyNotRem" :class="{phoneClass:isPhone,companyClass:isCompany,notClick:isDisabled===true}">
+    <span :class="!positiveClick?'feed-button':'feed-check-button'" class="feed-commen">
+      <el-button plain class="btnClass" @click="positiveFeedback(feedBack,1)"   v-html="feedBack.positiveFeedback.text" v-if="!positiveClick">{{feedBack.positiveFeedback.text}}</el-button>
+      <el-button plain class="btnClassActive"  v-html="feedBack.positiveFeedback.text" v-else>{{feedBack.positiveFeedback.text}}</el-button>
+    </span>
+    <span  :class="!negativeClick?'feed-button':'feed-check-button'">
+      <el-button plain class="btnClass" @click="positiveFeedback(feedBack,2)"   v-html="feedBack.negativeFeedback.text" v-if="!negativeClick">{{feedBack.negativeFeedback.text}}</el-button>
+      <el-button plain class="btnClassActive"  v-html="feedBack.negativeFeedback.text" v-else>{{feedBack.negativeFeedback.text}}</el-button>
+    </span>
+  </div>
+</template>
+<script>
+export default {
+name: "feedBack",
+  data(){
+    return{
+      isPhone:false,
+      isCompany:false,
+      isDisabled:false,
+      positiveClick:false,
+      negativeClick:false
+    }
+  },
+  props:{
+    feedBack:Object,
+    rem:String,
+    disable:Boolean,
+  },
+  beforeMount() {
+    if(this.disable===true)
+    {
+      this.isDisabled=true
+    }
+    else
+    {
+      this.isDisabled=false
+    }
+  },
+  mounted() {
+  this.isMobile()
+  },
+  methods:{
+    isMobile() {
+      let flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i);
+      if (flag) {
+        this.isPhone=true
+      }
+      else
+      {
+        this.isCompany=true
+      }
+    },
+    positiveFeedback(Feedback,index){
+      let feedbackObj={};
+      let feedback={};
+      if(index===1)
+      {
+        feedbackObj['positiveFeedback']=Feedback.positiveFeedback;
+        feedback['feedback']=feedbackObj;
+        feedback['feedbackActions']=Feedback.feedbackActions
+        feedback['feedbackUid']=Feedback.feedbackUid
+        this.positiveClick=true
+      }
+      else if(index === 2)
+      {
+        feedbackObj['negativeFeedback']=Feedback.negativeFeedback;
+        feedback['feedback']=feedbackObj;
+        feedback['feedbackActions']=Feedback.feedbackActions
+        feedback['feedbackUid']=Feedback.feedbackUid
+        this.negativeClick=true
+      }
+      feedback.feedbackUid = this.feedBack.feedbackUid;
+      feedback.apiKey=this.feedBack.apiKey
+      this.$emit('positiveFeedback',feedback,this.feedBack.apiKey);
+      this.isDisabled=true
+    },
+  }
+}
+</script>
+
+<style scoped lang="less">
+#feedBack{
+  .feed-commen{
+    margin-right: 8px;
+  }
+  .feed-button{
+    /deep/.el-button{
+      border: 1px solid #BEC5DB;
+      color: #616161;
+      border-radius: 14px;
+      font-weight: 400;
+    }
+  }
+  .feed-check-button{
+    /deep/.el-button{
+      border: 1px solid #BBCDFF;
+      color: #366aff;
+      border-radius: 14px;
+      font-weight: 400;
+    }
+  }
+
+  /deep/.el-button.is-plain{
+    padding: 9px 20px;
+  }
+}
+.phoneClass{
+  width: 100vw;
+  text-align: left;
+  /*margin: 0 auto;*/
+  line-height: 34px;
+  height: 56px;
+  padding-left: 20px;
+  .el-button{
+    min-width: 60px;
+    height: 31px;
+    line-height: 0.9;
+  }
+}
+.companyClass{
+/*  min-width: 300px;*/
+  width: 370px;
+  text-align: left;
+  /*margin: 0 auto;*/
+  line-height: 34px;
+  padding-left: 20px;
+  .el-button{
+    min-width: 60px;
+    height: 32px;
+    line-height: 0.9;
+  }
+}
+.notClick{
+  pointer-events: none;
+}
 </style>

package/src/components/fielListView.vue

@@ -0,0 +1,346 @@
+<template>
+    <div id="attachment-upload">
+        <div v-if="attachmentList.length != 0" class="image-list">
+            <!-- <template v-if="items.field.type === 'IMAGE'">
+                <div v-for="(item, index) in attachmentList" class="image-item" :key="item.url + index">
+                    <template v-if="typeof item == 'object'">
+                        <el-image style="width: 60px; height: 60px" :src="item.url" :preview-src-list="[item.url]">
+                        </el-image>
+                    </template>
+                    <template v-else>
+                        <el-image style="width: 60px; height: 60px" :src="item"
+                            :preview-src-list="attachmentList">
+                        </el-image>
+                    </template>
+                    <span class="delete" @click="deleteAttch(index)"><i
+                            class="iconfont guoran-tongyichicun-16-09-shanchu2"></i></span>
+                </div>
+            </template>
+            <template v-else-if="items.field.type === 'VIDEO'">
+                <div v-for="(item, index) in attachmentList" class="video-item" :key="item.url + index">
+                    <template v-if="typeof item == 'object'">
+                        <img src="../assets/image/play.png"
+                            @click="openDialog(item.url, item.name)">
+                    </template>
+                    <template v-else>
+                        <img src="../assets/images/play.png"
+                            @click="openDialog(item, item.name)">
+                    </template>
+                    <span class="delete" @click="deleteAttch(index)"><i
+                            class="iconfont guoran-tongyichicun-16-09-shanchu2"></i></span>
+                </div>
+            </template> -->
+            <template>
+                <div v-for="(item, index) in attachmentList" class="attch-item" :key="item.url + index"
+                   >
+                   <!-- @click="openDialog(item, item.name)" -->
+                    <span @click.stop="deleteAttch(index)"><i class="iconfont guoran-a-16-09"></i></span>
+                    <div class="attch-item-left">
+                        <img src="../assets/image/video.png"
+                            v-if="setSrc(item.name) == 'video'" />
+                        <img src="../assets/image/image.png"
+                            v-else-if="setSrc(item.name) == 'image'" />
+                        <img src="../assets/image/txt.png"
+                            v-else-if="setSrc(item.name) == 'txt'" />
+                        <img src="../assets/image/word.png"
+                            v-else-if="setSrc(item.name) == 'word'" />
+                        <img src="../assets/image/pdf.png"
+                            v-else-if="setSrc(item.name) == 'pdf'" />
+                        <img src="../assets/image/ppt.png"
+                            v-else-if="setSrc(item.name) == 'ppt'" />
+                        <img src="../assets/image/excel.png"
+                            v-else-if="setSrc(item.name) == 'excel'" />
+                        <div class="fileName" v-if="item">
+                            <template v-if="typeof item === 'string'">
+                                <template v-if="item.indexOf('[') !== -1">
+                                    {{ JSON.parse(item)[index] }}
+                                </template>
+                            </template>
+                            <template v-else>
+                                {{ item.name }}
+                            </template>
+                        </div>
+                    </div>
+                </div>
+            </template>
+        </div>
+        <!-- <el-dialog :visible.sync="dialogVisible" width="800px"  :close-on-click-modal="false"
+            custom-class="look-dialog">
+            <template v-if="fieldType === 'VIDEO'">
+                <video :src="dialogUrl" controls></video>
+            </template>
+            <template v-else-if="fieldType === 'IMAGE'">
+                <img :src="dialogUrl" />
+            </template>
+            <div v-else-if="fieldType === 'txt' || fieldType === 'doc'" style="height: 60vh">
+                <embed :src="dialogUrl" width="100%" height="100%" />
+            </div>
+        </el-dialog> -->
+    </div>
+</template>
+
+<script>
+
+export default {
+    name: "customUpload",
+    components: {},
+    data () {
+        return {
+            dialogUrl: "",
+            dialogVisible: false,
+            fieldType: "",
+        }
+    },
+    props: ["attachmentList"],
+    methods: {
+        //查看视频
+        openDialog (item, fileName) {
+            let url = typeof item == 'object' ? item.url : item
+            this.fieldType = ""
+            const fileType = fileName.substring(fileName.lastIndexOf('.'));
+            this.dialogUrl = url;
+            if (fileType === '.mp4' || fileType === '.MP4') {
+                this.fieldType = 'VIDEO'
+                this.dialogVisible = true;
+            }
+            else if (fileType === '.jpg' || fileType === '.png' || fileType === '.JPG' || fileType === '.PNG') {
+                this.fieldType = 'IMAGE'
+                this.dialogVisible = true;
+            }
+            else {
+                window.open(url, 'target');
+            }
+        },
+        deleteAttch (index) {
+            this.$emit('attachDeleteAttch', index)
+        },
+        //根据上传类型设置图标
+        setSrc (fileName) {
+            let file = ""
+            const fileType = fileName.substring(fileName.lastIndexOf('.'));
+            if (fileType === '.mp4' || fileType === '.MP4') {
+                file = 'video'
+            }
+            else if (fileType === '.jpg' || fileType === '.png' || fileType === '.JPG' || fileType === '.PNG') {
+                file = 'image'
+            }
+            else if (fileType == '.txt') {
+                file = 'txt'
+            }
+            else if (fileType == '.ppt' || fileType == '.pptx') {
+                file = 'ppt'
+            }
+            else if (fileType == '.doc' || fileType == '.docx') {
+                file = 'word'
+            }
+            else if (fileType == '.xls' || fileType == '.xlsx') {
+                file = 'excel'
+            }
+            else if (fileType == '.pdf') {
+                file = 'pdf'
+            }
+            return file
+        },
+        //下载文件
+        updownload () {
+            window.location.href = this.dialogUrl
+            /*window.open(this.dialogUrl,'_black')*/
+        }
+    }
+};
+</script>
+
+<style scoped lang="less">
+.custom-upload-o {
+    display: flex;
+    align-items: center;
+}
+
+#attachment-upload {
+    .image-list {
+        display: flex;
+        flex-wrap: wrap;
+        padding: 0 8px;
+    }
+
+    .image-item {
+        margin: 0 6px;
+        position: relative;
+
+        .delete {
+            // width: 20px;
+            // height: 22px;
+            position: absolute;
+            top: 0px;
+            right: 0px;
+            // border-radius: 30px;
+            background: #ffffff;
+            display: flex;
+            align-items: center;
+            justify-content: flex-end;
+        }
+
+        .guoran-tongyichicun-16-09-shanchu2 {
+            color: #366aff;
+            // position: absolute;
+            // top: 0px;
+            // right: 0px;
+            // cursor: pointer;
+        }
+    }
+
+    .guoran-tongyichicun-16-09-shanchu2 {
+        display: none;
+    }
+
+    .image-item:hover {
+        .delete {
+            width: 18px;
+            height: 20px;
+        }
+
+        .guoran-tongyichicun-16-09-shanchu2 {
+            display: block;
+        }
+    }
+
+    .attch-item {
+        margin: 10px 0 0 0;
+        color: #606266;
+        font-size: 13px;
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        width: 100%;
+
+        .guoran-a-16-09 {
+            color: #366aff;
+        }
+
+        .attch-item-left {
+            display: flex;
+            align-items: center;
+            flex: none;
+            width: 97%;
+
+            img {
+                margin-right: 4px;
+            }
+        }
+    }
+
+    .video-item {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background-color: #f0f4fc;
+        width: 60px;
+        height: 60px;
+        border-radius: 5px;
+        margin: 0 6px;
+        position: relative;
+        overflow: hidden;
+
+        img {
+            cursor: pointer;
+        }
+
+        .delete {
+            // width: 20px;
+            // height: 22px;
+            position: absolute;
+            top: 0px;
+            right: 0px;
+            // border-radius: 30px;
+            background: #ffffff;
+            display: flex;
+            align-items: center;
+            justify-content: flex-end;
+
+        }
+
+        .guoran-tongyichicun-16-09-shanchu2 {
+            color: #366aff;
+            cursor: pointer;
+        }
+    }
+
+    .video-item:hover {
+        .delete {
+            width: 20px;
+            height: 22px;
+        }
+
+        .guoran-tongyichicun-16-09-shanchu2 {
+            display: block;
+        }
+    }
+
+    /deep/.attachment-upload {
+        .el-upload {
+            width: 100%;
+        }
+
+        .el-upload-dragger {
+            width: 100%;
+        }
+    }
+
+    .fileName {
+        max-width: 80%;
+        flex: none;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+    }
+
+    /deep/ .el-upload--picture-card {
+        width: 60px;
+        height: 60px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        flex: none;
+    }
+
+    /deep/.el-upload-dragger {
+        height: 60px;
+        display: flex;
+        align-items: center;
+        justify-content: space-around;
+
+        .el-icon-upload {
+            margin: 5px 10px 8px;
+            line-height: 30px;
+            font-size: 25px;
+        }
+
+        .el-upload__text {
+            display: flex;
+            // flex-direction: column;
+            flex-wrap: wrap;
+            flex: 1;
+        }
+    }
+
+    .el-upload-dragger>div {
+        display: flex;
+        align-items: center;
+    }
+}
+
+.look-dialog {
+    video {
+        height: 500px;
+        object-fit: contain;
+        width: 100%;
+    }
+
+    img {
+        height: 500px;
+        width: 100%;
+        object-fit: contain;
+    }
+}
+</style>