From 6b7ff8e58ca8b3274da591d63081272862c48fa5 Mon Sep 17 00:00:00 2001
From: aixianling <aixianling@sinoecare.com>
Date: Wed, 11 Oct 2023 18:21:40 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E8=87=AA=E9=80=82=E5=BA=94?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/layout/AiDvWrapper/AiDvWrapper.vue |   9 +-
 project/fengdu/AppBIBoard/AppBIBoard.vue      |  51 +++++
 .../AppBIBoard/assets/fullscreenIcon.png      | Bin 0 -> 592 bytes
 .../fengdu/AppBIBoard/assets/settingIcon.png  | Bin 0 -> 666 bytes
 project/fengdu/AppBIBoard/assets/timeIcon.png | Bin 0 -> 1316 bytes
 .../AppBIBoard/components/fengduHead.vue      | 180 ++++++++++++++++++
 ui/packages/layout/AiFitView.vue              |   1 +
 7 files changed, 238 insertions(+), 3 deletions(-)
 create mode 100644 project/fengdu/AppBIBoard/AppBIBoard.vue
 create mode 100644 project/fengdu/AppBIBoard/assets/fullscreenIcon.png
 create mode 100644 project/fengdu/AppBIBoard/assets/settingIcon.png
 create mode 100644 project/fengdu/AppBIBoard/assets/timeIcon.png
 create mode 100644 project/fengdu/AppBIBoard/components/fengduHead.vue

diff --git a/components/layout/AiDvWrapper/AiDvWrapper.vue b/components/layout/AiDvWrapper/AiDvWrapper.vue
index 575a4150..72534a26 100644
--- a/components/layout/AiDvWrapper/AiDvWrapper.vue
+++ b/components/layout/AiDvWrapper/AiDvWrapper.vue
@@ -2,7 +2,9 @@
   <section class="AiDvWrapper" :class="'AiDvWrapper' + theme">
     <dv-full-screen-container>
       <div class="viewPanel column" flex :style="{backgroundImage:`url('${background}')`}">
-        <component :is="headerComponent" v-bind="{...$props,...$data}" v-model="active" @fullscreen="handleFullScreen" @setting="e=>dialog=e"
+        <slot v-if="$scopedSlots.head" name="head" v-bind="{...$props,...$data}"/>
+        <component v-else :is="headerComponent" v-bind="{...$props,...$data}" v-model="active"
+                   @fullscreen="handleFullScreen" @setting="e=>dialog=e"
                    @change="e=>$emit('change',e)"/>
         <div class="fill">
           <slot/>
@@ -43,7 +45,7 @@ export default {
     },
     value: {default: ''},
     /**
-     * 布局方案:black,classic
+     * 布局方案:black,classic,fengdu
      */
     type: {default: "black"},
     background: {default: ""}
