Merge pull request #2022 from dataease/dev

frontend/src/components/canvas/components/Editor/FrameLinks.vue

@@ -27,6 +27,7 @@
 <script>
 import { mapState } from 'vuex'
 import { deepCopy } from '@/components/canvas/utils/utils'
+import { checkAddHttp } from '@/utils/urlUtils'
 
 export default {
   props: {
@@ -69,6 +70,7 @@ export default {
       this.linkInfoTemp = deepCopy(this.linkInfo)
     },
     onSubmit() {
+      this.linkInfoTemp.src = checkAddHttp(this.linkInfoTemp.src)
       this.curComponent.frameLinks = this.linkInfoTemp
       this.$store.state.styleChangeTimes++
       this.popoverClose()

frontend/src/components/canvas/components/Editor/Hyperlinks.vue

@@ -35,6 +35,7 @@
 <script>
 import { mapState } from 'vuex'
 import { deepCopy } from '@/components/canvas/utils/utils'
+import { checkAddHttp } from '@/utils/urlUtils'
 
 export default {
   props: {
@@ -60,6 +61,7 @@ export default {
   },
   methods: {
     onSubmit() {
+      this.linkInfo.content = checkAddHttp(this.linkInfo.content)
       this.curComponent.hyperlinks = deepCopy(this.linkInfo)
       this.$store.state.styleChangeTimes++
       this.popoverClose()

frontend/src/components/canvas/components/Editor/StreamMediaLinks.vue

@@ -13,28 +13,30 @@
             <!--            <el-radio :label="'hls'">HLS 直播</el-radio>-->
             <!--                    <el-radio :label="'rtmp'">{{$t('panel.streaming_media')}}</el-radio>-->
           </el-radio-group>
-        </el-form-item>
-        <el-form-item :label="$t('panel.auto_play')">
-          <el-switch v-model="streamMediaInfoTemp[streamMediaInfoTemp.videoType].autoplay" size="mini" />
           <span style="color: #909399; font-size: 8px;margin-left: 3px">
             Tips:{{ $t('panel.live_tips') }}
           </span>
         </el-form-item>
-        <el-form-item v-if="streamMediaInfoTemp.videoType==='flv'" :label="$t('panel.play_frequency')">
-          <el-radio-group v-model="streamMediaInfoTemp[streamMediaInfoTemp.videoType].loop">
-            <el-radio :label="false">{{ $t('panel.play_once') }}</el-radio>
-            <el-radio :label="true">{{ $t('panel.play_circle') }}</el-radio>
-          </el-radio-group>
-        </el-form-item>
-        <el-form-item v-if="streamMediaInfoTemp.videoType==='flv'" :label="$t('panel.is_live')">
+        <el-row v-if="streamMediaInfoTemp.videoType==='flv'">
+          <el-form-item :label="$t('panel.is_live')">
             <el-radio-group v-model="streamMediaInfoTemp[streamMediaInfoTemp.videoType].isLive">
               <el-radio :label="true">{{ $t('panel.yes') }}</el-radio>
               <el-radio :label="false">{{ $t('panel.no') }}</el-radio>
             </el-radio-group>
           </el-form-item>
+          <el-form-item v-if="!streamMediaInfoTemp[streamMediaInfoTemp.videoType].isLive" :label="$t('panel.auto_play')">
+            <el-switch v-model="streamMediaInfoTemp[streamMediaInfoTemp.videoType].autoplay" size="mini" />
+          </el-form-item>
+          <el-form-item v-if="!streamMediaInfoTemp[streamMediaInfoTemp.videoType].isLive" :label="$t('panel.play_frequency')">
+            <el-radio-group v-model="streamMediaInfoTemp[streamMediaInfoTemp.videoType].loop">
+              <el-radio :label="false">{{ $t('panel.play_once') }}</el-radio>
+              <el-radio :label="true">{{ $t('panel.play_circle') }}</el-radio>
+            </el-radio-group>
+          </el-form-item>
           <el-form-item :label="$t('panel.video_links')">
             <el-input v-model="streamMediaInfoTemp[streamMediaInfoTemp.videoType].url" />
           </el-form-item>
+        </el-row>
         <el-form-item>
           <el-button type="primary" @click="onSubmit">{{ $t('panel.confirm') }}</el-button>
           <el-button @click="onClose">{{ $t('panel.cancel') }}</el-button>
@@ -48,6 +50,8 @@
 <script>
 import { mapState } from 'vuex'
 import { deepCopy } from '@/components/canvas/utils/utils'
+import bus from '@/utils/bus'
+import { checkAddHttp } from '@/utils/urlUtils'
 
 export default {
   props: {
@@ -90,8 +94,10 @@ export default {
       this.streamMediaInfoTemp = deepCopy(this.linkInfo)
     },
     onSubmit() {
+      this.streamMediaInfoTemp[this.streamMediaInfoTemp.videoType].url = checkAddHttp(this.streamMediaInfoTemp[this.streamMediaInfoTemp.videoType].url)
       this.curComponent.streamMediaLinks = this.streamMediaInfoTemp
       this.$store.state.styleChangeTimes++
+      bus.$emit('streamMediaLinksChange-' + this.curComponent.id)
       this.popoverClose()
     },
     onClose() {

frontend/src/components/canvas/components/Editor/VideoLinks.vue

@@ -42,6 +42,7 @@
 <script>
 import { mapState } from 'vuex'
 import { deepCopy } from '@/components/canvas/utils/utils'
+import { checkAddHttp } from '@/utils/urlUtils'
 
 export default {
   props: {
@@ -84,6 +85,7 @@ export default {
       this.linkInfoTemp = deepCopy(this.linkInfo)
     },
     onSubmit() {
+      this.linkInfoTemp[this.linkInfoTemp.videoType].sources[0].src = checkAddHttp(this.linkInfoTemp[this.linkInfoTemp.videoType].sources[0].src)
       this.curComponent.videoLinks = this.linkInfoTemp
       this.$store.state.styleChangeTimes++
       this.popoverClose()

frontend/src/components/canvas/custom-component/DeStreamMedia.vue

 <template>
   <el-row ref="mainPlayer" style="width: 100%;height: 100%">
     <div v-if="element.streamMediaLinks[element.streamMediaLinks.videoType].url" class="video-container">
-      <video ref="player" class="centered-video" name="centeredVideo" :controls="editMode!=='edit'" :loop="pOption.loop" muted />
+      <video ref="player" class="centered-video" name="centeredVideo" :loop="pOption.loop" controls muted />
+      <div v-if="editMode==='edit'" class="stream-mask" />
     </div>
     <div v-else class="info-stream-class">
       {{ $t('panel.stream_media_add_tips') }}
@@ -12,6 +13,7 @@
 
 import flvjs from 'flv.js'
 import '@/custom-theme.css'
+import bus from '@/utils/bus'
 
 export default {
   props: {
@@ -67,6 +69,9 @@ export default {
   },
   mounted() {
     this.initOption()
+    bus.$on('streamMediaLinksChange-' + this.element.id, () => {
+      this.initOption()
+    })
   },
   methods: {
     initOption() {
@@ -89,7 +94,7 @@ export default {
 </script>
 
 <style>
-  .info-stream-class{
+  .info-stream-class {
     text-align: center;
     height: 100%;
     display: flex;
@@ -99,16 +104,19 @@ export default {
     font-size: 12px;
     color: #000000;
   }
+
   .move-bg {
     height: 100%;
     width: 100%;
     background-color: #000000;
   }
+
   .video-container {
     width: 100%;
     height: 100%;
     background-color: #000000;
   }
+
   .centered-video {
     width: 100%;
     height: 100%;
@@ -116,5 +124,20 @@ export default {
     margin-right: auto;
     margin-bottom: auto;
   }
+
+  .stream-mask {
+    display: flex;
+    height: calc(100% - 60px) !important;
+    width: 100% !important;
+    background-color: #5c5e61;
+    opacity: 0;
+    position: absolute;
+    top: 0px;
+    left: 0px;
+    z-index: 2;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
 </style>
 

frontend/src/utils/urlUtils.js

+export function checkAddHttp(url) {
+  if (!url) {
+    return url
+  } else if (/^(http(s)?:\/\/)/.test(url.toLowerCase())) {
+    return url
+  } else {
+    return 'http://' + url
+  }
+}

frontend/src/views/panel/LinkJumpSet/index.vue

@@ -52,9 +52,9 @@
                   :disable-branch-nodes="true"
                   :normalizer="normalizer"
                   :placeholder="$t('panel.select_jump_panel')"
-                  :noChildrenText="$t('commons.treeselect.no_children_text')"
-                  :noOptionsText="$t('commons.treeselect.no_options_text')"
-                  :noResultsText="$t('commons.treeselect.no_results_text')"
+                  :no-children-text="$t('commons.treeselect.no_children_text')"
+                  :no-options-text="$t('commons.treeselect.no_options_text')"
+                  :no-results-text="$t('commons.treeselect.no_results_text')"
                   style="margin-right: 10px"
                   @select="panelNodeClick"
                   @input="inputVal"
@@ -166,6 +166,7 @@ import { groupTree } from '@/api/panel/panel'
 import { detailList } from '@/api/panel/panelView'
 import { mapState } from 'vuex'
 import { deepCopy } from '@/components/canvas/utils/utils'
+import { checkAddHttp } from '@/utils/urlUtils'
 
 export default {
   components: { },
@@ -271,6 +272,7 @@ export default {
       this.$emit('closeJumpSetDialog')
     },
     save() {
+      this.linkJumpInfo.content = checkAddHttp(this.linkJumpInfo.content)
       updateJumpSet(this.linkJump).then(rsp => {
         this.$message({
           message: '保存成功',

frontend/src/views/system/datasource/form.vue

@@ -539,8 +539,13 @@ export default {
               return
             }
             let configuration = JSON.parse(child.configuration)
+            if(!configuration){
+              return
+            }
             switch (this.form.type) {
               case 'mysql':
+              case 'TiDB':
+              case 'StarRocks':
               case 'hive':
               case 'mariadb':
               case 'ds_doris':