VersionEntry Updated

This commit is contained in:
Terry 2021-05-06 14:22:26 +02:00
parent ac5e55673a
commit aeddbb6869
8 changed files with 20886 additions and 28413 deletions

View File

@ -31,6 +31,7 @@
</div>
<Actions v-if="$slots['default']" menu-align="right" class="sharing-entry__actions">
<slot />
v
</Actions>
</li>
</template>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -19,69 +19,100 @@
-->
<template>
<ListItemIcon class="version-entry"
icon="icon-text"
title="10 days ago"
subtitle="< 1KB">
<Actions>
<ActionButton icon="icon-edit" @click="alert('Edit')">
{{ version.timestamp }}Restore
</ActionButton>
<ActionButton icon="icon-delete" @click="alert('Delete')">
Download
</ActionButton>
</Actions>
</ListItemIcon>
<ul>
<ListItemIcon
:title="version.lastmod"
:subtitle="version.size">
<Actions
menu-align="right"
class="version-entry__actions">
<ActionButton icon="icon-history" @click="alert('Edit')">
{{ t('files_versions','Restore') }}
</ActionButton>
</Actions>
</ListItemIcon>
</ul>
</template>
<script>
import Avatar from '@nextcloud/vue/dist/Components/Avatar'
import Actions from '@nextcloud/vue/dist/Components/Actions'
import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip'
import ListItemIcon from '@nextcloud/vue/dist/Components/ListItemIcon'
import moment from '@nextcloud/moment'
export default {
name: 'VersionEntry',
components: {
Actions,
ListItemIcon
ListItemIcon,
Avatar,
},
directives: {
Tooltip,
},
props: {
versions: {
props: {
fileInfo: {
type: Object,
required: true,
},
version: {
type: Object,
required: true,
},
},
data() {
return {
iconUrl,
version: {},
moment,
}
},
computed: {
iconUrl() {
return OC.MimeType.getIconUrl(this.MimeType)
console.log(iconUrl)
},
relativeDate() {
return (timestamp) => {
const diff = moment(this.$root.time).diff(moment(timestamp))
if (diff >= 0 && diff < 45000) {
return t('core', 'seconds ago')
}
return moment(timestamp).fromNow()
}
},
},
}
</script>
<style lang="scss" scoped>
.version-entry {
display: flex;
align-items: center;
min-height: 44px;
&__desc {
padding: 8px;
line-height: 1.2em;
position: relative;
flex: 1 1;
min-width: 0;
h5 {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
max-width: inherit;
<style lang="scss" scoped>
.version-entry {
display: flex;
align-items: center;
min-height: 44px;
&__desc {
padding: 8px;
line-height: 1.2em;
position: relative;
flex: 1 1;
min-width: 0;
h5 {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
max-width: inherit;
}
p {
color: var(--color-text-maxcontrast);
}
}
p {
color: var(--color-text-maxcontrast);
&__actions {
margin-left: auto !important;
}
}
&__actions {
margin-left: auto !important;
}
}
</style>
</style>

View File

@ -0,0 +1,116 @@
<!--
- @copyright Copyright (c) 2019 John Molakvoæ <skjnldsv@protonmail.com>
-
- @author
-
- @license GNU AGPL version 3 or any later version
-
- This program is free software: you can redistribute it and/or modify
- it under the terms of the GNU Affero General Public License as
- published by the Free Software Foundation, either version 3 of the
- License, or (at your option) any later version.
-
- This program is distributed in the hope that it will be useful,
- but WITHOUT ANY WARRANTY; without even the implied warranty of
- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- GNU Affero General Public License for more details.
-
- You should have received a copy of the GNU Affero General Public License
- along with this program. If not, see <http://www.gnu.org/licenses/>.
-
-->
<template>
<li class="version-entry">
<Avatar class="version-entry__avatar"
:url="iconUrl" />
<ListItemIcon v-for="version in versions"
class="version-entry"
:title="version"
subtitle="< 1KB">
<Actions
menu-align="right"
class="version-entry__actions">
<ActionButton icon="icon-edit" @click="alert('Edit')">
{{ t('files_versions','Restore') }}
</ActionButton>
</Actions>
</ListItemIcon>
</li>
</template>
<script>
import Avatar from '@nextcloud/vue/dist/Components/Avatar'
import Actions from '@nextcloud/vue/dist/Components/Actions'
import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip'
import ListItemIcon from '@nextcloud/vue/dist/Components/ListItemIcon'
import SharesMixin from '../mixins/SharesMixin'
export default {
name: 'VersionListing',
components: {
Actions,
ActionButton,
ActionCheckbox,
ActionInput,
ActionTextEditable,
Avatar,
ListItemIcon,
},
directives: {
Tooltip,
},
props: {
_fileInfo: {
type: Object,
required: true,
},
versions: {
type: Object,
required: true,
},
},
data() {
return {
}
},
computed: {
iconUrl() {
return OC.MimeType.getIconUrl(this.MimeType)
console.log(iconUrl)
},
},
}
</script>
<style lang="scss" scoped>
.version-entry {
display: flex;
align-items: center;
height: 44px;
&__desc {
display: flex;
flex-direction: column;
justify-content: space-between;
padding: 8px;
line-height: 1.2em;
p {
color: var(--color-text-maxcontrast);
}
&-unique {
color: var(--color-text-maxcontrast);
}
}
&__actions {
margin-left: auto;
}
}
</style>

View File

@ -20,10 +20,10 @@
*
*/
import './versionmodel';
import './versioncollection';
import './versionstabview';
import './filesplugin';
import './css/versions.css';
import './versionmodel'
import './versioncollection'
import './versionstabview'
import './filesplugin'
import './css/versions.css'
window.OCA.Versions = OCA.Versions;
window.OCA.Versions = OCA.Versions

View File

@ -21,14 +21,12 @@
import client from './DavClient'
import { genFileInfo } from '../utils/fileUtils'
import { getCurrentUser } from '@nextcloud/auth'
let FileVersion = async function(fileId) {
const FileVersion = async function(fileId) {
// init params
const VersionsUrl = '/versions/' + fileId
const response = await client.getDirectoryContents(VersionsUrl,{
const response = await client.getDirectoryContents(VersionsUrl, {
data: `<?xml version="1.0"?>
<d:propfind xmlns:d="DAV:" xmlns:oc="http://owncloud.org/ns">
<d:prop>
@ -39,11 +37,12 @@ let FileVersion = async function(fileId) {
</d:propfind>`,
details: true,
})
console.log(response);
/** return response.data.map(FileVersion); */
return response.data
};
return response.data.map(genFileInfo)
}
/**
* Retrieve the files list
*
@ -51,4 +50,4 @@ let FileVersion = async function(fileId) {
* @param {Object} [options] optional options for axios
* @returns {Array} the file list
*/
export default FileVersion;
export default FileVersion

View File

@ -27,74 +27,71 @@
<div class="icon icon-error" />
<h2>{{ error }}</h2>
</div>
<template>
<!-- Version information -->
<!-- <VersionEntry :versions="versionsList" /> -->
{{versionsList}}
</template>
</div>
</template>
<ul>
<!-- Version information -->
<VersionEntry v-for="version in versionsList" :file-info="_fileInfo" :version="version" />
</ul>
</div>
</template>
<script>
<script>
import { ListItemIcon } from '@nextcloud/vue'
import VersionEntry from '../components/VersionEntry'
import fetchFileVersions from "../services/FileVersion";
import VersionEntry from '../components/VersionEntry'
import fetchFileVersions from '../services/FileVersion'
export default {
name: 'VersionTab',
export default {
name: 'VersionTab',
components: {
ListItemIcon,
VersionEntry,
},
components: {
VersionEntry,
},
data() {
return {
error: '',
loading: true,
client: null,
_fileInfo: null,
data() {
return {
error: '',
loading: true,
client: null,
_fileInfo: null,
// version object
versionsList: [],
}
},
methods: {
setFileInfo(fileInfo) {
this._fileInfo = fileInfo
},
getFileInfo() {
return this._fileInfo
},
setClient(client) {
this._client = client
},
/**
* Update current fileInfo and fetch new data
* @param {Object} fileInfo the current file FileInfo
*/
async update(fileInfo) {
this._fileInfo = fileInfo
/** name = this._fileInfo.get('name') */
},
async getVersions() {
try {
this.loading = true
const fetchVersions = await fetchFileVersions(this._fileInfo.get('id'));
this.versionsList = fetchVersions;
}
catch(e){
console.log(error);
}
this.loading = false
}
},
mounted() {
// version object
versionsList: [],
}
},
mounted() {
this.getVersions()
}
}
</script>
},
methods: {
setFileInfo(fileInfo) {
this._fileInfo = fileInfo
},
getFileInfo() {
return this._fileInfo
},
setClient(client) {
this._client = client
},
/**
* Update current fileInfo and fetch new data
* @param {Object} fileInfo the current file FileInfo
*/
async update(fileInfo) {
this._fileInfo = fileInfo
/** name = this._fileInfo.get('name') */
},
async getVersions() {
try {
this.loading = true
const fetchVersions = await fetchFileVersions(this._fileInfo.get('id'))
this.versionsList = fetchVersions
console.log(fetchVersions)
} catch (e) {
console.log(error)
}
this.loading = false
},
},
}
</script>