@@ -59,7 +61,7 @@ export default {
     },
     headerComponent: v => ({
       classic: Classic,
-      black: Primary
+      black: Primary,
     }[v.type])
   },
   watch: {
@@ -92,6 +94,7 @@ export default {
             el.mozCancelFullScreen || el.exitFullScreen;
         cfs.call(el)
       }
+      return this.fullscreen
     },
     handleSetting() {
       if (this.setting.timer) clearInterval(this.setting.timer)
diff --git a/project/fengdu/AppBIBoard/AppBIBoard.vue b/project/fengdu/AppBIBoard/AppBIBoard.vue
new file mode 100644
index 00000000..42814bc0
--- /dev/null
+++ b/project/fengdu/AppBIBoard/AppBIBoard.vue
@@ -0,0 +1,51 @@
+<template>
+  <section class="AppBIBoard" :class="{fullscreen}">
+    <ai-fit-view>
+      <ai-dv-wrapper ref="fddv">
+        <template v-slot:head="head">
+          <fengdu-head v-bind="head" @fullscreen="handleFullScreen" @setting="handleSetting"/>
+        </template>
+        <ai-dv-viewer v-bind="$props"/>
+      </ai-dv-wrapper>
+    </ai-fit-view>
+  </section>
+</template>
+<script>
+import AiFitView from "dui/packages/layout/AiFitView.vue";
+import FengduHead from "./components/fengduHead.vue";
+
+export default {
+  name: "AppBIBoard",
+  label: "丰都指挥舱",
+  components: {FengduHead, AiFitView},
+  props: {
+    instance: Function,
+    dict: Object
+  },
+  data() {
+    return {
+      fullscreen: false
+    }
+  },
+  methods: {
+    handleFullScreen() {
+      this.fullscreen = this.$refs.fddv.handleFullScreen()
+    },
+    handleSetting(v) {
+      this.$refs.fddv.dialog = v
+    }
+  },
+}
+</script>
+<style scoped lang="scss">
+.AppBIBoard {
+  &.fullscreen {
+    position: fixed;
+    z-index: 202310111819;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    right: 0;
+  }
+}
+</style>
diff --git a/project/fengdu/AppBIBoard/assets/fullscreenIcon.png b/project/fengdu/AppBIBoard/assets/fullscreenIcon.png
new file mode 100644
index 0000000000000000000000000000000000000000..c53081d46234019e2890cd8e60a6278fdab77ece
GIT binary patch
literal 592
zcmV-W0<ZmvP)<h;3K|Lk000e1NJLTq000;O000;W1^@s6;CDUv00001b5ch_0Itp)
z=>Px%3Q0skR7gv`mOG17K@dhy`NlV*po?NAnuvknA_@lP{sVuQ|G->9P>c=4L@^UZ
z1x0q&RebHXoU!`S%-lOOyMuOe2m0PR{Z&_eH33jc37-*Bd@j4%c;mnc*#{f~HkSnK
z2EInb&+(xf1^0pLzz@KeI(P$A;VhL~z<%H{aLbHTz%k%8;BzAb{_at-C&9BIhk+4r
zJ|adHa1?k8>;f(T>%b|Xh4}6o;3);Q5chroCx93E&e@1qZvpS?25?u2!1sh2)cbjo
z(zm?GS`_tnDa8zUP~)yl0zPE^uK-Vhlfbu3lYoN>xET?fr4-dx6~crb2j0vBTn3&2
z2Y`#fXJBuFHX>r`ZnmpHz;nQ|RpzJ((50m<fSmwTAi#?f(50iV8QsqmEp!Ki3WgeR
zQ9!Mt72uwEkBA$!5og&*DaGcpbB_S;@*q=H)NKG?Oi@JG)xB$?Odn+*+)jWgJu_LR
z0xY{O@8)$LAZy=mRZ!EbqSHG9RHyuFzT?`j7c0OXvH}+Z%qz+9{xS-N0Q!)I=Bobl
zGHqoc1?M7SZNLh&@rS^*v=J}UrHy<7uBHoYFGWqK8t?(I+5jvBZN+(Vr*Y+}DynvU
zsqvplOV)>kXlm`AY5NFh`>*=!x^Lk0Rj4*>;GtpUH@ySL58IJhb2|hX8mG?l>5=)r
ehW<bK+wup{19&Jci0(%K0000<MNUMnLSTZoM+wyc

literal 0
HcmV?d00001

diff --git a/project/fengdu/AppBIBoard/assets/settingIcon.png b/project/fengdu/AppBIBoard/assets/settingIcon.png
new file mode 100644
index 0000000000000000000000000000000000000000..3fdb6f2f381619afa23abde2c9baeabe45fc5b82
GIT binary patch
literal 666
zcmV;L0%iS)P)<h;3K|Lk000e1NJLTq000;O000;W1^@s6;CDUv00001b5ch_0Itp)
z=>Px%R7pfZR7gwBmOYG20ThM5V_5|ST8$7ALP0_&6dKW4)EXT&{+6|gzXZ$riJ{Y|
zEjm$95FH5xArVBg?NU(en%ygBa^HG8dBe!=B&M5p@0@e*x%Ztr;xC_wm;*@CL^(Ag
zx`2>0`6mdq3Pyxu2AMQSM63bMX8vhO?~>dFOh}3<tV)7%brG=yI0@_r<|oJ)a0|E~
zX|z?B&Yeb3PK=1Tz+T`CuoS2RH<RE1;P^<!??|dw$u>oh;MO!EVk>YN*qDHif#Z^1
z`+G#J&-k{CzXbXuJxysnv&L*11b&#nE8I4)3$V5yERUr7ndhoKad+e2^<@4k&k7g@
z1|)qdFkNn!HzXo<00y$o-?GA*q#qG6FM)q1@YMH+SO6S!2f!l0^XZZFuz_u@Q$I^`
z40r_WlQfdDd6Vkdp~2jNN!`6W@&<X!Jg3{hc3?<SUjw^Da6Y%CS5hq^+=+qR-CE!r
zusJn<4xEzoHV5k>$0EX=+{o=3XePJ_oB)nWx*8GPlEx!q9q<fT42&m1H}DnMBI!*j
z_XuzW7?jlCir}!M>!lyv1$O5Edy}A+i!dx{Pbv2haIGzZ9Ogpcb5_4n(wBU`4EP9)
z0?Q?R&*%RUL4`#3avfdlj3nyVkUPGn9edHLtin4!WUc?fD(nJ&SEgG<8)nxp=|Ky#
z+X?suEzHh~U~~L!cEuH{u<J{}ri?#HyMC2K8vw@(yMB@JYP)VCY24pgKRB%p`mCPJ
z=A)fm6i0t`I;zv`r0<KPUmT#ekA71(Gy2=|3(0mrK@J%mNB{r;07*qoM6N<$f+-U!
AcmMzZ

