|
|
@@ -2,24 +2,32 @@
|
|
|
<div class="flex flex-col white-bg">
|
|
|
<div class="flex flex-center ml-20 mb-20 mt-10">
|
|
|
<div class="flex flex-center" style="flex: 3">
|
|
|
- <span class="grey-6 font-18 bold nowrap mr-10">搜索</span>
|
|
|
- <el-input
|
|
|
- v-model="keyWords"
|
|
|
+ <span class="grey-6 bold nowrap mr-10">文件搜索</span>
|
|
|
+ <el-select
|
|
|
+ v-model="keyWords" remote filterable clearable
|
|
|
placeholder="输入关键字"
|
|
|
- prefix-icon="Search"
|
|
|
- size="large"
|
|
|
+ :remote-method="remoteMethod"
|
|
|
+ :loading="loading"
|
|
|
style="width: 100%"
|
|
|
- />
|
|
|
+ @change="result"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in findData"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
</div>
|
|
|
- <div class="flex flex-center ml-10" style="flex: 1">
|
|
|
- <base-button icon="Delete" title="清空" type="0" @click="clear"/>
|
|
|
- <base-button class="ml-10" @click="getFolderList"/>
|
|
|
+ <div class="flex flex-center ml-10" style="flex: 0.01">
|
|
|
+ <!-- <base-button icon="Delete" title="清空" type="0" @click="clear"/>-->
|
|
|
+ <!-- <base-button class="ml-10" @click="filesFind"/>-->
|
|
|
</div>
|
|
|
</div>
|
|
|
<div style="background-color: #E4E4E4;height: 10px;width: 100%;margin-left: -10px"></div>
|
|
|
<!------tab------>
|
|
|
<div class="flex flex-center mt-15">
|
|
|
- <div class="flex flex-center" style="flex: 3.9">
|
|
|
+ <div class="flex flex-center" style="flex: 3.8">
|
|
|
<div v-for="(item,index) in folderType" :key='item.id' class="flex flex-center tab">
|
|
|
<el-badge :value='item.fileChildrenNumber' :hidden='item.fileChildrenNumber === 0'>
|
|
|
<div :class="active === index ? 'tab-active' : ''"
|
|
|
@@ -72,6 +80,11 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
+ <el-image-viewer
|
|
|
+ v-if='showImage'
|
|
|
+ :url-list="imgList"
|
|
|
+ @close='viewerClose'
|
|
|
+ />
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -107,6 +120,9 @@ export default {
|
|
|
},
|
|
|
data () {
|
|
|
return {
|
|
|
+ loading: false,
|
|
|
+ showImage: false,
|
|
|
+ imgList: [],
|
|
|
addShow: false,
|
|
|
folderInfo: {
|
|
|
title: '',
|
|
|
@@ -124,9 +140,13 @@ export default {
|
|
|
page: {
|
|
|
current: 1,
|
|
|
size: 10
|
|
|
- }
|
|
|
+ },
|
|
|
+ findData: []
|
|
|
}
|
|
|
},
|
|
|
+ created () {
|
|
|
+ this.getFolderList()
|
|
|
+ },
|
|
|
methods: {
|
|
|
getDict () {
|
|
|
this.$api.project.folderType({ projectStageId: this.projectStageId }).then(res => {
|
|
|
@@ -158,6 +178,46 @@ export default {
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
+ remoteMethod (query) {
|
|
|
+ if (query !== '') {
|
|
|
+ this.loading = true
|
|
|
+ setTimeout(() => {
|
|
|
+ const data = {
|
|
|
+ projectId: this.id,
|
|
|
+ keyWord: this.keyWords
|
|
|
+ }
|
|
|
+ this.$api.project.findFiles(Object.assign(data, this.page)).then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.findData = res.data.records.map(sub => {
|
|
|
+ const dataItem = {}
|
|
|
+ dataItem.label = sub.title
|
|
|
+ if (['png', 'jpg', 'jpeg'].includes(sub.suffix)) {
|
|
|
+ dataItem.value = sub.url
|
|
|
+ } else {
|
|
|
+ dataItem.value = sub.fileId
|
|
|
+ }
|
|
|
+ return dataItem
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
+ }, 200)
|
|
|
+ } else {
|
|
|
+ this.findData = []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ result (res) {
|
|
|
+ if (res.indexOf('http') > -1) {
|
|
|
+ this.showImage = true
|
|
|
+ this.imgList.push(res)
|
|
|
+ } else {
|
|
|
+ this.$router.push('/home/file_detail?id=' + res)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ viewerClose () {
|
|
|
+ this.showImage = false
|
|
|
+ this.imgList = []
|
|
|
+ },
|
|
|
folderAdd () {
|
|
|
this.folderInfo.projectId = this.id
|
|
|
this.folderInfo.projectStageId = this.projectStageId
|
|
|
@@ -173,6 +233,7 @@ export default {
|
|
|
})
|
|
|
},
|
|
|
changePage (page) {
|
|
|
+ console.log(page)
|
|
|
this.page.current = page
|
|
|
this.getFolderList()
|
|
|
}
|