|
|
@@ -1,834 +0,0 @@
|
|
|
-<template>
|
|
|
- <div>
|
|
|
- <div class="bigBox">
|
|
|
- <div class="settingBox">
|
|
|
- <!-- 设置盒子顶部搜索 -->
|
|
|
- <div class="topSearch">
|
|
|
- <div style="position: relative;">
|
|
|
- <el-input v-model="searchFire" class="searchFire" size="large" placeholder="搜索文件" />
|
|
|
- <el-icon style="color: gray;display: inline-block;position: absolute;top: 8px;right: 5px;">
|
|
|
- <Search />
|
|
|
- </el-icon>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <el-icon style="font-size: 24px;">
|
|
|
- <Plus />
|
|
|
- </el-icon>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 方块点击盒子 -->
|
|
|
- <div
|
|
|
- style="display: flex;justify-content: flex-start;align-items: flex-start;flex-wrap: wrap;height: 540px;">
|
|
|
- <!-- v-for盒子 -->
|
|
|
- <div class="setBox" @click="changeFile">
|
|
|
- <el-dropdown trigger="click" class="selectChe">
|
|
|
- <span class="el-dropdown-link">
|
|
|
- ...
|
|
|
- </span>
|
|
|
- <template #dropdown>
|
|
|
- <el-dropdown-menu>
|
|
|
- <el-dropdown-item @click="addPeople">
|
|
|
- <img :src="togger" alt="">
|
|
|
- <span>添加人员</span>
|
|
|
- </el-dropdown-item>
|
|
|
- <el-dropdown-item>
|
|
|
- <img :src="textbox" alt="">
|
|
|
- <span>重命名</span>
|
|
|
- </el-dropdown-item>
|
|
|
- <el-dropdown-item>
|
|
|
- <img :src="trash" alt="">
|
|
|
- <span>删除</span>
|
|
|
- </el-dropdown-item>
|
|
|
- </el-dropdown-menu>
|
|
|
- </template>
|
|
|
- </el-dropdown>
|
|
|
- <img src="../../assets/images/fileStyle.png" style="width: 72px;height: 72px;">
|
|
|
- <p>xxx文件</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <p>
|
|
|
- <span style="margin-left: 10px;">5G/1T</span>
|
|
|
- <span style="margin-left: 10rem;font-size: 12px;color: blue;cursor: pointer;"
|
|
|
- @click="askApply">申请扩容</span>
|
|
|
- </p>
|
|
|
- <el-progress style="margin-left: 8px;" :percentage="50" />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 右侧大盒子 -->
|
|
|
- <div class="mesBox">
|
|
|
- <!-- 功能盒子 -->
|
|
|
- <div class="useBox">
|
|
|
- <!-- table切换 -->
|
|
|
- <div style="width: 100%;height: 24px;background-color: #7084B4;line-height: 20px;">
|
|
|
- <template v-for="(item, index) in menuList">
|
|
|
- <span @click="tableChange(item, index)"
|
|
|
- :class="['tables', { tableLis: selectedIndex === index }]">
|
|
|
- {{ item.name }}
|
|
|
- <img v-if="selectedIndex === index ? true : false"
|
|
|
- style="position: absolute;top: 4px;right: 4px;" src="../../assets/images/close.png"
|
|
|
- @click="shotdown(item)">
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- </div>
|
|
|
- <!-- 众多功能 -->
|
|
|
- <div class="manyUse">
|
|
|
- <div
|
|
|
- style="display: flex;width: 92px;height: 32px;justify-content: flex-start;align-items: center;line-height: 18px;">
|
|
|
- <div style="margin-left: 5px;">
|
|
|
- <el-icon
|
|
|
- style="background-color: #7084B4;width: 24px;height: 24px;border-radius: 50%;color: white;">
|
|
|
- <Plus />
|
|
|
- </el-icon>
|
|
|
- </div>
|
|
|
- <div style="margin-left: 5px;">
|
|
|
- <el-dropdown trigger="click">
|
|
|
- <span style="color: black;cursor: pointer;font-size: 12px;" @click="createNew">新建
|
|
|
- <el-icon>
|
|
|
- <arrow-down />
|
|
|
- </el-icon>
|
|
|
- </span>
|
|
|
- <template #dropdown>
|
|
|
- <el-dropdown-menu>
|
|
|
- <!-- <template v-for="(item, index) in arrorMenu">
|
|
|
- <el-dropdown-item>
|
|
|
- <img :src="item.img" alt="">
|
|
|
- <span>{{ item.name }}</span>
|
|
|
- </el-dropdown-item>
|
|
|
- </template> -->
|
|
|
- <el-dropdown-item @click="directoryOpen">
|
|
|
- 组织目录
|
|
|
- </el-dropdown-item>
|
|
|
- <el-dropdown-item @click="directoryOpen">
|
|
|
- 公开目录
|
|
|
- </el-dropdown-item>
|
|
|
- </el-dropdown-menu>
|
|
|
- </template>
|
|
|
- </el-dropdown>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <template v-for="(item, index) in useMenu">
|
|
|
- <div
|
|
|
- style="display: flex;width: 82px;height: 32px;justify-content: flex-start;align-items: center;line-height: 18px;">
|
|
|
- <div style="margin-left: 5px;">
|
|
|
- <img :src="item.img" style="width: 24px;height: 24px;" alt="">
|
|
|
- </div>
|
|
|
- <div style="margin-left: 5px;">
|
|
|
- <span style="font-size: 12px;">{{ item.name }}</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- <div
|
|
|
- style="display: flex;width: 102px;height: 32px;justify-content: flex-start;align-items: center;line-height: 18px;">
|
|
|
- <div style="margin-left: 5px;">
|
|
|
- <img :src="funnel" style="width: 24px;height: 24px;" alt="">
|
|
|
- </div>
|
|
|
- <div style="margin-left: 5px;">
|
|
|
- <el-dropdown trigger="click">
|
|
|
- <span style="color: black;cursor: pointer;font-size: 12px;">快速筛选
|
|
|
- <el-icon>
|
|
|
- <arrow-down />
|
|
|
- </el-icon>
|
|
|
- </span>
|
|
|
- <template #dropdown>
|
|
|
- <!-- <el-dropdown-menu>
|
|
|
- <template v-for="(item, index) in arrorMenu">
|
|
|
- <el-dropdown-item>
|
|
|
- <img :src="item.img" alt="">
|
|
|
- <span>{{ item.name }}</span>
|
|
|
- </el-dropdown-item>
|
|
|
- </template>
|
|
|
- </el-dropdown-menu> -->
|
|
|
- </template>
|
|
|
- </el-dropdown>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div
|
|
|
- style="display: flex;width: 92px;height: 32px;justify-content: flex-start;align-items: center;line-height: 18px;">
|
|
|
- <div style="margin-left: 5px;">
|
|
|
- <img src="../../assets/images/upload.png" style="width: 24px;height: 24px;" alt="">
|
|
|
- </div>
|
|
|
- <div style="margin-left: 5px;">
|
|
|
- <el-dropdown trigger="click">
|
|
|
- <span style="color: black;cursor: pointer;font-size: 12px;">上传
|
|
|
- <el-icon>
|
|
|
- <arrow-down />
|
|
|
- </el-icon>
|
|
|
- </span>
|
|
|
- <template #dropdown>
|
|
|
- <el-dropdown-menu>
|
|
|
- <template v-for="(item, index) in arrorMenu">
|
|
|
- <el-dropdown-item>
|
|
|
- <img :src="item.img" alt="">
|
|
|
- <span>{{ item.name }}</span>
|
|
|
- </el-dropdown-item>
|
|
|
- </template>
|
|
|
- </el-dropdown-menu>
|
|
|
- </template>
|
|
|
- </el-dropdown>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 面包屑功能栏 -->
|
|
|
- <div class="breadBox">
|
|
|
- <!-- 左侧 -->
|
|
|
- <div style="display: flex;justify-content: space-around;align-items: center;">
|
|
|
- <!-- 前进后退 -->
|
|
|
- <div style="display: flex;justify-content: space-around;align-items: center;">
|
|
|
- <img style="display:block;width: 11px;height: 11px;" :src="blueLeft" alt="">
|
|
|
- <img style="display:block;width: 16px;height: 16px;" :src="grayRight" alt="">
|
|
|
- </div>
|
|
|
- <!-- 面包屑 -->
|
|
|
- <div>
|
|
|
- <el-breadcrumb separator="/">
|
|
|
- <el-breadcrumb-item style="font-size: 12px;">homepage</el-breadcrumb-item>
|
|
|
- <el-breadcrumb-item style="font-size: 12px;">promotion management</el-breadcrumb-item>
|
|
|
- <el-breadcrumb-item style="font-size: 12px;">promotion detail</el-breadcrumb-item>
|
|
|
- </el-breadcrumb>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 右侧 -->
|
|
|
- <div>
|
|
|
- <img :src="sort" alt="">
|
|
|
- <img :src="squre" alt="">
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 展示文件夹盒子 -->
|
|
|
- <div>
|
|
|
- <!-- 文件夹 -->
|
|
|
- <div class="detailBox">
|
|
|
- <el-collapse v-model="folder" accordion class="collapse">
|
|
|
- <el-collapse-item title="文件夹" name="1" class="custom-collapse-item">
|
|
|
-
|
|
|
- </el-collapse-item>
|
|
|
- </el-collapse>
|
|
|
- </div>
|
|
|
- <!-- 文件 -->
|
|
|
- <div class="fileTable">
|
|
|
- <el-collapse v-model="files" accordion class="collapse">
|
|
|
- <el-collapse-item title="文件" name="2" class="custom-collapse-item">
|
|
|
- <el-table :data="fileList" style="width: 100%" @row-click="handleRowClick">
|
|
|
- <el-table-column label="Image" width="100">
|
|
|
- <template slot-scope="scope">
|
|
|
- <!-- 插入固定图片 -->
|
|
|
- <span>1</span>
|
|
|
- <img :src="fileBox" alt="" />
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="date" label="Date" width="180" />
|
|
|
- <el-table-column prop="name" label="Name" width="180" />
|
|
|
- <el-table-column prop="address" label="Address" />
|
|
|
- </el-table>
|
|
|
- <!-- <div class="setCli" v-if="cliCC">
|
|
|
- <template v-for="(item, index) in mouseCli">
|
|
|
- <p @click="chooseSet(item, index)" class="chooseSet">
|
|
|
- <img :src="item.img" alt="">
|
|
|
- {{ item.name }}
|
|
|
- <span v-if="item.name == '在线编辑' || item.name == '协作' ? true : false"
|
|
|
- style="color: #7084B4;float: right;">></span>
|
|
|
- </p>
|
|
|
- </template>
|
|
|
- </div> -->
|
|
|
- </el-collapse-item>
|
|
|
- </el-collapse>
|
|
|
- </div>
|
|
|
- <!-- 添加人员穿梭框 -->
|
|
|
- <div>
|
|
|
- <el-dialog v-model="transferModal" title="添加人员" width="40%">
|
|
|
- <el-transfer v-model="tranvalue" filterable :filter-method="filterMethod"
|
|
|
- filter-placeholder="State Abbreviations" :data="trandata" />
|
|
|
- <template #footer>
|
|
|
- <span class="dialog-footer">
|
|
|
- <el-button @click="transferModal = false">取消</el-button>
|
|
|
- <el-button type="primary" @click="transferSure">确定</el-button>
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- </el-dialog>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 扩容弹窗 -->
|
|
|
- <div>
|
|
|
- <el-dialog v-model="askTo" title="扩容申请" width="30%">
|
|
|
- <el-form>
|
|
|
- <el-form-item label="新容量">
|
|
|
- <el-input-number v-model="askNum" :min="1" :max="10" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="申请理由">
|
|
|
- <el-input v-model="askTalk" maxlength="150" placeholder="请输入申请理由" show-word-limit
|
|
|
- type="textarea" />
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- <template #footer>
|
|
|
- <span class="dialog-footer">
|
|
|
- <el-button @click="askTo = false">取消</el-button>
|
|
|
- <el-button type="primary" @click="sureAsk">
|
|
|
- 确定
|
|
|
- </el-button>
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- </el-dialog>
|
|
|
- </div>
|
|
|
- <!-- 新建组织目录 -->
|
|
|
- <div>
|
|
|
- <el-dialog v-model="directoryModal" title="新建目录" width="55%">
|
|
|
- <el-form :data="v1form">
|
|
|
- <el-form-item label="目录名称">
|
|
|
- <el-input v-model="v1form.names"></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="目录分类">
|
|
|
- <el-radio-group v-model="v1form.types" class="ml-4" @change="directoryChange">
|
|
|
- <el-radio label="公开目录" value="0" size="large"></el-radio>
|
|
|
- <el-radio label="组织目录" value="1" size="large"></el-radio>
|
|
|
- </el-radio-group>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="成员权限" v-if="directoryPower">
|
|
|
- <el-checkbox-group v-model="v1form.power">
|
|
|
- <el-checkbox label="可查看" />
|
|
|
- <el-checkbox label="可编辑" />
|
|
|
- <el-checkbox label="可上传" />
|
|
|
- <el-checkbox label="可删除" />
|
|
|
- </el-checkbox-group>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="选择成员" v-if="directoryPower">
|
|
|
- <!-- <el-transfer v-model="v1form.tranvalue1" filterable :filter-method="filterMethod1"
|
|
|
- filter-placeholder="State Abbreviations" :data="trandata1" /> -->
|
|
|
- <!-- <template #footer>
|
|
|
- <span class="dialog-footer">
|
|
|
- <el-button @click="transferModal = false">取消</el-button>
|
|
|
- <el-button type="primary" @click="transferSure">确定</el-button>
|
|
|
- </span>
|
|
|
- </template> -->
|
|
|
- <TransferModal :isNewMenu="isNewMenu"></TransferModal>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- <template #footer>
|
|
|
- <span class="dialog-footer">
|
|
|
- <el-button @click="directoryModal = false">取消</el-button>
|
|
|
- <el-button type="primary">
|
|
|
- 确定
|
|
|
- </el-button>
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- </el-dialog>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import { ref } from 'vue'
|
|
|
-import myfile from '../../api/myfile/myfile'
|
|
|
-import TransferModal from '../myfile/modalComponebts/Transfer.vue'
|
|
|
-import { Search } from '@element-plus/icons-vue'
|
|
|
-import copy from '../../assets/images/copy.png'
|
|
|
-import clipboard from '../../assets/images/clipboard.png'
|
|
|
-import share from '../../assets/images/share.png'
|
|
|
-import trash from '../../assets/images/trash.png'
|
|
|
-import file from '../../assets/images/file.png'
|
|
|
-import folder from '../../assets/images/folder.png'
|
|
|
-import image from '../../assets/images/image.png'
|
|
|
-import filmSlate from '../../assets/images/filmSlate.png'
|
|
|
-import musicNotes from '../../assets/images/musicNotes.png'
|
|
|
-import blueLeft from '../../assets/images/blueLeft.png'
|
|
|
-import grayRight from "../../assets/images/grayRight.png"
|
|
|
-import sort from '../../assets/images/sort.png'
|
|
|
-import squre from '../../assets/images/squre.png'
|
|
|
-import addolder from '../../assets/images/addolder.png'
|
|
|
-import textbox from '../../assets/images/textbox.png'
|
|
|
-import goon from '../../assets/images/goon.png'
|
|
|
-import notePencil from '../../assets/images/notePencil.png'
|
|
|
-import togger from '../../assets/images/togger.png'
|
|
|
-import icc from '../../assets/images/icc.png'
|
|
|
-import history from '../../assets/images/history.png'
|
|
|
-import fileBox from '../../assets/images/fileBox.png'
|
|
|
-import funnel from '../../assets/images/funnel.png'
|
|
|
-import txt from '../../assets/images/txt.png'
|
|
|
-import pptx from '../../assets/images/pptx.png'
|
|
|
-import word from '../../assets/images/word.png'
|
|
|
-import pdf from '../../assets/images/pdf.png'
|
|
|
-import xlxs from '../../assets/images/xlxs.png'
|
|
|
-export default {
|
|
|
- setup() {
|
|
|
- let searchFire = ref('')
|
|
|
- let selectedIndex = ref(0)
|
|
|
- let folder = ref(['1'])
|
|
|
- let files = ref(['2'])
|
|
|
- let folderList = ref([])
|
|
|
- let askTo = ref(false)
|
|
|
- let askNum = ref(1)
|
|
|
- let askTalk = ref('')
|
|
|
- // let cliCC = ref(false)
|
|
|
- let transferModal = ref(false)
|
|
|
- let directoryModal = ref(false)
|
|
|
- let directoryPower = ref(true)
|
|
|
- let trandata = ref(generateData())
|
|
|
- let trandata1 = ref(generateData1())
|
|
|
- let tranvalue = ref([])
|
|
|
- const isNewMenu=ref([]) //是否是新建组织目录
|
|
|
- // let tranvalue1 = ref([])
|
|
|
- let v1form = ref({
|
|
|
- names:"",
|
|
|
- types:"1",
|
|
|
- power:[],
|
|
|
- tranvalue1:[]
|
|
|
- })
|
|
|
- let fileList = ref([
|
|
|
- {
|
|
|
- date: '2016-05-03',
|
|
|
- name: 'Tom',
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
- },
|
|
|
- {
|
|
|
- date: '2016-05-02',
|
|
|
- name: 'Tom',
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
- },
|
|
|
- {
|
|
|
- date: '2016-05-04',
|
|
|
- name: 'Tom',
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
- },
|
|
|
- {
|
|
|
- date: '2016-05-01',
|
|
|
- name: 'Tom',
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
- },
|
|
|
- ])
|
|
|
- let menuList = ref([
|
|
|
- {
|
|
|
- name: "标签1",
|
|
|
- choose: "1"
|
|
|
- },
|
|
|
- {
|
|
|
- name: "标签2",
|
|
|
- choose: "2"
|
|
|
- },
|
|
|
- ])
|
|
|
- let useMenu = ref([
|
|
|
- {
|
|
|
- img: copy,
|
|
|
- name: "复制"
|
|
|
- },
|
|
|
- {
|
|
|
- img: clipboard,
|
|
|
- name: "粘贴"
|
|
|
- },
|
|
|
- {
|
|
|
- img: share,
|
|
|
- name: "分享给"
|
|
|
- },
|
|
|
- {
|
|
|
- img: trash,
|
|
|
- name: "删除"
|
|
|
- },
|
|
|
- ])
|
|
|
- let arrorMenu = ref([
|
|
|
- {
|
|
|
- img: file,
|
|
|
- name: "文件"
|
|
|
- },
|
|
|
- {
|
|
|
- img: folder,
|
|
|
- name: '文件夹'
|
|
|
- },
|
|
|
- {
|
|
|
- img: image,
|
|
|
- name: "图片"
|
|
|
- },
|
|
|
- {
|
|
|
- img: filmSlate,
|
|
|
- name: "视频"
|
|
|
- },
|
|
|
- {
|
|
|
- img: musicNotes,
|
|
|
- name: "音频"
|
|
|
- }
|
|
|
- ])
|
|
|
- let mouseCli = ref([
|
|
|
- {
|
|
|
- img: addolder,
|
|
|
- name: "移动",
|
|
|
- },
|
|
|
- {
|
|
|
- img: copy,
|
|
|
- name: "复制",
|
|
|
- },
|
|
|
- {
|
|
|
- img: clipboard,
|
|
|
- name: "粘贴"
|
|
|
- },
|
|
|
- {
|
|
|
- img: textbox,
|
|
|
- name: "重命名"
|
|
|
- },
|
|
|
- {
|
|
|
- img: goon,
|
|
|
- name: "发送"
|
|
|
- },
|
|
|
- {
|
|
|
- img: share,
|
|
|
- name: "分享"
|
|
|
- },
|
|
|
- {
|
|
|
- img: notePencil,
|
|
|
- name: "在线编辑"
|
|
|
- },
|
|
|
- {
|
|
|
- img: togger,
|
|
|
- name: "协作"
|
|
|
- },
|
|
|
- {
|
|
|
- img: icc,
|
|
|
- name: "文字识别"
|
|
|
- },
|
|
|
- {
|
|
|
- img: history,
|
|
|
- name: "历史版本"
|
|
|
- },
|
|
|
- {
|
|
|
- img: share,
|
|
|
- name: "删除"
|
|
|
- }
|
|
|
- ])
|
|
|
- function getAll() {
|
|
|
- myfile.getAllFileMenu().then(res => {
|
|
|
- console.log(res, 'eee');
|
|
|
- })
|
|
|
- }
|
|
|
- function changeFile(row) {
|
|
|
-
|
|
|
- }
|
|
|
- // tableMenu切换
|
|
|
- function tableChange(row, num) {
|
|
|
- this.selectedIndex = num
|
|
|
- }
|
|
|
- // x图标事件
|
|
|
- function shotdown(row) {
|
|
|
- this.menuList = this.menuList.filter(item => item.name !== row.name)
|
|
|
- }
|
|
|
- // 文件名表格每一行点击事件
|
|
|
- function handleRowClick(row) {
|
|
|
- cliCC.value = true
|
|
|
- }
|
|
|
- // 申请扩容
|
|
|
- function askApply() {
|
|
|
- this.askTo = true
|
|
|
- }
|
|
|
- function sureAsk() {
|
|
|
- this.askTo = false
|
|
|
- }
|
|
|
- //mouse弹框
|
|
|
- function chooseSet(row, num) {
|
|
|
- if (row.name == '在线编辑' || row.name == '协作') {
|
|
|
- cliCC.value = true
|
|
|
- } else {
|
|
|
- cliCC.value = false
|
|
|
- }
|
|
|
- // if (row.name == '分享') {
|
|
|
- // transferModal.value = true
|
|
|
- // } else {
|
|
|
- // transferModal.value = false
|
|
|
- // }
|
|
|
- }
|
|
|
- // 穿梭框数据
|
|
|
- function generateData() {
|
|
|
- const data = []
|
|
|
- const states = [
|
|
|
- '某人1',
|
|
|
- '某人2',
|
|
|
- '某人3',
|
|
|
- '某人4',
|
|
|
- '某人5',
|
|
|
- '某人6',
|
|
|
- '某人7 ',
|
|
|
- ]
|
|
|
- const initials = ['CA', 'IL', 'MD', 'TX', 'FL', 'CO', 'CT']
|
|
|
- states.forEach((city, index) => {
|
|
|
- data.push({
|
|
|
- label: city,
|
|
|
- key: index,
|
|
|
- initial: initials[index],
|
|
|
- })
|
|
|
- })
|
|
|
- return data
|
|
|
- }
|
|
|
- // 新建目录时选择的穿梭框数据
|
|
|
- function generateData1() {
|
|
|
- const data = []
|
|
|
- const states = [
|
|
|
- '某某1',
|
|
|
- '某某2',
|
|
|
- '某某3',
|
|
|
- '某某4',
|
|
|
- '某某5',
|
|
|
- '某某6',
|
|
|
- '某某7 ',
|
|
|
- ]
|
|
|
- const initials = ['CA', 'IL', 'MD', 'TX', 'FL', 'CO', 'CT']
|
|
|
- states.forEach((city, index) => {
|
|
|
- data.push({
|
|
|
- label: city,
|
|
|
- key: index,
|
|
|
- initial: initials[index],
|
|
|
- })
|
|
|
- })
|
|
|
- return data
|
|
|
- }
|
|
|
- function filterMethod(query, item) {
|
|
|
- return item.initial.toLowerCase().includes(query.toLowerCase())
|
|
|
- }
|
|
|
- function filterMethod1(query, item) {
|
|
|
- return item.initial.toLowerCase().includes(query.toLowerCase())
|
|
|
- }
|
|
|
- // 添加人员
|
|
|
- function addPeople() {
|
|
|
- transferModal.value = true
|
|
|
- }
|
|
|
- // 新建组织目录
|
|
|
- function directoryOpen() {
|
|
|
- directoryModal.value = true
|
|
|
- }
|
|
|
- function directoryChange(e){
|
|
|
- if(e==='公开目录'){
|
|
|
- directoryPower.value = false
|
|
|
- }else{
|
|
|
- directoryPower.value = true
|
|
|
- isNewMenu.value=true
|
|
|
- }
|
|
|
- }
|
|
|
- return {
|
|
|
- folderList,//文件夹的数据
|
|
|
- fileList,//文件夹的数据
|
|
|
- getAll,//拿到数据的方法
|
|
|
- searchFire,//搜索文件的model
|
|
|
- changeFile,//切换右侧视图的file
|
|
|
- menuList,//右侧切换
|
|
|
- tableChange,//改变class点击事件
|
|
|
- selectedIndex,//当前选中下标
|
|
|
- shotdown,//筛选出当前数据
|
|
|
- useMenu,
|
|
|
- arrorMenu,
|
|
|
- blueLeft,//返回
|
|
|
- grayRight,//前进
|
|
|
- squre,//视图切换
|
|
|
- sort,//排序
|
|
|
- folder,
|
|
|
- files,
|
|
|
- handleRowClick,
|
|
|
- askApply,//申请扩容
|
|
|
- askTo,
|
|
|
- sureAsk,
|
|
|
- askNum,
|
|
|
- askTalk,
|
|
|
- // cliCC,
|
|
|
- addolder,//图片↓
|
|
|
- textbox,
|
|
|
- goon,
|
|
|
- notePencil,
|
|
|
- togger,
|
|
|
- icc,
|
|
|
- history,
|
|
|
- mouseCli,//文件点击弹框
|
|
|
- chooseSet,
|
|
|
- fileBox,
|
|
|
- transferModal,
|
|
|
- generateData,
|
|
|
- generateData1,
|
|
|
- filterMethod,
|
|
|
- filterMethod1,
|
|
|
- trandata,
|
|
|
- trandata1,
|
|
|
- tranvalue,
|
|
|
- trash,//删除图标
|
|
|
- funnel,//筛选图标
|
|
|
- folder,//文件夹图标
|
|
|
- addPeople,
|
|
|
- directoryModal,
|
|
|
- directoryOpen,//新建组织目录
|
|
|
- v1form,
|
|
|
- directoryChange,
|
|
|
- directoryPower,
|
|
|
- txt,
|
|
|
- pptx,
|
|
|
- xlxs,
|
|
|
- pdf,
|
|
|
- word,
|
|
|
- }
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.getAll();
|
|
|
- },
|
|
|
- components: {
|
|
|
- TransferModal,
|
|
|
- },
|
|
|
-}
|
|
|
-</script>
|
|
|
-
|
|
|
-<style scoped>
|
|
|
-p {
|
|
|
- margin: 0;
|
|
|
- padding: 0;
|
|
|
-}
|
|
|
-
|
|
|
-.bigBox {
|
|
|
- display: flex;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-
|
|
|
-.settingBox {
|
|
|
- width: 342px;
|
|
|
- height: 666px;
|
|
|
- border: 2px solid black;
|
|
|
- border-radius: 4px;
|
|
|
- /* margin: 5px 5px; */
|
|
|
- margin-right: 15px;
|
|
|
- background-color: white;
|
|
|
-}
|
|
|
-
|
|
|
-.topSearch {
|
|
|
- width: 100%;
|
|
|
- height: 48px;
|
|
|
- background-color: #EBEFF6;
|
|
|
- display: flex;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-
|
|
|
-.searchFire {
|
|
|
- width: 248px;
|
|
|
- height: 32px;
|
|
|
-}
|
|
|
-
|
|
|
-.setBox {
|
|
|
- width: 88px;
|
|
|
- height: 112px;
|
|
|
- text-align: center;
|
|
|
- margin-left: 12px;
|
|
|
- margin-top: 5px;
|
|
|
- position: relative;
|
|
|
-}
|
|
|
-
|
|
|
-.setBox:hover {
|
|
|
- background-color: #EEF9FF;
|
|
|
-}
|
|
|
-
|
|
|
-.setBox:hover .selectChe {
|
|
|
- background-color: #EEF9FF;
|
|
|
- display: block;
|
|
|
-}
|
|
|
-
|
|
|
-.selectChe {
|
|
|
- display: none;
|
|
|
- width: 20px;
|
|
|
- height: 20px;
|
|
|
- background: rgba(255, 255, 255, 0.7);
|
|
|
- border-radius: 4px 4px 4px 4px;
|
|
|
- position: absolute;
|
|
|
- top: 2px;
|
|
|
- right: 2px;
|
|
|
- line-height: 10px;
|
|
|
-}
|
|
|
-
|
|
|
-.mesBox {
|
|
|
- width: 70vw;
|
|
|
- height: 666px;
|
|
|
- /* margin: 5px 5px; */
|
|
|
- border-radius: 4px;
|
|
|
- background-color: white;
|
|
|
-}
|
|
|
-
|
|
|
-.useBox {
|
|
|
- width: 100%;
|
|
|
- height: 96px;
|
|
|
-}
|
|
|
-
|
|
|
-.tables {
|
|
|
- display: inline-block;
|
|
|
- width: 112px;
|
|
|
- height: 22px;
|
|
|
- border-radius: 4px;
|
|
|
- line-height: 21px;
|
|
|
- text-align: center;
|
|
|
- font-size: 12px;
|
|
|
- margin-left: 5px;
|
|
|
- position: relative;
|
|
|
-}
|
|
|
-
|
|
|
-.tableLis {
|
|
|
- display: inline-block;
|
|
|
- width: 112px;
|
|
|
- height: 22px;
|
|
|
- border-radius: 4px;
|
|
|
- background-color: #EBEFF6;
|
|
|
- line-height: 21px;
|
|
|
- text-align: center;
|
|
|
- font-size: 12px;
|
|
|
- margin-left: 5px;
|
|
|
- position: relative;
|
|
|
-}
|
|
|
-
|
|
|
-.manyUse {
|
|
|
- width: 100%;
|
|
|
- height: 48px;
|
|
|
- background-color: white;
|
|
|
- line-height: 48px;
|
|
|
- display: flex;
|
|
|
- justify-content: flex-start;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-
|
|
|
-.el-dropdown-link {
|
|
|
- color: white;
|
|
|
-}
|
|
|
-
|
|
|
-.breadBox {
|
|
|
- width: 100%;
|
|
|
- height: 24px;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- background-color: #D9E0F0;
|
|
|
-}
|
|
|
-
|
|
|
-::v-deep .el-collapse-item__header {
|
|
|
- height: 24px !important;
|
|
|
- background-color: #EBEFF6 !important;
|
|
|
-}
|
|
|
-
|
|
|
-.detailBox {
|
|
|
- width: 100%;
|
|
|
- height: 270px;
|
|
|
-}
|
|
|
-
|
|
|
-::v-deep .el-dialog__header {
|
|
|
- background-color: #ECEFF7;
|
|
|
- margin-right: 0px;
|
|
|
-}
|
|
|
-
|
|
|
-.fileTable {
|
|
|
- position: relative;
|
|
|
-}
|
|
|
-
|
|
|
-.setCli {
|
|
|
- width: 156px;
|
|
|
- height: auto;
|
|
|
- position: absolute;
|
|
|
- top: -70px;
|
|
|
- left: 300px;
|
|
|
- background-color: white;
|
|
|
- border: 1px solid gray;
|
|
|
- border-radius: 4px;
|
|
|
- z-index: 2;
|
|
|
-}
|
|
|
-
|
|
|
-.chooseSet:hover {
|
|
|
- width: 100%;
|
|
|
- height: 40px;
|
|
|
- line-height: 40px;
|
|
|
- background-color: #8693b2;
|
|
|
- color: white;
|
|
|
-}
|
|
|
-</style>
|
liuQiang