ui fix for add column
This commit is contained in:
@@ -10,6 +10,10 @@
|
||||
<!-- <q-badge color="secondary" text-color="white" align="middle" class="q-mb-xs" label="他人の所有" /> -->
|
||||
<q-chip v-if="!isOwnerFunc(item.owner.id)" square color="secondary" text-color="white" icon="people" label="他人の所有" size="sm" />
|
||||
<q-chip v-else square color="purple" text-color="white" icon="people" label="自分" size="sm" />
|
||||
<div class="text-right">
|
||||
<!-- icon="add_moderator" -->
|
||||
<!-- <q-chip square color="primary" text-color="white" label="管理者" size="sm" /> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -20,7 +20,6 @@
|
||||
</q-td>
|
||||
</template>
|
||||
|
||||
|
||||
</q-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -30,14 +30,20 @@
|
||||
</template>
|
||||
<template v-slot:body-cell-version="p">
|
||||
<q-td :props="p">
|
||||
<div class="flex justify-between">
|
||||
<span>{{ p.row.version }}</span>
|
||||
<div class="flex justify-between full-width" >
|
||||
<span class="ellipsis" :title="p.row.versionName">{{ p.row.versionName || '未命名' }}</span>
|
||||
<q-badge v-if="isVersionEditing(p.row)" color="orange-7">変更あり</q-badge>
|
||||
</div>
|
||||
</q-td>
|
||||
</template>
|
||||
<template v-slot:body-cell-updateUser="p">
|
||||
<q-td auto-width :props="p">
|
||||
<q-badge v-if="p.row.updateUser.id == Number(authStore.userId)" color="purple">自分</q-badge>
|
||||
<span v-else>{{ p.row.updateUser.fullName }}</span>
|
||||
</q-td>
|
||||
</template>
|
||||
<template v-slot:body-cell-actions="p">
|
||||
<q-td :props="p">
|
||||
<q-td auto-width :props="p">
|
||||
<table-action-menu :row="p.row" minWidth="180px" max-width="200px" :actions="actionList" />
|
||||
</q-td>
|
||||
</template>
|
||||
@@ -73,6 +79,7 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, computed } from 'vue';
|
||||
import { useAppStore } from 'stores/useAppStore';
|
||||
import { useAuthStore } from 'stores/useAuthStore';
|
||||
import { useFlowEditorStore } from 'stores/flowEditor';
|
||||
import { router } from 'src/router';
|
||||
import { IAppDisplay } from 'src/types/AppTypes';
|
||||
@@ -81,15 +88,16 @@ import AppSelectBox from 'src/components/AppSelectBox.vue';
|
||||
import TableActionMenu from 'components/TableActionMenu.vue';
|
||||
|
||||
const appStore = useAppStore();
|
||||
const authStore = useAuthStore();
|
||||
const numberStringSorting = (a: string, b: string) => parseInt(a, 10) - parseInt(b, 10);
|
||||
|
||||
const columns = [
|
||||
{ name: 'id', label: 'アプリID', field: 'id', align: 'left', sortable: true, sort: numberStringSorting },
|
||||
{ name: 'name', label: 'アプリ名', field: 'name', align: 'left', sortable: true },
|
||||
{ name: 'url', label: 'URL', field: 'url', align: 'left', sortable: true },
|
||||
{ name: 'updateUser', label: '最後更新者', field: (row: IAppDisplay) => row.updateUser.fullName, align: 'left', sortable: true},
|
||||
{ name: 'updateUser', label: '最後更新者', field: '', align: 'left', sortable: true},
|
||||
{ name: 'updateTime', label: '最後更新日', field: 'updateTime', align: 'left', sortable: true},
|
||||
{ name: 'version', label: 'バージョン', field: 'version', align: 'left', sortable: true, sort: numberStringSorting },
|
||||
{ name: 'version', label: 'バージョン', field: '', align: 'left', sortable: true, style: 'max-width: 200px;',sort: numberStringSorting },
|
||||
{ name: 'actions', label: '', field: 'actions' }
|
||||
];
|
||||
|
||||
@@ -164,7 +172,9 @@ const deleteApp = async () => {
|
||||
}
|
||||
|
||||
async function toVersionHistoryPage(app:IAppDisplay) {
|
||||
await router.push('/app/version/' + app.id);
|
||||
await router.push('/app/version/' + app.id).catch(err => {
|
||||
console.error(err);
|
||||
});
|
||||
}
|
||||
|
||||
async function toEditFlowPage(app:IAppDisplay) {
|
||||
@@ -173,6 +183,8 @@ async function toEditFlowPage(app:IAppDisplay) {
|
||||
name: app.name
|
||||
});
|
||||
store.selectFlow(undefined);
|
||||
await router.push('/FlowChart/' + app.id);
|
||||
await router.push('/FlowChart/' + app.id).catch(err => {
|
||||
console.error(err);
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -40,11 +40,17 @@
|
||||
</template>
|
||||
<template v-slot:body-cell-comment="p">
|
||||
<q-td :props="p">
|
||||
<q-scroll-area class="description-cell">
|
||||
<q-scroll-area class="multiline-cell">
|
||||
<div v-html="p.row['comment']"></div>
|
||||
</q-scroll-area>
|
||||
</q-td>
|
||||
</template>
|
||||
<template v-slot:body-cell-creator="p">
|
||||
<q-td auto-width :props="p">
|
||||
<q-badge v-if="p.row.creator.id == Number(authStore.userId)" color="purple">自分</q-badge>
|
||||
<span v-else>{{ p.row.creator.fullName }}</span>
|
||||
</q-td>
|
||||
</template>
|
||||
<template v-slot:body-cell-actions="p">
|
||||
<q-td :props="p">
|
||||
<table-action-menu :row="p.row" minWidth="140px" :actions="actionList" />
|
||||
@@ -83,12 +89,14 @@
|
||||
import { useQuasar } from 'quasar';
|
||||
import { ref, onMounted } from 'vue';
|
||||
import { useAppStore } from 'stores/useAppStore';
|
||||
import { useAuthStore } from 'stores/useAuthStore';
|
||||
import { useFlowEditorStore } from 'stores/flowEditor';
|
||||
import { router } from 'src/router';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { IAppDisplay, IAppVersionDisplay } from 'src/types/AppTypes';
|
||||
import TableActionMenu from 'components/TableActionMenu.vue';
|
||||
|
||||
const authStore = useAuthStore();
|
||||
const appStore = useAppStore();
|
||||
const route = useRoute()
|
||||
|
||||
@@ -101,8 +109,8 @@ const columns = [
|
||||
{ name: 'id', label: 'バージョン番号', field: 'version', align: 'left', sortable: true },
|
||||
{ name: 'name', label: 'バージョン名', field: 'name', align: 'left', sortable: true },
|
||||
{ name: 'comment', label: 'コメント', field: 'comment', align: 'left', sortable: true },
|
||||
// { name: 'creator', label: '作成者', field: (row: IVersionDisplay) => row.creator.fullName, align: 'left', sortable: true },
|
||||
// { name: 'createTime', label: '作成日時', field: 'createTime', align: 'left', sortable: true },
|
||||
{ name: 'creator', label: '作成者', field: '', align: 'left', sortable: true },
|
||||
{ name: 'createTime', label: '作成日時', field: 'createTime', align: 'left', sortable: true },
|
||||
// { name: 'updater', label: '更新者', field: (row: IVersionDisplay) => row.updater.fullName, align: 'left', sortable: true },
|
||||
// { name: 'updateTime', label: '更新日時', field: 'updateTime', align: 'left', sortable: true },
|
||||
{ name: 'actions', label: '', field: 'actions' }
|
||||
@@ -149,6 +157,7 @@ function isVersionEditing() {
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
versionLoading.value = true;
|
||||
let isSuccess = getAppById();
|
||||
if (!isSuccess) {
|
||||
await getApps();
|
||||
@@ -201,10 +210,10 @@ async function toEditFlowPage() {
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.description-cell {
|
||||
height: 30px;
|
||||
.multiline-cell {
|
||||
height: 45px;
|
||||
min-width: 300px;
|
||||
max-height: 30px;
|
||||
max-height: 45px;
|
||||
white-space: break-spaces;
|
||||
|
||||
.q-scrollarea__content {
|
||||
|
||||
@@ -81,10 +81,10 @@ function versionToVersionDisplay(item: IAppVersion) {
|
||||
appid: item.appid,
|
||||
name: item.versionname,
|
||||
comment: item.comment,
|
||||
// updater: toUserDisplay(item.updateuser),
|
||||
// updateTime: formatDate(item.updatetime),
|
||||
// creator: toUserDisplay(item.createuser),
|
||||
// createTime: formatDate(item.createtime),
|
||||
updater: userToUserDisplay(item.updateuser),
|
||||
updateTime: formatDate(item.update_time),
|
||||
creator: userToUserDisplay(item.createuser),
|
||||
createTime: formatDate(item.create_time),
|
||||
} as IAppVersionDisplay;
|
||||
}
|
||||
|
||||
@@ -95,11 +95,16 @@ function appToAppDisplay(app: IManagedApp) {
|
||||
name: app.appname,
|
||||
url: `${app.domainurl}/k/${app.appid}`,
|
||||
version: app.version,
|
||||
updateTime: date.formatDate(app.update_time, 'YYYY/MM/DD HH:mm'),
|
||||
versionName: app.versionname,
|
||||
updateTime: formatDate(app.update_time),
|
||||
updateUser: userToUserDisplay(app.updateuser)
|
||||
} as IAppDisplay
|
||||
}
|
||||
|
||||
function formatDate(data: string) {
|
||||
return date.formatDate(data, 'YYYY/MM/DD HH:mm');
|
||||
}
|
||||
|
||||
function userToUserDisplay(user: IUser) {
|
||||
return {
|
||||
id: user.id,
|
||||
|
||||
@@ -5,6 +5,7 @@ export interface IManagedApp {
|
||||
appname: string;
|
||||
domainurl: string;
|
||||
version: number;
|
||||
versionname?: string;
|
||||
user: IUser;
|
||||
updateuser: IUser;
|
||||
create_time: string;
|
||||
@@ -19,6 +20,7 @@ export interface IAppDisplay{
|
||||
updateUser: IUserDisplay;
|
||||
updateTime:string;
|
||||
version:number;
|
||||
versionName?: string;
|
||||
}
|
||||
|
||||
export interface IVersionSubmit {
|
||||
@@ -33,10 +35,10 @@ export interface IAppVersion {
|
||||
appid: string;
|
||||
versionname: string
|
||||
comment: string;
|
||||
updater: IUserDisplay;
|
||||
updateTime: string;
|
||||
creator: IUserDisplay;
|
||||
createTime: string;
|
||||
updateuser: IUser;
|
||||
update_time: string;
|
||||
createuser: IUser;
|
||||
create_time: string;
|
||||
}
|
||||
|
||||
export interface IAppVersionDisplay {
|
||||
|
||||
Reference in New Issue
Block a user