长春跟踪app

heyujie

2021-08-20 3b9477e4179ac9fca90a1abeb2cf544155d832bc

 src/pages/desktop/index/components/ToolsEntry.vue

@@ -2,12 +2,12 @@
  <div class="tools-entry">

    <div class="entry-wrap">

      <el-carousel

        :height="rowSize==3?'600px':'770px'"

        :height="rowSize == 3 ? '600px' : '770px'"

        :autoplay="false"

        arrow="never"

        :indicator-position="carousels.length==1?'none':''"

        :indicator-position="carousels.length == 1 ? 'none' : ''"

      >

        <el-carousel-item v-for="(carousel,index) in carousels" :key="index">

        <el-carousel-item v-for="(carousel, index) in carousels" :key="index">

          <div class="app-list clearFix sdk-list">

            <!-- <draggable v-model="carousel" @start="drag=true" @end="drag=false"> -->

            <div v-for="item in carousel" :key="item.id">

@@ -16,21 +16,27 @@
                  <div class="app-icon">

                    <div

                      class="badge"

                      v-if="item.name=='algorithmManage' && badgeNum > 0"

                    >{{badgeNum}}</div>

                      v-if="item.name == 'algorithmManage' && badgeNum > 0"

                    >

                      {{ badgeNum }}

                    </div>

                    <img :src="item.src" :alt="item.alt" />

                  </div>

                  <div class="app-name">{{item.title}}</div>

                  <div class="app-name">{{ item.title }}</div>

                </div>

              </div>

              <div class="app sdk" v-if="item.sdk_name">

                <div class="wrap">

                  <div class="app-icon">

                    <img

                      :src="item.iconBlob.indexOf(',')>0? item.iconBlob:`data:image/png;base64,${item.iconBlob}`"

                      :src="

                        item.iconBlob.indexOf(',') > 0

                          ? item.iconBlob

                          : `data:image/png;base64,${item.iconBlob}`

                      "

                    />

                  </div>

                  <div class="app-name">{{item.sdk_name}}</div>

                  <div class="app-name">{{ item.sdk_name }}</div>

                </div>

              </div>

            </div>

@@ -46,11 +52,11 @@
</template>



<script>

import draggable from "vuedraggable"

import { findAllSdk } from '@/api/taskMange';

import bus from '@/plugin/bus'

import draggable from "vuedraggable";

import { findAllSdk } from "@/api/taskMange";

import bus from "@/plugin/bus";

