smart-web.git - Gitblit

			@@ -1,19 +1,158 @@
			<!--
			* @Date: 2024-05-16 22:40:01
			* @LastEditors: Sneed
			* @LastEditTime: 2024-05-16 22:40:07
			* @LastEditTime: 2024-05-18 21:35:42
			* @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/dnc/document/index.vue
			-->
			<template>
			<div>
			我的文档
			</div>
			<el-main style="height: 100%;">
			<el-card shadow="never" style="height: 100%;" body-style="height: 100%">
			<el-container>
			<el-aside width="200px">
			<el-container>
			<el-main>
			<el-tree default-expand-all ref="group" node-key="id" :data="treeData" :props="{
			label: 'name',
			}" @node-click="nodeClick" highlight-current :current-node-key="selectNode.id">
			<template #default="{ node, data }">
			<span :class="data.isGroup ? 'active' : ''" class="custom-tree-node">
			<span>{{
			node.label \|\| data.code }}</span>
			</span>
			</template>
			</el-tree>
			</el-main>
			<!-- <el-footer>
			<el-button type="primary" round @click="addFolder">新增文件夹</el-button>
			</el-footer> -->
			</el-container>
			</el-aside>
			<el-container>
			<el-header>
			<el-button type="">返回上一级</el-button>
			<el-dropdown style="margin-left: 8px;">
			<el-button type="primary">
			新建<el-icon class="el-icon--right"><el-icon-arrow-down /></el-icon>
			</el-button>
			<template #dropdown>
			<el-dropdown-menu>
			<el-dropdown-item @click="addFolder">文件夹</el-dropdown-item>
			<el-dropdown-item>文件</el-dropdown-item>
			</el-dropdown-menu>
			</template>
			</el-dropdown>
			<el-button type="primary" style="margin-left: 8px;">上传文件</el-button>
			<el-dropdown style="margin-left: 8px;">
			<el-button type="primary">
			更多操作<el-icon class="el-icon--right"><el-icon-arrow-down /></el-icon>
			</el-button>
			<template #dropdown>
			<el-dropdown-menu>
			<el-dropdown-item>复制</el-dropdown-item>
			<el-dropdown-item>移动</el-dropdown-item>
			</el-dropdown-menu>
			</template>
			</el-dropdown>
			<el-button style="margin-left: 8px;" type="danger" plain>删除</el-button>
			<el-button-group style="margin-left: auto;">
			<el-button type="primary">
			<el-icon>
			<el-icon-fold />
			</el-icon>
			</el-button>
			<el-button type="primary">
			<el-icon>
			<el-icon-grid />
			</el-icon>
			</el-button>
			</el-button-group>
			<el-input v-model="input3" style="margin-left: 8px;max-width: 240px" placeholder="请输入关键词"
			class="input-with-select">
			<template #append>
			<el-button type="primary" class="header-search" @click="search">
			<el-icon>
			<el-icon-search />
			</el-icon>
			</el-button>

			</template>
			</el-input>
			</el-header>
			</el-container>
			</el-container>
			</el-card>
			<el-dialog v-model="visible" title="新建文件夹" width="500">
			<el-form :model="form" :rules="rules" ref="dialogForm" label-width="120px" label-position="center">
			<el-form-item label="文件夹名称" prop="name">
			<el-input v-model="form.name" />
			</el-form-item>
			</el-form>
			<template #footer>
			<div class="dialog-footer">
			<el-button type="primary" @click="saveFolder">
			确定
			</el-button>
			</div>
			</template>
			</el-dialog>
			</el-main>
			</template>

			<script>
			export default {

			data() {
			return {
			treeData: [],
			selectNode: {},
			visible: false,
			form: {},
			rules: {
			name: [{
			required: true, message: '必填'
			}]
			}
			}
			},
			created() {
			this.init()
			},
			methods: {
			init() {
			this.$HTTP.get(`/api/blade-dnc/folder/folder-tree`).then(res => {
			this.treeData = [{
			group: true,
			id: 0,
			name: '我的文档',
			children: res.data
			}]
			this.selectNode = {
			group: true,
			id: 0,
			name: '我的文档',
			}
			})
			},
			nodeClick(node) {
			this.selectNode = node
			},
			search() {
			alert(1)
			},
			// 新增文件夹
			addFolder() {
			this.visible = true
			this.form = {}
			},
			saveFolder() {
			console.log(this.form)
			this.$HTTP
			}
			}
			}
			</script>

			<style lang="scss" scoped></style>
			<style lang="scss" scoped>
			.header-search {
			cursor: pointer;
			}
			</style>