Commit 8cc49523 authored by rockyl's avatar rockyl

优化项目列表

parent 71172877
......@@ -7,9 +7,9 @@
import { fetchApi } from "./common"
import { getCookie } from './utils'
export async function fetchAll(currentPage, pageSize, onlyMine) {
export async function fetchAll(keyword, currentPage, pageSize, onlyMine) {
return await fetchApi('/api/project/query', {
params: { currentPage, pageSize, isAll: onlyMine ? 0 : 1 },
params: {name: keyword, currentPage, pageSize, isAll: onlyMine ? 0 : 1 },
errMessage: 'Failed to fetch projects',
})
}
......
......@@ -6,10 +6,10 @@ export let API_HOST;
if (process.env.NODE_ENV === 'development') {
//API_HOST = '//10.10.95.74:7777';
//API_HOST = '//192.168.1.16:7777';
//API_HOST = '//10.10.92.100:7777';
API_HOST = '//10.10.92.100:7777';
//API_HOST = '//192.168.0.105:7777';
//API_HOST = '//localhost:3002';
API_HOST = window.__data.apiHost;
//API_HOST = window.__data.apiHost;
//API_HOST = '';
} else {
API_HOST = window.__data.apiHost;
......@@ -23,7 +23,7 @@ export const SSO_VERIFY_PAGE_URL = '/sso/logout';
export const DOCK_POINT_OFFSET = 4;
export const PROJECT_PAGE_SIZE = 20;
export const PROJECT_PAGE_SIZE = 10;
export const HISTORY_PAGE_SIZE = 20;
//文件类型图标 t表示展示缩略图
......
......@@ -21,6 +21,7 @@
"Apply": "应用",
"Props": "属性",
"Behavior": "行为",
"Search": "搜索",
"Only mine": "仅我的",
"Add": "添加",
"Delete": "删除",
......@@ -155,8 +156,8 @@
"Remote Version": "远程版本",
"Confirm to exit the editor": "确定退出编辑器吗?",
"Confirm to publish": "确定发布吗?",
"Are you sure to delete this process?": "确定删除这对应的过程吗",
"Are you sure to delete it's process": "确定删除这对应的过程吗",
"Are you sure to delete this behavior?": "确定删除这个的行为吗",
"Are you sure to delete it's process?": "确定删除行为对应的过程吗",
"Are you sure to delete this asset?": "确定删除这个素材吗",
"Are you sure to combine those assets?": "确定合并这些素材吗",
"Are you sure to delete all assets": "确定删除全部素材吗",
......
......@@ -32,8 +32,8 @@ export const projectsStore = {
},
},
actions: {
async fetchProjects({commit, state}, {currentPage, pageSize, onlyMine}) {
const data = await projectApi.fetchAll(currentPage, pageSize, onlyMine);
async fetchProjects({commit, state}, {keyword, currentPage, pageSize, onlyMine}) {
const data = await projectApi.fetchAll(keyword, currentPage, pageSize, onlyMine);
commit('updateProjects', data);
},
async fetchProject({commit}, projectId) {
......
......@@ -25,8 +25,21 @@
.project-list {
flex: 1;
display: flex;
flex-direction: column;
margin-bottom: 10px;
height: 0;
.filter-bar{
align-self: flex-end;
display: flex;
align-items: center;
}
.table{
flex: 1;
}
}
.project-info {
......@@ -40,6 +53,7 @@
flex: 1;
font-size: 30px;
font-weight: bold;
line-height: 42px;
}
.project-detail {
......@@ -47,6 +61,7 @@
}
.bottom-bar {
height: 32px;
display: flex;
justify-content: space-between;
}
......
......@@ -126,7 +126,7 @@
}
.edit-button {
margin-left: 3px;
}
.delete-button {
......
......@@ -35,8 +35,10 @@
<enabled-setter :target="behavior"/>
<span v-if="!getBehavior(behavior)" class="name-field missing-behavior">{{$t('Missing behavior')}}</span>
<input v-else class="name-field name-input" type="text" v-model="getBehavior(behavior).name" @change="onBehaviorNameChange"></input>
<el-button icon="el-icon-minus" class="delete-button" type="danger" plain circle size="mini"
@click="deleteBehavior(index, trigger.behaviors)"/>
<el-popconfirm class="delete-button" @onConfirm="deleteBehavior(index, trigger.behaviors)" :title="$t('Are you sure to delete this behavior?')">
<el-button slot="reference" icon="el-icon-minus" type="danger" plain circle size="mini"/>
</el-popconfirm>
<el-button icon="el-icon-edit" class="edit-button" type="primary" plain circle size="mini"
@click="editBehavior(behavior, trigger.behaviors)"/>
</div>
......@@ -154,29 +156,23 @@
},
async deleteBehavior(index, behaviors) {
let deleteMeta = false;
let close;
await this.$confirm(this.$t('Are you sure to delete it\'s process'), this.$t('Alert'), {
await this.$confirm(this.$t('Are you sure to delete it\'s process?'), this.$t('Alert'), {
confirmButtonText: this.$t('Delete'),
cancelButtonText: this.$t('Not delete'),
distinguishCancelAndClose: true,
type: 'warning'
}).then(() => {
deleteMeta = true;
this.makeProjectDirty();
}).catch(action => {
if(action === 'close'){
close = true;
}
});
if(!close){
this.deleteBehaviorDirect({
behaviors,
index,
deleteMeta,
})
}
this.deleteBehaviorDirect({
behaviors,
index,
deleteMeta,
})
},
...mapActions([
'modifyActiveView',
......
......@@ -5,72 +5,57 @@
</div>
<main>
<div class="project-list">
<el-table
:data="projects.projects"
:empty-text="$t('No projects')"
height="100%"
>
<el-table-column
:label="$t('Projects')">
<template slot-scope="scope">
<div class="project-info">
<span class="project-name">{{scope.row.name}}</span>
<el-tag size="mini" type="success">{{scope.row.operator}}</el-tag>
<el-tag size="mini" type="warning">{{$timeFormat(scope.row.update_time)}}</el-tag>
</div>
</template>
</el-table-column>
<el-table-column
fixed="right"
width="100">
<template slot="header" slot-scope="scope">
<el-checkbox
v-model="onlyMine"
size="mini">{{$t('Only mine')}}
</el-checkbox>
</template>
<template slot-scope="scope">
<!--<el-button
@click.native.prevent="selectProject(scope.row)"
type="primary" icon="el-icon-edit"
size="mini" plain>
{{$t('Edit')}}
</el-button>-->
<el-dropdown size="small" trigger="click" split-button @click="selectProject(scope.row)"
@command="(command)=>{onMoreMenu(command, scope.row)}">
<i class="el-icon-edit"></i>{{$t('Edit')}}
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="edit" icon="el-icon-edit">{{$t('Edit')}}</el-dropdown-item>
<el-dropdown-item command="history" icon="el-icon-coin">{{$t('History')}}</el-dropdown-item>
<el-dropdown-item command="duplicate" icon="el-icon-document-copy">{{$t('Duplicate')}}</el-dropdown-item>
<el-dropdown-item command="export" icon="icon-download">{{$t('Export')}}</el-dropdown-item>
<el-dropdown-item command="delete" icon="el-icon-delete" v-if="showDeleteButton">{{$t('Delete')}}</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<!--<el-button
@click.native.prevent="selectFromHistory(scope.row)"
icon="el-icon-coin"
size="mini" plain
>{{$t('History')}}</el-button>
<el-button
@click.native.prevent="showDuplicateProjectDialog(scope.row)"
icon="el-icon-document-copy"
size="mini" plain
>{{$t('Duplicate')}}</el-button>
<el-button
@click.native.prevent="exportProject(scope.row)"
icon="icon-download"
size="mini" plain
>{{$t('Export')}}</el-button>
<el-button
v-if="showDeleteButton"
@click.native.prevent="onDeleteProject(scope.row)"
type="danger" icon="el-icon-delete"
size="mini" circle plain>
</el-button>-->
</template>
</el-table-column>
</el-table>
<el-form :inline="true" class="filter-bar" size="mini" @submit.native.prevent>
<el-form-item>
<el-input v-model="searchWord" :placeholder="$t('Search')" @change="search" @clear="search" clearable>
<el-button slot="append" icon="el-icon-search"/>
</el-input>
</el-form-item>
<el-form-item>
<el-checkbox
v-model="onlyMine"
size="mini">{{$t('Only mine')}}
</el-checkbox>
</el-form-item>
</el-form>
<div class="table">
<el-table
:data="projects.projects"
:empty-text="$t('No projects')"
height="100%"
>
<el-table-column label="ID" prop="id" width="140px"></el-table-column>
<el-table-column
:label="$t('Projects')">
<template slot-scope="scope">
<div class="project-info">
<span class="project-name">{{scope.row.name}}</span>
<el-tag size="mini" :type="editor.operator === scope.row.operator ? 'success' : 'info'">{{scope.row.operator}}</el-tag>
<el-tag size="mini" type="warning">{{$timeFormat(scope.row.update_time)}}</el-tag>
</div>
</template>
</el-table-column>
<el-table-column
fixed="right"
width="100">
<template slot-scope="scope">
<el-dropdown size="small" trigger="click" split-button @click="selectProject(scope.row)"
@command="(command)=>{onMoreMenu(command, scope.row)}">
<i class="el-icon-edit"></i>{{$t('Edit')}}
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="edit" icon="el-icon-edit">{{$t('Edit')}}</el-dropdown-item>
<el-dropdown-item command="history" icon="el-icon-coin">{{$t('History')}}</el-dropdown-item>
<el-dropdown-item command="duplicate" icon="el-icon-document-copy">{{$t('Duplicate')}}
</el-dropdown-item>
<el-dropdown-item command="export" icon="icon-download">{{$t('Export')}}</el-dropdown-item>
<el-dropdown-item command="delete" icon="el-icon-delete" v-if="showDeleteButton">{{$t('Delete')}}
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</template>
</el-table-column>
</el-table>
</div>
</div>
<div class="bottom-bar">
<div>
......@@ -99,21 +84,22 @@
import DuplicateProjectDialog from "./Home/DuplicateProjectDialog";
import {PROJECT_PAGE_SIZE} from "../config";
import ProjectHistoryDialog from "./Home/ProjectHistoryDialog";
import ElFormItem from "../components/inputs/form-item";
export default {
name: "Home",
components: {ProjectHistoryDialog, DuplicateProjectDialog, CreateProjectDialog},
components: {ElFormItem, ProjectHistoryDialog, DuplicateProjectDialog, CreateProjectDialog},
data() {
return {
appVersion: 'v1.0.0',
currentPage: 1,
pageSize: PROJECT_PAGE_SIZE,
searchWord: '',
onlyMine: true,
}
},
mounted() {
playWaiting(this.prepare(), this.$t('Preparing')).catch(e => {
});
playWaiting(this.prepare(), this.$t('Preparing')).catch(e => {});
},
computed: {
showDeleteButton() {
......@@ -150,7 +136,7 @@
)
});
},
async onMoreMenu(command, project){
async onMoreMenu(command, project) {
switch (command) {
case 'edit':
this.selectProject(project);
......@@ -208,13 +194,17 @@
editProject(projectID) {
this.$router.push({name: 'editor', params: {projectID}});
},
async search() {
this.handleCurrentChange(1);
},
async handleCurrentChange(page) {
const loading = this.$loading({
lock: true,
text: this.$t('In processing'),
});
this.currentPage = page;
await this.fetchProjects({currentPage: page, pageSize: this.pageSize, onlyMine: this.onlyMine});
let keyword = this.searchWord;
await this.fetchProjects({keyword, currentPage: page, pageSize: this.pageSize, onlyMine: this.onlyMine});
loading.close();
},
...mapActions([
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment