添加多媒体控制组件，添加轮询设置界面

src/common/ClientConnection.ts

@@ -2,6 +2,7 @@ import ReconnectingWebSocket from "reconnecting-websocket";
 import NormalWindowRequestEntity from "src/entities/NormalWindowRequestEntity";
 import { PlanEntity } from "src/entities/PlanEntity";
 import { SignalSourceEntity } from "src/entities/SignalSourceEntity";
+import { StringKeyValueEntity } from "src/entities/StringKeyValueEntity";
 import SubtitleEntity from "src/entities/SubtitleEntity";
 import { Protocol } from "src/entities/WSProtocol";
 import EventBus, { EventNamesDefine } from "./EventBus";
@@ -605,6 +606,7 @@ export default class ClientConnection {
       console.error(e);
     }
   }
+
   public async setOutputBoardSetting(
     request: Protocol.SetOutputBoardSettingRequestEntity
   ) {
@@ -616,6 +618,7 @@ export default class ClientConnection {
       console.error(e);
     }
   }
+
   public async restoreOutputBoard() {
     try {
       return await this.doRpc<Protocol.RestoreOutputBoardResponseEntity>(
@@ -669,6 +672,27 @@ export default class ClientConnection {
     );
   }
 
+  public async startPolling(window_id: number) {
+    this.ws?.send(
+      JSON.stringify(new Protocol.StartPollingRequestEntity(window_id))
+    );
+  }
+
+  public async stopPolling(window_id: number) {
+    this.ws?.send(
+      JSON.stringify(new Protocol.StopPollingRequestEntity(window_id))
+    );
+  }
+
+  public async setPollingData(
+    window_id: number,
+    datas?: StringKeyValueEntity[]
+  ) {
+    return await this.doRpc<Protocol.SetPollingDataResponseEntity>(
+      new Protocol.SetPollingDataRequestEntity(window_id, datas)
+    );
+  }
+
   public async getBuildInfo() {
     return await this.doRpc<Protocol.GetBuildInfoResponseEntity>(
       new Protocol.GetBuildInfoRequestEntity(0)

src/common/RemoteDataExangeProcesser.ts

@@ -8,8 +8,17 @@ export default class RemoteDataExangeProcesser {
   private flag = false;
   private options: OptionsType;
 
+  private plan_notify: any = null;
+
   constructor(options: OptionsType) {
     this.options = options;
+
+    EventBus.getInstance().on(EventNamesDefine.WebSocketClose, () => {
+      if (this.plan_notify) {
+        this.plan_notify(void 0);
+        this.plan_notify = null;
+      }
+    });
   }
 
   enable() {
@@ -71,18 +80,30 @@ export default class RemoteDataExangeProcesser {
               notify.data
             ) as Protocol.PlanRunningStateChangeNotifyEntity;
             if (temp && temp.plan) {
-              $q.notify({
+              if (temp.running) {
+                if (this.plan_notify) {
+                  this.plan_notify(void 0);
+                  this.plan_notify = null;
+                }
+                this.plan_notify = $q.notify({
+                  position: "center",
                   color: "positive",
-                icon: "done",
+                  timeout: 0, // we want to be in control when it gets dismissed
+                  spinner: true,
                   message:
                     $t.t("plan") +
-                  " '" +
+                    ":  " +
                     temp.plan.name +
-                  "  '" +
+                    "  " +
-                  (temp.running ? $t.t("is running") : $t.t("is stopping")),
+                    $t.t("running now") +
-                position: "top",
+                    "!",
-                timeout: 2000,
                 });
+              } else {
+                if (this.plan_notify) {
+                  this.plan_notify(void 0);
+                  this.plan_notify = null;
+                }
+              }
             }
           }
           break;

src/components/PlaylistDialog.vue

@@ -171,7 +171,6 @@ export default defineComponent({
             }
           } catch {}*/
 
-            console.log(prefix);
             let temp_str = decodeURI(new URL(item).pathname).replace(
               /\\/g,
               "/"

src/components/PollingSettingDialog.vue

@@ -0,0 +1,304 @@
+<template>
+  <q-dialog persistent v-model="show_dialog" @before-hide="resetData">
+    <q-card class="overflow-hidden" style="overflow-y: scroll; max-width: 50vw">
+      <q-form @submit="onSubmit">
+        <q-card-section class="q-ma-none q-pa-sm">
+          <div class="row">
+            <div class="col-auto text-h6">
+              {{ $t("polling setting") }}
+            </div>
+            <q-space />
+            <div>
+              <q-btn
+                :loading="loading"
+                flat
+                round
+                icon="close"
+                color="red"
+                v-close-popup
+              >
+                <q-tooltip>
+                  {{ $t("close") }}
+                </q-tooltip>
+              </q-btn>
+            </div>
+          </div>
+        </q-card-section>
+
+        <q-separator />
+
+        <q-card-section style="max-height: 70vh; width: 50vw" class="scroll">
+          <q-list>
+            <q-item>
+              <q-item-section>
+                <q-table
+                  style="height: 50vh"
+                  :rows="datas"
+                  :columns="columns"
+                  virtual-scroll
+                  :title="$t('polling data') + ':'"
+                  hide-bottom
+                  color="primary"
+                  row-key="name"
+                  :loading="loading"
+                  :rows-per-page-options="[0]"
+                  :virtual-scroll-sticky-size-start="48"
+                  @row-contextmenu="onContextMenu"
+                >
+                  <template v-slot:loading>
+                    <q-inner-loading showing color="primary" />
+                  </template>
+                  <template v-slot:body-cell="props">
+                    <q-td :props="props">
+                      <div v-if="props.col.name == 'value'">
+                        <div v-if="props.pageIndex % 2">
+                          {{ props.value }}{{ $t("s") }}
+                          <q-popup-edit v-model="props.row.value">
+                            <q-input
+                              type="number"
+                              v-model="props.row.value"
+                              :min="min_delay"
+                              dense
+                              autofocus
+                            >
+                              <template v-slot:append>
+                                <span>{{ $t("s") }}</span>
+                              </template>
+                            </q-input>
+                          </q-popup-edit>
+                        </div>
+                        <div v-else>
+                          <q-popup-edit v-model="props.row.value">
+                            <q-select
+                              :options="signals"
+                              option-label="name"
+                              option-value="uuid"
+                              emit-value
+                              map-options
+                              v-model="props.row.value"
+                            >
+                            </q-select>
+                          </q-popup-edit>
+                          {{
+                            signals.find(
+                              (element) =>
+                                element && element.uuid == props.row.value
+                            )?.name ?? ""
+                          }}
+                        </div>
+                      </div>
+                      <div v-else>
+                        {{ $t(props.value) }}
+                      </div>
+                    </q-td>
+                  </template>
+                </q-table>
+              </q-item-section>
+            </q-item>
+          </q-list>
+        </q-card-section>
+        <q-separator />
+
+        <q-card-actions align="left">
+          <q-btn
+            :loading="loading"
+            flat
+            :label="$t('add row')"
+            color="primary"
+            @click="addRow"
+          />
+          <q-space />
+          <q-btn
+            :loading="loading"
+            flat
+            :label="$t('Cancel')"
+            color="primary"
+            v-close-popup
+          />
+          <q-btn
+            ref="accept"
+            flat
+            :label="$t('Accept')"
+            :loading="loading"
+            type="submit"
+            color="primary"
+          />
+        </q-card-actions>
+      </q-form>
+    </q-card>
+  </q-dialog>
+  <div>
+    <q-menu :target="target_dom" v-model="show_context_menu">
+      <q-list>
+        <q-item clickable v-close-popup @click="(evt) => deleteRow()">
+          <q-item-section avatar
+            ><q-icon name="delete" color="red"
+          /></q-item-section>
+          <q-item-section>{{ $t("delete row") }}</q-item-section>
+        </q-item>
+        <q-item clickable v-close-popup @click="(evt) => addRow()">
+          <q-item-section avatar><q-icon name="add" /></q-item-section>
+          <q-item-section>{{ $t("add row") }}</q-item-section>
+        </q-item>
+      </q-list>
+    </q-menu>
+  </div>
+</template>
+
+<style scoped>
+.disable_tree {
+  background: #9e9e9e;
+  cursor: wait;
+  pointer-events: none;
+}
+
+.width_5_1 {
+  width: 18%;
+}
+</style>
+
+<script lang="ts">
+import { defineComponent, ref, Ref, watch, computed } from "vue";
+import { useStore } from "src/store";
+import GlobalData from "src/common/GlobalData";
+import { useQuasar } from "quasar";
+import { useI18n } from "vue-i18n";
+import { StringKeyValueEntity } from "src/entities/StringKeyValueEntity";
+import { PlanEntity } from "src/entities/PlanEntity";
+import { resolve } from "dns";
+
+const __MIN_DELAY = 10;
+
+export default defineComponent({
+  name: "ComponentPollingSettingDialog",
+
+  setup() {
+    let $store = useStore();
+    let $q = useQuasar();
+    let $t = useI18n();
+
+    const min_delay = ref(__MIN_DELAY);
+    let show_dialog = ref(false);
+
+    let loading = ref(false);
+    let datas: Ref<StringKeyValueEntity[]> = ref([]);
+    let signals = ref(GlobalData.getInstance().signal_source);
+
+    const columns = [
+      {
+        align: "left",
+        name: "key",
+        required: true,
+        label: $t.t("operator"),
+        field: "key",
+        sortable: false,
+      },
+      {
+        align: "left",
+        name: "value",
+        label: $t.t("operator value"),
+        field: "value",
+        sortable: false,
+      },
+    ];
+
+    let show_context_menu = ref(false);
+    let target_dom: any = ref(document.body.children[0]);
+    let current_index = 0;
+
+    let _resolve: any = null;
+
+    return {
+      show_dialog,
+      min_delay,
+      loading,
+      datas,
+      columns,
+      show_context_menu,
+      target_dom,
+      signals,
+      loga(a: any) {
+        console.log(a);
+      },
+      showDialog(options: StringKeyValueEntity[] | null) {
+        show_dialog.value = true;
+        if (options) {
+          datas.value = [];
+          for (const item of options) {
+            datas.value.push(item);
+          }
+        }
+      },
+      showDialogAsync(options: StringKeyValueEntity[] | null) {
+        return new Promise((resolve) => {
+          if (_resolve) {
+            _resolve();
+            _resolve = null;
+          }
+          _resolve = resolve;
+          show_dialog.value = true;
+          if (options) {
+            datas.value = [];
+            for (const item of options) {
+              datas.value.push(item);
+            }
+            signals.value = GlobalData.getInstance().signal_source;
+          }
+        });
+      },
+      resetData() {
+        loading.value = false;
+        if (_resolve) {
+          _resolve();
+          _resolve = null;
+        }
+      },
+      addRow() {
+        datas.value.push({
+          key: "operator_signal_source",
+          value: GlobalData.getInstance().signal_source[0].uuid,
+        });
+
+        datas.value.push({
+          key: "param_delay",
+          value: __MIN_DELAY.toString(),
+        });
+        signals.value = GlobalData.getInstance().signal_source;
+      },
+      onContextMenu(
+        evt: PointerEvent,
+        row: StringKeyValueEntity,
+        index: number
+      ) {
+        evt.preventDefault();
+        evt.stopPropagation();
+
+        target_dom.value = evt.srcElement;
+        if (row) {
+          current_index = index;
+          show_context_menu.value = true;
+        }
+      },
+      deleteRow() {
+        if (datas.value.length > current_index) {
+          const start = Math.floor(current_index / 2);
+          if (!isNaN(start)) {
+            datas.value.splice(start, 2);
+          }
+        }
+      },
+      async onSubmit() {
+        loading.value = true;
+        try {
+          if (_resolve) {
+            _resolve(datas.value);
+            _resolve = null;
+          }
+          show_dialog.value = false;
+        } catch {}
+        loading.value = false;
+      },
+    };
+  },
+});
+</script>

src/components/Window.vue

@@ -60,16 +60,75 @@
         >
           <q-item-section> {{ $t("close all windwos") }} </q-item-section>
         </q-item>
+        <q-item
+          clickable
+          v-close-popup
+          :disable="$props.disable"
+          @click="$emit('start_polling', $props.window.window_id)"
+          v-if="!$props.window.polling"
+        >
+          <q-item-section> {{ $t("start polling") }} </q-item-section>
+        </q-item>
+        <q-item
+          clickable
+          v-close-popup
+          :disable="$props.disable"
+          @click="$emit('stop_polling', $props.window.window_id)"
+          v-else
+        >
+          <q-item-section>
+            {{ $t("stop polling") }}
+          </q-item-section>
+        </q-item>
+        <q-item
+          clickable
+          v-close-popup
+          :disable="$props.disable || $props.window.polling"
+          @click="$emit('polling_setting', $props.window.window_id)"
+        >
+          <q-item-section> {{ $t("polling setting") }} </q-item-section>
+        </q-item>
       </q-list>
     </q-popup-proxy>
     <div class="row title_bar full-width">
-      <q-icon :name="getItemIcon(signal_source.window_type)" class="q-mr-xs" />
-      <span>{{ signal_source.name }}</span>
-      <q-space />
       <q-icon
-        v-if="is_audo_player_window"
+        size="1.5em"
+        :name="
+          getItemIcon(
+            $props.window.polling
+              ? $props.window.polling_window_type
+              : signal_source.window_type
+          )
+        "
+        class="q-mr-xs"
+      />
+      <span v-if="$props.window.polling">{{
+        $props.window.polling_title
+      }}</span>
+      <span v-else>{{ signal_source.name }}</span>
+      <q-space />
+      <div>
+        <q-spinner-box
+          v-if="$props.window.polling"
+          color="primary"
+          size="1.5em"
+        />
+        <q-tooltip>{{ $t("polling now") }}</q-tooltip>
+      </div>
+      <div>
+        <q-icon
+          v-if="
+            $props.window.polling
+              ? calc_is_audio_player_window($props.window.polling_window_type)
+              : is_audo_player_window
+          "
+          size="1.5em"
           :name="$props.window.muted ? 'volume_off' : 'volume_up'"
         />
+        <q-tooltip>{{
+          $t($props.window.muted ? "muted now" : "unmuted now")
+        }}</q-tooltip>
+      </div>
     </div>
 
     <div
@@ -303,6 +362,9 @@ export default defineComponent({
     "window_fouse_in",
     "edit_volume",
     "mute_unmute",
+    "stop_polling",
+    "start_polling",
+    "polling_setting",
   ],
   setup(props, { emit }) {
     const $store = useStore();
@@ -316,10 +378,15 @@ export default defineComponent({
       );
     };
 
-    const is_audo_player_window = computed(
+    const calc_is_audio_player_window = (window_type: string) => {
-      () =>
+      return (
-        signal_source.value.window_type == "EwindowType::Multimedia" ||
+        window_type == "EwindowType::Multimedia" ||
-        signal_source.value.window_type == "EwindowType::HdmiIn"
+        window_type == "EwindowType::Rtsp" ||
+        window_type == "EwindowType::HdmiIn"
+      );
+    };
+    const is_audo_player_window = computed(() =>
+      calc_is_audio_player_window(signal_source.value.window_type)
     );
 
     reload_signal_source();
@@ -395,6 +462,7 @@ export default defineComponent({
       flags,
       is_audo_player_window,
 
+      calc_is_audio_player_window,
       onClick(evt: PointerEvent) {
         if (selected.value != true) {
           EventBus.getInstance().emit(EventNamesDefine.UnSelectAllWindows);

src/entities/MultimediaWindowEntity.ts

@@ -1,5 +1,6 @@
 import BaseEntity from "./BaseEntity";
 import { SignalSourceEntity } from "./SignalSourceEntity";
+import { StringKeyValueEntity } from "./StringKeyValueEntity";
 import { Protocol } from "./WSProtocol";
 
 export class MultimediaWindowEntity extends BaseEntity {
@@ -13,6 +14,8 @@ export class MultimediaWindowEntity extends BaseEntity {
   muted: boolean = false;
   playing: boolean = false;
   play_speed: number = 1;
+  polling: boolean = false;
+  polling_signal_sources: StringKeyValueEntity[] = [];
 }
 
 export class WindowOpenNotifyEntity extends MultimediaWindowEntity {
@@ -36,4 +39,9 @@ export class WindowOpenNotifyEntity extends MultimediaWindowEntity {
   command = Protocol.Commands.kUnKnowCommand;
 
   window_id: number = 0;
+
+  /** 轮询时的属性,不轮询时无效 */
+  polling_title: string = "";
+  /** 轮询时的属性,不轮询时无效 */
+  polling_window_type: string = "EWindowType::Normal";
 }

src/entities/WSProtocol.ts

@@ -1,3 +1,4 @@
+import { StringKeyValueEntity } from "./StringKeyValueEntity";
 import { SignalSourceEntity } from "./SignalSourceEntity";
 import ApplicationConfigEntity from "./ApplicationConfigEntity";
 import { ModeEntity } from "./ModeEntity";
@@ -256,6 +257,19 @@ export namespace Protocol {
       return Commands.PROTOCOL_PREFIX + "PlayPrev";
     }
 
+    public static get kStartPolling() {
+      return Commands.PROTOCOL_PREFIX + "StartPolling";
+    }
+    public static get kStopPolling() {
+      return Commands.PROTOCOL_PREFIX + "StopPolling";
+    }
+    public static get kRpcSetPollingData() {
+      return Commands.PROTOCOL_PREFIX + "RpcSetPollingData";
+    }
+    public static get kPollingStateChanged() {
+      return Commands.PROTOCOL_PREFIX + "PollingStateChanged";
+    }
+
     static _all_commands = new Set([
       Commands.kUnKnowCommand,
       Commands.kSearchDevice,
@@ -315,6 +329,11 @@ export namespace Protocol {
       Commands.kWindowPlayNext,
       Commands.kPauseWindow,
       Commands.kPlayWindow,
+      Commands.kPollingStateChanged,
+      Commands.kRpcSetPollingData,
+      Commands.kStopPolling,
+      Commands.kStartPolling,
+      Commands.kPollingStateChanged,
     ]);
 
     public static get AllCommands() {
@@ -512,7 +531,7 @@ export namespace Protocol {
     width: number = 0;
     height: number = 0;
     volume: number = 80;
-    muted: boolean = false;
+    muted: boolean = true;
     paused: boolean = false;
     play_speed: number = 1;
 
@@ -1490,4 +1509,67 @@ export namespace Protocol {
       this.command = Commands.kFanTemperature;
     }
   }
+
+  export class SetPollingDataRequestEntity extends Protocol.PacketEntity {
+    datas: StringKeyValueEntity[] = [];
+    window_id: number = 0;
+    constructor(
+      window_id: number,
+      datas?: StringKeyValueEntity[],
+      rcp_id?: number
+    ) {
+      super();
+      this.rpc_id = rcp_id ?? 0;
+      this.command = Protocol.Commands.kRpcSetPollingData;
+      if (Array.isArray(datas)) {
+        if (datas.length % 2) {
+          datas.splice(datas.length - 1, 1);
+        }
+        this.datas = datas;
+      }
+      this.window_id = window_id;
+    }
+  }
+
+  export class SetPollingDataResponseEntity extends Protocol.PacketEntity {
+    success = false;
+
+    constructor() {
+      super();
+      this.command = Protocol.Commands.kRpcSetPollingData;
+    }
+  }
+
+  export class StartPollingRequestEntity extends PacketEntity {
+    window_id: number;
+
+    constructor(window_id: number) {
+      super();
+      this.rpc_id = 0;
+      this.command = Commands.kStartPolling;
+      this.window_id = window_id;
+    }
+  }
+
+  export class StopPollingRequestEntity extends PacketEntity {
+    window_id: number;
+
+    constructor(window_id: number) {
+      super();
+      this.rpc_id = 0;
+      this.command = Commands.kStopPolling;
+      this.window_id = window_id;
+    }
+  }
+
+  export class PollingStateChangeNotifyEntity extends PacketEntity {
+    window_id: number = 0;
+    polling: boolean = false;
+    window_type: string = "EwindowType::Normal";
+    title: string = "";
+    constructor() {
+      super();
+      this.command = Commands.kPollingStateChanged;
+    }
+  }
 }

src/entities/WindowOtherStateChangeNotifyEntity.ts

@@ -6,4 +6,7 @@ export default class WindowOtherStateChangeNotifyEntity extends Protocol.PacketE
   focus = false;
   muted = false;
   volume = 80;
+  polling = false;
+  title = "";
+  window_type = "EWindowType::Normal";
 }

src/i18n/zh-CN/index.ts

@@ -135,7 +135,6 @@ export default {
   pwa: "PWA版",
   "add plan item": "添加预案",
   "run plan directives send": "执行预案发送",
-  "is running": "正在运行",
   "is stopping": "已经停止",
   "add plan": "添加预案",
   "edit plan": "修改预案",
@@ -292,4 +291,21 @@ export default {
   "play list": "播放列表",
   "close and save": "保存修改并关闭",
   "close and reset": "放弃修改并关闭",
+  operator_signal_source: "信号源",
+  "play prev": "上一曲",
+  "play next": "上一曲",
+  play: "播放",
+  pause: "暂停",
+  "volume up": "音量加",
+  "volume down": "音量减",
+  "start polling": "开启轮询",
+  "stop polling": "停止轮询",
+  "polling setting": "轮询设置",
+  "polling data": "轮询数据",
+  "set polling data": "设置轮询数据",
+  "please stop polling first": "请先停止轮询",
+  "muted now": "现在静音",
+  "unmuted now": "现在没有静音",
+  "polling now": "正在轮询窗口",
+  "running now": "正在运行",
 };

src/layouts/MainLayout.vue

@@ -47,12 +47,8 @@
                 }
               }
             "
-            @click="(evt) => evt.stopPropagation()"
           >
-            <right-tool-bar
+            <right-tool-bar v-if="show_right_tool_bar" />
-              v-if="show_right_tool_bar"
-              @click="(evt) => evt.stopPropagation()"
-            />
           </div>
         </div>
       </q-page-container>

src/pages/MediaControlPage.vue

@@ -13,7 +13,16 @@
   >
     <div class="row q-ma-sm">
       <div class="col-1 q-mx-md">
-        <q-btn round flag size="lg" icon="arrow_back" @click="playPrev"></q-btn>
+        <q-btn
+          round
+          flag
+          size="lg"
+          icon="arrow_back"
+          :disable="!can_next_prev_window || plan_running"
+          @click="playPrev"
+        >
+          <q-tooltip> {{ $t("play prev") }}</q-tooltip>
+        </q-btn>
       </div>
       <div class="col-1 q-mx-md">
         <q-btn
@@ -21,23 +30,47 @@
           flag
           size="lg"
           v-if="!selected_window?.playing"
+          :disable="!can_pause_window || plan_running"
           icon="play_arrow"
           @click="play"
-        ></q-btn>
+        >
-        <q-btn v-else round flag size="lg" icon="pause" @click="pause"></q-btn>
+          <q-tooltip> {{ $t("play") }}</q-tooltip></q-btn
+        >
+        <q-btn
+          :disable="!can_pause_window || plan_running"
+          v-else
+          round
+          flag
+          size="lg"
+          icon="pause"
+          @click="pause"
+        >
+          <q-tooltip> {{ $t("pause") }}</q-tooltip></q-btn
+        >
       </div>
       <div class="col-1 q-mx-md">
         <q-btn
           round
           flag
           size="lg"
+          :disable="!can_next_prev_window || plan_running"
           icon="arrow_forward"
           @click="playNext"
-        ></q-btn>
+        >
+          <q-tooltip> {{ $t("play next") }}</q-tooltip></q-btn
+        >
       </div>
       <q-space />
       <div class="col-1 q-mx-md">
-        <q-btn round flag size="lg" icon="volume_down" @click="volumeDown">
+        <q-btn
+          :disable="plan_running"
+          round
+          flag
+          size="lg"
+          icon="volume_down"
+          @click="volumeDown"
+        >
+          <q-tooltip> {{ $t("volume down") }}</q-tooltip>
         </q-btn>
       </div>
       <div class="col-1 q-mx-md">
@@ -46,20 +79,33 @@
           flag
           size="lg"
           v-if="selected_window?.muted"
-          icon="volume_off"
+          :disable="plan_running"
+          icon="volume_mute"
           @click="unmuteWindow"
-        ></q-btn>
+          ><q-tooltip> {{ $t("unmute") }}</q-tooltip></q-btn
+        >
         <q-btn
           v-else
+          :disable="plan_running"
           round
           flag
           size="lg"
-          icon="volume_mute"
+          icon="volume_off"
           @click="muteWindow"
-        ></q-btn>
+          ><q-tooltip> {{ $t("mute") }}</q-tooltip></q-btn
+        >
       </div>
       <div class="col-1 q-mx-md">
-        <q-btn round flag size="lg" icon="volume_up" @click="volumeUp"></q-btn>
+        <q-btn
+          :disable="plan_running"
+          round
+          flag
+          size="lg"
+          icon="volume_up"
+          @click="volumeUp"
+        >
+          <q-tooltip> {{ $t("volume up") }}</q-tooltip>
+        </q-btn>
       </div>
     </div>
   </div>
@@ -96,6 +142,31 @@ export default defineComponent({
     let selected_window: Ref<WindowOpenNotifyEntity | null> = ref(null);
     let is_multimedia_window = ref(false);
 
+    let can_pause_window = ref(false);
+    let can_next_prev_window = ref(false);
+
+    let plan_running = ref(false);
+
+    EventBus.getInstance().on(
+      EventNamesDefine.NotifyMessage,
+      (notify: NotifyMessage) => {
+        if (notify) {
+          switch (notify.packet.command) {
+            case Protocol.Commands.kCurrentRunningPlanStateChanged:
+              {
+                const temp = JSON.parse(
+                  notify.data
+                ) as Protocol.PlanRunningStateChangeNotifyEntity;
+                if (temp && temp.plan) {
+                  plan_running.value = temp.running;
+                }
+              }
+              break;
+          }
+        }
+      }
+    );
+
     watch(
       () => $store.state.selected_window,
       (newValue, oldValue) => {
@@ -109,9 +180,16 @@ export default defineComponent({
               element && element.uuid == window.signal_source_table_uuid
           );
           if (signal_source) {
+            const type = window.polling
+              ? window.polling_window_type
+              : signal_source.window_type;
             is_multimedia_window.value =
-              signal_source.window_type == "EwindowType::Multimedia" ||
+              type == "EwindowType::Multimedia" || type == "EwindowType::Rtsp";
-              signal_source.window_type == "EwindowType::RTSP";
+
+            can_pause_window.value = type == "EwindowType::Multimedia";
+            console.log(type);
+            can_next_prev_window.value = type == "EwindowType::Multimedia";
+            console.log(can_next_prev_window.value);
           }
         } else {
           selected_window.value = null;
@@ -123,6 +201,9 @@ export default defineComponent({
     return {
       selected_window,
       is_multimedia_window,
+      can_pause_window,
+      can_next_prev_window,
+      plan_running,
 
       volumeUp(evt: MouseEvent) {
         evt.stopPropagation();

src/pages/RightToolBar.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div @click="(evt) => evt.stopPropagation()">
     <q-tabs
       v-model="tab_value"
       dense

src/pages/WallPage.vue

@@ -19,6 +19,9 @@
         @dblclick="(evt) => windowDBClick(item.window_id)"
         @edit_volume="edit_volume"
         @mute_unmute="mute_unmute"
+        @start_polling="start_polling"
+        @stop_polling="stop_polling"
+        @polling_setting="polling_setting"
         :ref="'window_' + item.window_id"
         :id="'window_' + item.window_id"
         v-for="(item, index) in windows"
@@ -86,6 +89,7 @@
     </div>
   </div>
   <edit-volume-dialog ref="edit_volume_dialog" />
+  <polling-setting-dialog ref="polling_setting_dialog" />
 </template>
 
 <style scoped>
@@ -121,17 +125,19 @@ import { useQuasar } from "quasar";
 import { NotifyMessage } from "src/common/ClientConnection";
 
 import EditVolumeDialog from "src/components/EditVolumeDialog.vue";
+import PollingSettingDialog from "src/components/PollingSettingDialog.vue";
 
 export default defineComponent({
   name: "PageWall",
 
-  components: { Window, EditVolumeDialog },
+  components: { Window, EditVolumeDialog, PollingSettingDialog },
   setup() {
     const $q = useQuasar();
     const $store = useStore();
     const $t = useI18n();
 
     const edit_volume_dialog: Ref<any> = ref(null);
+    const polling_setting_dialog: Ref<any> = ref(null);
 
     const plan_running = ref(false);
 
@@ -315,6 +321,26 @@ export default defineComponent({
                         property_name: "volume",
                         value: temp.volume,
                       },
+                      {
+                        window,
+                        property_name: "volume",
+                        value: temp.volume,
+                      },
+                      {
+                        window,
+                        property_name: "polling",
+                        value: temp.polling,
+                      },
+                      {
+                        window,
+                        property_name: "polling_title",
+                        value: temp.title,
+                      },
+                      {
+                        window,
+                        property_name: "polling_window_type",
+                        value: temp.window_type,
+                      },
                     ]);
                   }
                 }
@@ -360,6 +386,7 @@ export default defineComponent({
       wall_height_scaler,
       plan_running,
       edit_volume_dialog,
+      polling_setting_dialog,
       onDrop(e: DragEvent) {
         e.preventDefault();
         let target = e.target as any;
@@ -379,6 +406,7 @@ export default defineComponent({
               let dom: HTMLElement | null = e.target as HTMLElement;
               if (wall.value && dom) {
                 if (dom.classList.contains("wall_item_flag")) {
+                  // 开窗
                   GlobalData.getInstance()
                     .getCurrentClient()
                     ?.openWindow(
@@ -395,6 +423,7 @@ export default defineComponent({
                       )
                     );
                 } else if (dom.classList.contains("window_flag")) {
+                  // 替换窗口
                   let uuid = dom.getAttribute("uuid");
                   if (uuid) {
                     let window = $store.state.windows.find(
@@ -570,6 +599,70 @@ export default defineComponent({
           }
         }
       },
+      start_polling(window_id: number) {
+        const window = windows.value.find(
+          (element) => element && element.window_id == window_id
+        );
+        if (window) {
+          GlobalData.getInstance().getCurrentClient()?.startPolling(window_id);
+        }
+      },
+      stop_polling(window_id: number) {
+        const window = windows.value.find(
+          (element) => element && element.window_id == window_id
+        );
+        if (window) {
+          GlobalData.getInstance().getCurrentClient()?.stopPolling(window_id);
+        }
+      },
+      async polling_setting(window_id: number) {
+        const window = windows.value.find(
+          (element) => element && element.window_id == window_id
+        );
+        if (window) {
+          if (window.polling) {
+            $q.notify({
+              color: "positive",
+              icon: "done",
+              message: $t.t("please stop polling first") + "!",
+              position: "top",
+              timeout: 1500,
+            });
+            return;
+          }
+          const datas = await polling_setting_dialog.value.showDialogAsync(
+            window.polling_signal_sources
+          );
+          if (datas) {
+            try {
+              const resposne = await GlobalData.getInstance()
+                .getCurrentClient()
+                ?.setPollingData(window_id, datas);
+              if (resposne) {
+                if (resposne.success) {
+                  $q.notify({
+                    color: "positive",
+                    icon: "done",
+                    message: $t.t("set polling data") + $t.t("success") + "!",
+                    position: "top",
+                    timeout: 1500,
+                  });
+                } else {
+                  $q.notify({
+                    color: "negative",
+                    icon: "warning",
+                    message: $t.t("set polling data") + $t.t("failed") + "!",
+                    position: "top",
+                    timeout: 1500,
+                  });
+                }
+              }
+            } catch (e) {
+              console.log(e);
+            }
+          }
+        }
+      },
     };
   },
 });