update gui

Author: lindongchen

gui/apps/ztm/cloud/service/FileService.js

@@ -109,8 +109,8 @@ export default class FileService {
 
 	unpublish(path, callback) {
 		confirm.custom({
-				message: `Are you sure you want to unpublish this file from the mesh?`,
-				header: 'Unpublish',
+				message: `Are you sure you want to take down this file from the mesh?`,
+				header: 'Take Down',
 				rejectProps: {
 						label: 'Close',
 						severity: 'secondary',
@@ -140,7 +140,7 @@ export default class FileService {
 	localDelete(path, ep , callback) {
 		confirm.custom({
 				message: `Are you sure to delete local source of the file?`,
-				header: 'Delete Local Source',
+				header: 'Delete Local File',
 				rejectProps: {
 						label: 'Close',
 						severity: 'secondary',

gui/apps/ztm/cloud/views/Config.vue

@@ -384,10 +384,10 @@ const actions = computed(()=>{
 	_actions.push({separator: true});
 	if(isMyFolder.value && !!props.file?.state &&  props.file?.state != 'new'){
 		_actions.push({
-			label: 'Unpublish',
+			label: 'Take Down',
 			class:'opacity-80',
 			icon: 'pi pi-trash',
-			loading: unpublishLoading.value,
+			loading: false,
 			command(e){
 				unpublishLoading.value = true;
 				fileService.unpublish(props.file?.path,(reject)=>{
@@ -399,10 +399,10 @@ const actions = computed(()=>{
 		})
 	}
 	_actions.push({
-		label: 'Local Delete',
+		label: 'Delete Local File',
 		class:'opacity-80',
 		icon: 'pi pi-trash',
-		loading: deleteLoading.value,
+		loading: false,
 		command(e){
 			deleteLoading.value = true;
 			fileService.localDelete(props.file?.path,info.value?.endpoint?.id,(reject)=>{
@@ -508,7 +508,7 @@ onMounted(()=>{
 			<div class="pt-4 pb-2">
 				<b>Users permission:</b>
 			</div>
-			<Listbox v-if="props.file.access?.users" :options="Object.keys(props.file.access.users)" class="w-full md:w-56" listStyle="max-height:250px">
+			<Listbox v-if="props.file.access?.users" :options="Object.keys(props.file.access.users)" class="w-full md:w-56 noborder noshadow" listStyle="max-height:250px">
 				<template #option="slotProps">
 						<div class="flex w-full">
 							<div class="flex-item pt-1">
@@ -524,10 +524,10 @@ onMounted(()=>{
 						</div>
 				</template>
 				<template #empty>
-					---
+					<span></span>
 				</template>
 				<template #footer>
-					<div class="flex items-center pt-1 pb-2 px-3">
+					<div class="flex items-center pt-1 pb-2 ">
 						<div class="flex-item pr-1">
 							<Select size="small" class="w-full"  v-model="acl.user" :options="filterEps(props.file.access.users)" optionLabel="username" optionValue="username" :filter="filterEps(props.file.access.users).length>8" placeholder="Endpoint"/>
 						</div>
@@ -548,9 +548,9 @@ onMounted(()=>{
 			</template>
 			<div class="p-3">
 				<Loading v-if="mirrorLoading" />
-				<Listbox v-else :options="filterMirrors" class="w-full md:w-56" listStyle="max-height:250px">
+				<Listbox v-else :options="filterMirrors" class="w-full md:w-56 noborder noshadow" listStyle="max-height:250px">
 					<template #option="slotProps">
-							<div class="flex items-center pt-1 pb-2 px-0 w-full">
+							<div class="flex items-center px-0 w-full">
 								<div class="flex-item pr-2 py-2">
 									<Tag>{{slotProps.option.ep?.name}}</Tag>
 									<Tag v-if="info?.endpoint?.id == slotProps.option?.ep?.id" value="Local" class="ml-2" severity="contrast"/> 
@@ -570,10 +570,10 @@ onMounted(()=>{
 							</div>
 					</template>
 					<template #empty>
-						------
+					<span></span>
 					</template>
 					<template #footer>
-						<div class="flex items-center pt-1 pb-2 px-3">
+						<div class="flex items-center pt-1 pb-2">
 							<div class="flex-item pr-1">
 								<Select size="small" class="w-full"  v-model="mirror.user" :options="filterUnMirrorEps" optionLabel="name" optionValue="id" :filter="filterUnMirrorEps.length>8" placeholder="Endpoint">
 									<template #option="slotProps">

gui/src/assets/styles.scss

@@ -1300,6 +1300,9 @@ fieldset{
 .noborder{
 	border: none !important;
 }
+.noshadow{
+	box-shadow: none !important;
+}
 .noclose .p-dialog-header-actions{
 	width: 30px;
 }
@@ -1308,4 +1311,9 @@ fieldset{
 }
 .smheader .p-dialog-header{
 	padding: 1rem;
-}
+}
+.noborder{
+	.p-listbox-option,.p-listbox-list{
+		padding: 0 !important;
+	}
+} 

gui/src/directives/longtap.js

@@ -22,6 +22,7 @@ export default {
     // 阻止右键菜单
     const preventContextMenu = (event) => {
       event.preventDefault();
+			binding.value(event);
     };
 
     el._start = start;

gui/src/utils/file.js

@@ -177,7 +177,7 @@ const bitUnit = (value)=> {
 	} else if(value>1024){
 		return (value/1024).toFixed(0) + "KB";
 	} else {
-		return value*1 + "B";
+		return (value*1).toFixed(0) + "B";
 	}
 }
 const openFile = (path) => {