<!--
 * @Author: June 1601745371@qq.com
 * @Date: 2024-04-12 11:31:10
 * @LastEditors: June 1601745371@qq.com
 * @LastEditTime: 2024-04-18 17:20:58
 * @FilePath: \sd-designer\src\views\Editor\index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="h-full" v-drop-image="{ url: 'UploadUrl', highlightStyle: { backgroundColor: 'lightblue' } }">
    <div class="layout-content flex">
      <CanvasLeft/>
      <div class="layout-content-center">
        <CanvasHeader class="center-header relative flex justify-between py-[10px] text-[14px] select-none h-[39px]"/>
        <CanvasCenter class="center-body"/>
        <!-- <CanvasFooter class="center-footer h-[40px] relative leading-1.5 flex justify-between" /> -->
        <CanvasAffix class="center-affix"/>
        <!--        <CanvasICP />-->
      </div>
      <CanvasRight class="layout-content-right h-full w-[260px] bg-[#fff] flex flex-col"/>
      <CanvasDom class="absolute -z-[200] -left-[300px]"/>
    </div>
    <CanvasTour/>
  </div>
</template>

<script lang="ts" setup>
import CanvasLeft from "./CanvasLeft/index.vue";
import CanvasHeader from "./CanvasHeader/index.vue";
import CanvasCenter from "./CanvasCenter/index.vue";
import CanvasRight from "./CanvasRight/index.vue";
import CanvasFooter from "./CanvasFooter/index.vue";
import CanvasICP from "./CanvasICP/index.vue";
import CanvasAffix from "./CanvasAffix/index.vue";
import CanvasDom from "./CanvasDom/index.vue";
import CanvasTour from "./CanvasTour/index.vue";

import {onMounted} from "vue";
import router from "@/router";
import {getCurrentUserTokenInfo} from "@/api/sys";
import {setToken} from "@/utils/js-cookie";
import {ElMessage} from "element-plus";
import {useMainStore} from "@/store";

const mainStore = useMainStore();

onMounted(async () => {
  const query = router.currentRoute.value.query
  if (!query.virtualCode){
    ElMessage.error('当前用户未登录,设计无法保存')
    return
  }
  const param = {
    virtualCode: query.virtualCode
  }

  getCurrentUserTokenInfo(param).then((response) => {
    if (response.httpCode == 200) {
      console.log(response.data)
      setToken('token', response.data.itemValue)
      setToken('supplierCode', response.data.supplierCode)
      setToken('dataSourceId', response.data.dataSourceId)
    }
  });

  mainStore.getFonts();
})
</script>

<style lang="scss" scoped>
.layout-content {
  height: calc(100% - 40px);
}

.layout-content-center {
  width: calc(100% - 50px/*- 160px*/ - 260px);

  .center-header {
    // border-left: 1px solid $borderColor;
  }

  .center-body {
    height: 100%;
    // margin: 100px;
  }

  .center-footer {
    border-top: 1px solid $borderColor;
    background-color: $lightGray;
  }
}

.layout-content-right {
  // border-left: solid 1px $borderColor;
}
</style>