literal 0
HcmV?d00001

diff --git a/project/fengdu/AppBIBoard/assets/timeIcon.png b/project/fengdu/AppBIBoard/assets/timeIcon.png
new file mode 100644
index 0000000000000000000000000000000000000000..46629684fee9fade1d492ed55e814389fcc17c0c
GIT binary patch
literal 1316
zcmV+<1>5?GP)<h;3K|Lk000e1NJLTq000;O000;W1^@s6;CDUv00001b5ch_0Itp)
z=>Px(-bqA3R7gvGR$FKkXBa(aW_J_K)x^|jjpD7=SRra@6)H_0>_edj3mZ&?Lcto%
zgIbj$6zW(gZ9yfr;H3=|3MOq9Dk}6P4@se=si;*%t*sg~R--W&b<-rfJ9EmvyQ6E2
znWx$Lzwey$UH<P|VuD8!0oVXU(#<rLWWJkom!zHtV+_W9(g2?CEGYnBQrdW!WWv0s
zMOb46_@K`aWI9O7b%8Yi))1%wP?~n^5pWK`2^%;;GCEe!xCEKtqf!{c7XaoOq3Lvt
zq#d&}zFl{TU6aYkcqC6nU<gb~qOKZAY)vQj6p3#=pi@APAs|p{0V^PUAmB9vBH=);
z&22u$GZ9EKdGsE*YD5Y=3Svhg`OQR)Feq(=u#Z44gaZXBk|b7IOtMh6DN=7jwY1O-
zV2H%pVzMoxTQmsd8K*+vQ95PG?&_0POE?A~M?_r-+2Ui;52;7WQ37W`EEKV6hRq|A
zLIC0>ZGBRH+{GnB5VTQVOg>E4EJ!kT+f_Y<!w{}8faRs+P!hXc3RIDazoUsdOFRmw
zbADc6r5~m*;99>56!dPHdNXd%oL9sL{+Vxk^-<z?04qFV{Y$xlW`oUE$*v*Yv-e^x
z@URX<!?J0iLq4$&a=KpyjK#YNki)^UrE@swNY-vZ9e`~_p1m8}4B;SvAC{GdY7KU>
zi_FWku8|7>7Fn<>R?Q8aH_i^}`2=m(R1o6GEz__uWY1hZ?@0u{?QdPtiiBtX3F7kI
zIoV5$@Fc<Uzm#Xkhq@tzVnMI$-9`C*8Q~{ex9xO)!Dv>f+YF5$Sq^Vf|9{?KFe}&d
zPR%ch8ZkdzepnoeTiqaHZZM~;`ei;!5&YVlHx$U~1`t93v+7>Wzdx4XyY_*?tVwnk
zWSR)k^hFB-=o=kzUwOZ3%3$;9hf|TjO#-pWiP5s^H%d|jt*x>LiXU76w1_U2ZhULX
zImeOZI8Rb^q^-XI7S97HX6j~}P7MO;ON6+jVO8P4p|*jgmW8tbFHh+!SW;6%mj>Lt
z>^<4n0%@HmG<;M&^^nu9fK!zkX#P<9GBS{#6(mRFdOSTR=So@KMZ@*=jPE;sf3s+c
z%$A*Nit7wEeITc$w@%Pe0G)ekUs&l!Fwrgc&wSh6E%%abN^reXTheT>2{ZFa?fkwc
z$BpR>iG`3h?cXrtNZ7d;ia3j7nNegC?%4zO6<rN}y=B4Z_NLqQ01peeVu!eV?|Y>~
z20K}UaI5S{4c!f2{aXvEnZS_bu5H>jyUm>SUg}^aDm}+Z<=%0?4s=*0<&{eMHQrcF
z+Q$UsfUIlU@?wjR`FNW8Vb*@$-RMGFNklzYJ0c&?o^aTOKfAHfwz<y}a!EA)xNFvj
zndyCc;iS{`_9tD9a$!gy4}W-2li+pcDEp3yV2C5r32TJ~ZlHzNP04BFz|Wt~+2*Hw
z{Ea3t9D!xReslXjVOM;za0Eg~EgT{{`75=PuiMnFU-mDEB-0XxXKMP~m1z`&YhXnp
zbjuqq=4QFUcVMxaQiakhlR%HibMSP0)Q+FLbZ~Jr9F`qveH#4nJ{YeRlMWGhKuS%e
z(;m2Ub9!>=PoH&XxWlPR-w`n!P6-+h=ehqX($|ZXPKRA`u~K6JjDX(79qe!_U0=j_
a1pfm{fU!9ANoLvr0000<MNUMnLSTZoP-40O

literal 0
HcmV?d00001

diff --git a/project/fengdu/AppBIBoard/components/fengduHead.vue b/project/fengdu/AppBIBoard/components/fengduHead.vue
new file mode 100644
index 00000000..a3e22250
--- /dev/null
+++ b/project/fengdu/AppBIBoard/components/fengduHead.vue
@@ -0,0 +1,180 @@
+<template>
+  <section class="fengduHead">
+    <div flex class="content">
+      <b class="headerTitle" v-text="title"/>
+      <el-tabs class="fill" v-model="current" @tab-click="$emit('change', current)">
+        <el-tab-pane v-for="tab in tabs" :key="tab.id" :label="tab.label" :name="tab.id"/>
+      </el-tabs>
+      <div class="rightPane" flex>
+        <div class="item" v-text="currentTime"/>
+        <div class="item setting mar-l24" @click.stop="$emit('setting',true)"/>
+        <div class="item fullscreen mar-l14" @click.stop="$emit('fullscreen')"/>
+      </div>
+    </div>
+  </section>
+</template>
+
+<script>
+export default {
+  name: "fengduHead",
+  model: {
+    prop: "active",
+    event: "change"
+  },
+  props: {
+    title: String,
+    views: {default: () => []},
+    active: String,
+    currentTime: {default: null}
+  },
+  computed: {
+    tabs: v => [
+      ...v.views,
+      // {label: "测试哦哦", id: 1},
+      // {label: "测试哦哦", id: 2},
+      // {label: "测试哦哦", id: 3},
+      // {label: "测试哦哦", id: 4},
+      // {label: "测试哦哦", id: 5},
+      // {label: "测试哦哦", id: 6},
+      // {label: "测试哦哦", id: 7},
+      // {label: "测试哦哦", id: 8},
+      // {label: "测试哦哦", id: 9},
+      // {label: "测试哦哦", id: 10},
+    ]
+  },
+  data() {
+    return {
+      current: ""
+    }
+  },
+  watch: {
+    active: {
+      immediate: true,
+      handler(v) {
+        if (v != this.current) this.current = this.$copy(this.active)
+      }
+    }
+  },
+  methods: {
+    getWeather() {
+      this.$request.post("/app/weather/queryWeather").then(res => {
+        if (res?.data) {
+
+        }
+      })
+    }
+  },
+  created() {
+    // this.getWeather()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.fengduHead {
+  width: 100%;
+  height: 96px;
+  padding: 0 48px;
+  box-sizing: border-box;
+  color: #fff;
+
+  .content {
+    height: 100%;
+    background-repeat: no-repeat;
+    background-position: left bottom, right bottom;
+    font-family: PingFang-SC;
+
+    .headerTitle {
+      font-family: fangfang;
+      font-size: 38px;
+      font-weight: 400;
+      line-height: 62px;
+      letter-spacing: 1.52px;
+      color: #fff;
+    }
+
+    :deep(.el-tabs) {
+      margin-left: 92px;
+
+      .el-tabs__header {
+        margin-bottom: 0;
+      }
+
+      .el-tabs__nav-wrap {
+        padding: 0 24px;
+
+        &:after {
+          content: none;
+        }
+      }
+
+      .el-tabs__active-bar {
+        width: 88px;
+        background: linear-gradient(270deg, #02feff00 0%, #02feffff 51%, #02feff00 100%);
+      }
+
+      .el-tabs__item {
+        color: #fff;
+        font-size: 20px;
+        font-weight: 400;
+        font-family: PingFang-SC;
+        user-select: none;
+
+        &.is-active {
+          color: #02FEFF;
+        }
+      }
+
+      .el-tabs__nav-prev {
+        padding-right: 14px;
+        background-image: linear-gradient(270deg, #0b0d0cff 0%, #0f3031ff 72%, #02feffff 100%);
+
+        background-repeat: no-repeat;
+        background-position: right center;
+        background-size: 6px 32px;
+
+        .el-icon-arrow-left:before {
+          color: #02FEFF;
+          content: "◀";
+        }
+      }
+
+
+      .el-tabs__nav-next {
+        padding-left: 14px;
+        background-image: linear-gradient(270deg, #02feffff 0%, #0f3031ff 28%, #0b0d0cff 100%);
+        background-repeat: no-repeat;
+        background-position: left center;
+        background-size: 6px 32px;
+
+        .el-icon-arrow-right:before {
+          color: #02FEFF;
+          content: "▶";
+        }
+      }
+    }
+  }
+
+  .rightPane {
+    margin-left: 75px;
+    padding: 0 11px 0 0;
+
+    .item {
+      padding-left: 30px;
+      height: 30px;
+      line-height: 30px;
+      background-image: url("../assets/timeIcon.png");
+      background-repeat: no-repeat;
+      background-position: left center;
+
+      &.setting {
+        background-image: url("../assets/settingIcon.png") !important;
+      }
+
+      &.fullscreen {
+        background-image: url("../assets/fullscreenIcon.png") !important;
+      }
+    }
+  }
+}
+</style>
diff --git a/ui/packages/layout/AiFitView.vue b/ui/packages/layout/AiFitView.vue
index 5d67c62e..9559bbd8 100644
--- a/ui/packages/layout/AiFitView.vue
+++ b/ui/packages/layout/AiFitView.vue
@@ -54,6 +54,7 @@ export default {
   background-size: 10px 10px;
 
   .view {
+    flex-shrink: 0;
     background-color: #fff;
   }
 }