export default {

  name: 'toolsEntry',

  name: "toolsEntry",

  data() {

    return {

      publicPath: process.env.BASE_URL,

@@ -68,16 +74,16 @@
      // ],

      //rowSize: 3,

      // badgeNum: 0,

    }

    };

  },

  computed: {

    stateDocks() {

      return this.$store.state.desktop.docks

      return this.$store.state.desktop.docks;

    },

    carousels() {

      let pages = 0;

      let tempArr = this.stateDocks.concat(this.installedSdk);

      let upgradeArr = tempArr.filter(item => item.isUpgrade);

      let upgradeArr = tempArr.filter((item) => item.isUpgrade);

      let arr = null;

      //根据屏幕高度来判断是展示3排还是4排 阈值:970

      if (window.innerHeight >= 930) {

@@ -87,11 +93,11 @@
        //this.rowSize = 3;

        arr = this.chunk(tempArr, 18);

      }

      return arr

      return arr;

    },

    badgeNum() {

      let tempArr = this.stateDocks.concat(this.installedSdk);

      return tempArr.filter(item => item.isUpgrade).length;

      return tempArr.filter((item) => item.isUpgrade).length;

    },

    rowSize() {

      if (window.innerHeight >= 930) {

@@ -99,12 +105,12 @@
      } else {

        return 3;

      }

    }

    },

  },

  mounted() {

    this.getAllSdk();

    let _this= this

    window.addEventListener('message', e => {

    let _this = this;

    window.addEventListener("message", (e) => {

      if (e.data && e.data.msg) {

        let msg = e.data.msg;

        if (msg === "logout") {

@@ -113,39 +119,35 @@
        }

        if (msg.indexOf("toSearch") >= 0) {

          let params = msg.substring(7);

          this.addFrameByName("search", params)

          this.addFrameByName("search", params);

        }

        if (msg.indexOf("toCluster") >= 0) {

          let params = msg.substring(8);

          this.addFrameByName("searchForCluster", params)

          this.addFrameByName("searchForCluster", params);

        }

        if (msg.indexOf("toSetting")>-1) {

          const str = msg.split("?")[1]

          this.addFrameByName("settings", str)

        if (msg.indexOf("toSetting") > -1) {

          const str = msg.split("?")[1];

          this.addFrameByName("settings", str);

        }

        if (msg.indexOf("toVindicate")>-1) {

          const str = msg.split("?")[1]

          this.addFrameByName("vindicate", str)

        if (msg.indexOf("toVindicate") > -1) {

          const str = msg.split("?")[1];

          this.addFrameByName("vindicate", str);

        }

         if (msg.indexOf("toAI")>-1) {

          const str = msg.split("?")[1]

          this.addFrameByName("algorithmManage", str)

        if (msg.indexOf("toAI") > -1) {

          const str = msg.split("?")[1];

          this.addFrameByName("algorithmManage", str);

        }

        if (msg.indexOf("toOpenApp") >= 0) {

          let id = msg.substring(10);

          this.addFrameByID(id)

          this.addFrameByID(id);

        }

        if (msg.indexOf("changeBackground")>-1) {

        const name = e.data.msg.split("?")[1]

        _this.$emit("changeBackground", `/images/desktop/${name}.png`)

      }

        // if (msg.indexOf("refreshDesk")>-1) {

        //   this.getAllSdk();

        // }

          debugger

        if (msg == 'AppUpdate') {

        if (msg.indexOf("changeBackground") > -1) {

          const name = e.data.msg.split("?")[1];

          _this.$emit("changeBackground", `/images/desktop/${name}.png`);

        }

        if (msg == "AppUpdate") {

          this.getAllSdk();

      }

        }

      }

    });

  },

@@ -154,115 +156,116 @@
      size = Math.max(size, 0);

      const len = arr == null ? 0 : arr.length;

      if (!len || size < 1) {

        return []

        return [];

      }

      let index = 0;

      let resIndex = 0;

      const result = new Array(Math.ceil(len / size))

      const result = new Array(Math.ceil(len / size));

      while (index < len) {

        result[resIndex++] = arr.slice(index, index += size)

        result[resIndex++] = arr.slice(index, (index += size));

      }

      return result

      return result;

    },

    onJumpToDock(name){

      let togo 
      this.carousels.forEach(arr => {

        arr.forEach(x => {

          if (x.title==name) {

            togo= x

    onJumpToDock(name) {

      let togo;

      this.carousels.forEach((arr) => {

        arr.forEach((x) => {

          if (x.title == name) {

            togo = x;

          }

        });

      });

      this.dockClick(togo)

      this.dockClick(togo);

    },

    getAllSdk() {

      findAllSdk().then(res => {

        this.installedSdk = res.data.filter(item => item.installed)

      }).catch(e => {

        console.log(e)

      })

      findAllSdk()

        .then((res) => {

          this.installedSdk = res.data.filter((item) => item.installed);

        })

        .catch((e) => {

          console.log(e);

        });

    },

    dockClick(dock) {

      if (dock.type === '1') {

      if (dock.type === "1") {

        window.open(dock.url);

      } else if (dock.type === '2' && !dock.isOpen) {

        this.$store.dispatch('desktop/addFrame', {

      } else if (dock.type === "2" && !dock.isOpen) {

        this.$store.dispatch("desktop/addFrame", {

          id: dock.id,

          icon: dock.src,

          title: dock.title,

          url: dock.url

          url: dock.url,

        });

        this.$store.commit('desktop/addMinDock', {

        this.$store.commit("desktop/addMinDock", {

          id: dock.id,

          src: dock.src,

          alt: dock.title,

          type: "3",

          highlight: true,

          url: dock.url,

          screenshot: ''

          screenshot: "",

        });

        //打开应用后异步抓拍,之后的抓拍采用这张固定的

        //if(dock.name=='cameraVideo'||dock.name=='search'||dock.name=='library'||dock.name=='cameraAccess'||dock.name=='dataStack'){

        setTimeout(() => {

          this.$parent.screenShot(dock);

        }, 1500)

        }, 1500);

        //}

      } else if (dock.type === '2' && dock.isOpen) {

        this.$store.commit('desktop/resetMinFrame', dock.id);

      } else if (dock.type === "2" && dock.isOpen) {

        this.$store.commit("desktop/resetMinFrame", dock.id);

      }

      
    },

    resetDockItem() {

      const dockItems = document.getElementsByClassName('dock-item');

      const dockMask = document.getElementsByClassName('dock-mask')[0];

      const dockItems = document.getElementsByClassName("dock-item");

      const dockMask = document.getElementsByClassName("dock-mask")[0];

      for (let i = 0; i < dockItems.length; i++) {

        dockItems[i].width = 60;

        if (dockItems[i].parentNode.nextElementSibling) {

          dockItems[i].parentNode.nextElementSibling.style.marginLeft = "-35px";

        }

      }

      dockMask.style.width = dockItems.length * 60 + 40 + 'px';

      dockMask.style.width = dockItems.length * 60 + 40 + "px";

    },

    addFrameByName(name, params) {

      let dock = null;

      this.$store.state.desktop.docks.forEach(app => {

      this.$store.state.desktop.docks.forEach((app) => {

        if (app.name === name) {

          dock = app;

        }

      });

      if (dock.isOpen) {

        this.$store.dispatch('desktop/closeFrame', dock);

        this.$store.dispatch("desktop/closeFrame", dock);

      }

      this.$store.dispatch('desktop/addFrame', {

      this.$store.dispatch("desktop/addFrame", {

        id: dock.id,

        icon: dock.src,

        title: dock.title,

        url: dock.url + "?" + params

        url: dock.url + "?" + params,

      });

      this.$store.commit('desktop/addMinDock', {

      this.$store.commit("desktop/addMinDock", {

        id: dock.id,

        src: dock.src,

        alt: dock.title,

        type: "3",

        highlight: true,

        url: dock.url,

        screenshot: ''

        screenshot: "",

      });

    },

    addFrameByID(id, params) {

      let dock = null;

      let toClose = null

      this.$store.state.desktop.docks.forEach(app => {

      let toClose = null;

      this.$store.state.desktop.docks.forEach((app) => {

        if (app.id == id) {

          dock = app;

        }

        if (app.name == "algorithmManage") {

          toClose = app

          toClose = app;

        }

      });

      this.dockClick(dock)

    }

  }

      this.dockClick(dock);

    },

  },

};

</script>