daikins/.svn/pristine/b1/b153b9446fc9dffdb8c29c395ddef9d5c5e2c22b.svn-base

<script setup lang="ts">
import { RouterView } from "vue-router";
import { useUserStore } from "@/stores/modules/user";
import { getCateTreePage, download, getActCateFileList, getBPCActList } from "@/api/daikin/base";
import { databaseld } from "@/stores/modules/database";
import DataBaseHead from "./components/DataBaseHead.vue";
import { useMessage } from 'naive-ui'
const message = useMessage()
const { push } = useRouter();
const store = useUserStore();
const database = databaseld();
const activeMenuKey = ref();
const route = useRoute()
let idx = ref(0);

const rowData = ref();
const srcType = ref()
let subTitle = ref();
let type = ref();
function getLastSubstring(str: string): string {
  const lastIndex = str.lastIndexOf('.');
  if (lastIndex !== -1) {
    return str.substring(lastIndex + 1);
  } else {
    return '';
  }
}

const download = async (row)=>{
//   console.log(row)
  if(!row) return
  if(row.isSelect===2){
    message.error("没有访问权限")
    return
  }
    let {filePath} = row
    if(!filePath) {
        message.info("没有可预览文件！")
        return
    }
    srcType.value = getLastSubstring(filePath)
    if(['doc', 'docx', 'ppt', 'pptx', 'xls', 'xlsx','pdf'].includes(srcType.value)){
        // src.value = filePath
        // pdfShow.value = true
        filePath='https://view.xdocin.com/view?src='+filePath
     const screenWidth = window.screen.width;
    const screenHeight = window.screen.height;
      window.open(filePath, '', 'width=' + screenWidth + ',height=' + screenHeight + ',top=' + 0 + ',left=' + 0)
    }
    else{
        message.error("文件格式不是 'doc', 'docx', 'ppt', 'pptx', 'xls', 'xlsx','pdf'！")
    }
}

const pageInfo = reactive({
  currentPage:1,
  pageSize:13,
  total:10
})

const tableData = ref();
function getFileName(url) {
  if (!url) return "";
    let lastSplashIndex = url.lastIndexOf("/");
    let lastDotIndex  = url.lastIndexOf(".");
    return url.slice(lastSplashIndex + 1, lastDotIndex);
}
const getList = async (obj) => {
    const {currentPage,pageSize}  = pageInfo 
    const {rows, total} = await getBPCActList({...obj, pageNum:currentPage,pageSize});
    tableData.value = rows;
    pageInfo.total = total
}
onMounted(() => {
  subTitle.vaule = route.query.title;
  type.value = route.query.type;
  getList({moduleId: 4})
});
const lazyState = computed(() => [pageInfo.currentPage])
  watch(
    () => unref(lazyState),
    async (v) => {
      getList({moduleId: 4})
    },
    { immediate: true, deep: true },
  )

const handleSizeChange=(e)=>{
  console.log(e)
}

const handleCurrentChange=(e)=>{
  console.log(e)
}
</script>

<template>
  <div class="page w-1920px h-1080px flex">
    <div class="main flex-1 pb15px pt0px relative">
      <DataBaseHead subTitle="运营守则" />
      <div class="w-full h-1px bg-#507FFD mt50px rd-b-20px"></div>
      <div class="w-full h-95%">
        <div class="bg-#fff rd-15px px30px pt30px w-full h930px">
          <div
            class="rd-15px w-full h870px"
            style="box-shadow: 1px 2px 26px -3px #cdcccc"
          >
            <div class="p30px relative h790px">
              <table
                class="history w-full text-center text-18px border-spacing-0"
              >
                <thead
                  style="
                    background-color: #e7edff;
                    color: #0a0a0a;
                    height: 50px;
                    width: 220px;
                    border: 1px solid #417bef;
                  "
                >
                  <tr class="text-20px leading-50px">
                    <th>
                      文件名
                    </th>
                    <th>
                      上传时间
                    </th>
                  </tr>
                </thead>
                <tbody >
                  <tr v-for="(it, index) in tableData" :key="index">
                    <td class="h50px"><span class="download" @click="download(it)">{{ it.title || getFileName(it.filePath) }}</span></td>
                    <td class="h50px"><span class="" >{{ it.createTime}}</span></td>
                  </tr>
                </tbody>
              </table>
              <div class="float-right absolute bottom-20px right-30px">
                <el-pagination v-model:current-page="pageInfo.currentPage" v-model:page-size="pageInfo.pageSize" 
                  layout="prev, pager, next, jumper" :total="pageInfo.total"
                @size-change="handleSizeChange" @current-change="handleCurrentChange" />
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<style scoped lang="less">
.page {
  font-family: "PingFang SC";
  user-select: none;
  background-image: none;
  background-color: #cacaca;
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: cover;
  color: #3b3b3b;

  line-height: 1;
}
.download {
  cursor: pointer;
}
.download:hover {
  color: #00E4FF;
}
.nav {
  &::before {
    top: -48px;
  }
  .child:hover {
    text-decoration: underline;
  }
  .childs:hover {
    text-decoration: underline;
  }

  &::after {
    bottom: -49px;
    transform: rotate(-90deg);
  }

  &.active {
    color: #002fa7;
    background-color: #e6ecff;

    a {
      color: #002fa7;
    }

    &::before,
    &::after {
      opacity: 1;
    }
  }

  &.actives {
    padding: 0px !important;
    color: #002fa7;
    background-color: #f5f8ff;

    a {
      color: #002fa7;
    }

    &::before,
    &::after {
      opacity: 1;
    }

    .onActive {
      background-color: #e6ecff;
      border-radius: 32px 0 0 32px;

      padding: 24px 36px 24px 36px;
    }
  }
}

.main {
  width: 100%;
  height: 95%;
  background-color: #4877fb;
}

&::-webkit-scrollbar {
  display: none;
  scrollbar-width: none;
}
</style>