github/dootask
1
0
Fork 0
mirror of https://github.com/kuaifan/dootask.git synced 2025-12-13 20:12:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

perf: 优化搜索组件

Browse Source
This commit is contained in:
kuaifan 2025-03-18 18:36:20 +08:00
parent 378e270f41
commit c64c436b9f
10 changed files with 125 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
resources/assets/js/components/SearchButton.vue Normal file
View File

@ -0,0 +1,52 @@
<template>
<div v-if="windowTouch">
<Button :loading="loading" type="primary" icon="ios-search" @click="onSearch">{{$L('搜索')}}</Button>
<Button v-if="filtering" type="text" @click="onCancelFilter">{{$L('取消筛选')}}</Button>
<Button v-else :loading="loading" type="text" icon="md-refresh" @click="onRefresh">{{$L('刷新')}}</Button>
</div>
<Tooltip
v-else
theme="light"
:placement="placement"
transfer-class-name="search-button-clear"
transfer>
<Button :loading="loading" type="primary" icon="ios-search" @click="onSearch">{{$L('搜索')}}</Button>
<div slot="content">
<Button v-if="filtering" type="text" @click="onCancelFilter">{{$L('取消筛选')}}</Button>
<Button v-else :loading="loading" type="text" @click="onRefresh">{{$L('刷新')}}</Button>
</div>
</Tooltip>
</template>
<script>
export default {
name: 'SearchButton',
props: {
loading: {
type: Boolean,
default: false
},
filtering: {
type: Boolean,
default: false
},
placement: {
type: String,
default: 'bottom'
}
},
methods: {
onSearch() {
this.$emit('search');
},
onRefresh() {
this.$emit('refresh');
},
onCancelFilter() {
this.$emit('cancelFilter');
}
}
};
</script>

18
resources/assets/js/pages/manage/components/ComplaintManagement.vue
View File

@ -33,14 +33,13 @@
</div> </div>
</li> </li>
<li class="search-button"> <li class="search-button">
<Tooltip theme="light" placement="right" transfer-class-name="search-button-clear" transfer> <SearchButton
<Button :loading="loadIng > 0" type="primary" icon="ios-search" :loading="loadIng > 0"
@click="onSearch">{{ $L('搜索') }}</Button> :filtering="keyIs"
<div slot="content"> placement="right"
<Button v-if="keyIs" type="text" @click="keyIs = false">{{ $L('取消筛选') }}</Button> @search="onSearch"
<Button v-else :loading="loadIng > 0" type="text" @click="getLists">{{ $L('刷新') }}</Button> @refresh="getLists"
</div> @cancelFilter="keyIs=false"/>
</Tooltip>
</li> </li>
</ul> </ul>
</div> </div>
@ -54,8 +53,11 @@
</template> </template>
<script> <script>
import SearchButton from "../../../components/SearchButton.vue";
export default { export default {
name: "ComplaintManagement", name: "ComplaintManagement",
components: {SearchButton},
data() { data() {
const typeList = [ const typeList = [
{ id: 10, label: "诈骗诱导转账" }, { id: 10, label: "诈骗诱导转账" },

19
resources/assets/js/pages/manage/components/ProjectArchived.vue
View File

@ -17,17 +17,13 @@
</div> </div>
</li> </li>
<li class="search-button"> <li class="search-button">
<Tooltip <SearchButton
theme="light" :loading="loadIng > 0"
:filtering="keyIs"
placement="right" placement="right"
transfer-class-name="search-button-clear" @search="onSearch"
transfer> @refresh="getLists"
<Button :loading="loadIng > 0" type="primary" icon="ios-search" @click="onSearch">{{$L('搜索')}}</Button> @cancelFilter="keyIs=false"/>
<div slot="content">
<Button v-if="keyIs" type="text" @click="keyIs=false">{{$L('取消筛选')}}</Button>
<Button v-else :loading="loadIng > 0" type="text" @click="getLists">{{$L('刷新')}}</Button>
</div>
</Tooltip>
</li> </li>
</ul> </ul>
</div> </div>
@ -55,8 +51,11 @@
</template> </template>
<script> <script>
import SearchButton from "../../../components/SearchButton.vue";
export default { export default {
name: "ProjectArchived", name: "ProjectArchived",
components: {SearchButton},
data() { data() {
return { return {
loadIng: 0, loadIng: 0,

19
resources/assets/js/pages/manage/components/ProjectManagement.vue
View File

@ -41,17 +41,13 @@
</div> </div>
</li> </li>
<li class="search-button"> <li class="search-button">
<Tooltip <SearchButton
theme="light" :loading="loadIng > 0"
:filtering="keyIs"
placement="right" placement="right"
transfer-class-name="search-button-clear" @search="onSearch"
transfer> @refresh="getLists"
<Button :loading="loadIng > 0" type="primary" icon="ios-search" @click="onSearch">{{$L('搜索')}}</Button> @cancelFilter="keyIs=false"/>
<div slot="content">
<Button v-if="keyIs" type="text" @click="keyIs=false">{{$L('取消筛选')}}</Button>
<Button v-else :loading="loadIng > 0" type="text" @click="getLists">{{$L('刷新')}}</Button>
</div>
</Tooltip>
</li> </li>
</ul> </ul>
</div> </div>
@ -79,8 +75,11 @@
</template> </template>
<script> <script>
import SearchButton from "../../../components/SearchButton.vue";
export default { export default {
name: "ProjectManagement", name: "ProjectManagement",
components: {SearchButton},
data() { data() {
return { return {
loadIng: 0, loadIng: 0,

19
resources/assets/js/pages/manage/components/ReportMy.vue
View File

@ -36,17 +36,13 @@
</div> </div>
</li> </li>
<li class="search-button"> <li class="search-button">
<Tooltip <SearchButton
theme="light" :loading="loadIng > 0"
:filtering="keyIs"
placement="right" placement="right"
transfer-class-name="search-button-clear" @search="onSearch"
transfer> @refresh="getLists"
<Button :loading="loadIng > 0" type="primary" icon="ios-search" @click="onSearch">{{$L('搜索')}}</Button> @cancelFilter="keyIs=false"/>
<div slot="content">
<Button v-if="keyIs" type="text" @click="keyIs=false">{{$L('取消筛选')}}</Button>
<Button v-else :loading="loadIng > 0" type="text" @click="getLists">{{$L('刷新')}}</Button>
</div>
</Tooltip>
</li> </li>
</ul> </ul>
</div> </div>
@ -79,8 +75,11 @@
</template> </template>
<script> <script>
import SearchButton from "../../../components/SearchButton.vue";
export default { export default {
name: "ReportMy", name: "ReportMy",
components: {SearchButton},
data() { data() {
return { return {
loadIng: 0, loadIng: 0,

19
resources/assets/js/pages/manage/components/ReportReceive.vue
View File

@ -66,17 +66,13 @@
</div> </div>
</li> </li>
<li class="search-button"> <li class="search-button">
<Tooltip <SearchButton
theme="light" :loading="loadIng > 0"
:filtering="keyIs"
placement="right" placement="right"
transfer-class-name="search-button-clear" @search="onSearch"
transfer> @refresh="getLists"
<Button :loading="loadIng > 0" type="primary" icon="ios-search" @click="onSearch">{{$L('搜索')}}</Button> @cancelFilter="keyIs=false"/>
<div slot="content">
<Button v-if="keyIs" type="text" @click="keyIs=false">{{$L('取消筛选')}}</Button>
<Button v-else :loading="loadIng > 0" type="text" @click="getLists">{{$L('刷新')}}</Button>
</div>
</Tooltip>
</li> </li>
</ul> </ul>
</div> </div>
@ -129,10 +125,11 @@
<script> <script>
import Forwarder from "./Forwarder/index.vue"; import Forwarder from "./Forwarder/index.vue";
import SearchButton from "../../../components/SearchButton.vue";
export default { export default {
name: "ReportReceive", name: "ReportReceive",
components: {Forwarder}, components: {SearchButton, Forwarder},
data() { data() {
return { return {
loadIng: 0, loadIng: 0,

18
resources/assets/js/pages/manage/components/TaskArchived.vue
View File

@ -45,17 +45,13 @@
</div> </div>
</li> </li>
<li class="search-button"> <li class="search-button">
<Tooltip <SearchButton
theme="light" :loading="loadIng > 0"
:filtering="keyIs"
placement="right" placement="right"
transfer-class-name="search-button-clear" @search="onSearch"
transfer> @refresh="getLists"
<Button :loading="loadIng > 0" type="primary" icon="ios-search" @click="onSearch">{{$L('搜索')}}</Button> @cancelFilter="keyIs=false"/>
<div slot="content">
<Button v-if="keyIs" type="text" @click="keyIs=false">{{$L('取消筛选')}}</Button>
<Button v-else :loading="loadIng > 0" type="text" @click="getLists">{{$L('刷新')}}</Button>
</div>
</Tooltip>
</li> </li>
</ul> </ul>
</div> </div>
@ -84,9 +80,11 @@
<script> <script>
import {mapState} from "vuex"; import {mapState} from "vuex";
import SearchButton from "../../../components/SearchButton.vue";
export default { export default {
name: "TaskArchived", name: "TaskArchived",
components: {SearchButton},
props: { props: {
projectId: { projectId: {
type: Number, type: Number,

18
resources/assets/js/pages/manage/components/TaskDeleted.vue
View File

@ -45,17 +45,13 @@
</div> </div>
</li> </li>
<li class="search-button"> <li class="search-button">
<Tooltip <SearchButton
theme="light" :loading="loadIng > 0"
:filtering="keyIs"
placement="right" placement="right"
transfer-class-name="search-button-clear" @search="onSearch"
transfer> @refresh="getLists"
<Button :loading="loadIng > 0" type="primary" icon="ios-search" @click="onSearch">{{$L('搜索')}}</Button> @cancelFilter="keyIs=false"/>
<div slot="content">
<Button v-if="keyIs" type="text" @click="keyIs=false">{{$L('取消筛选')}}</Button>
<Button v-else :loading="loadIng > 0" type="text" @click="getLists">{{$L('刷新')}}</Button>
</div>
</Tooltip>
</li> </li>
</ul> </ul>
</div> </div>
@ -84,9 +80,11 @@
<script> <script>
import {mapState} from "vuex"; import {mapState} from "vuex";
import SearchButton from "../../../components/SearchButton.vue";
export default { export default {
name: "TaskDeleted", name: "TaskDeleted",
components: {SearchButton},
props: { props: {
projectId: { projectId: {
type: Number, type: Number,

19
resources/assets/js/pages/manage/components/TeamManagement.vue
View File

@ -142,17 +142,13 @@
</div> </div>
</li> </li>
<li class="search-button"> <li class="search-button">
<Tooltip <SearchButton
theme="light" :loading="loadIng > 0"
:filtering="keyIs"
placement="bottom" placement="bottom"
transfer-class-name="search-button-clear" @search="onSearch"
transfer> @refresh="getLists"
<Button :loading="loadIng > 0" type="primary" icon="ios-search" @click="onSearch">{{$L('搜索')}}</Button> @cancelFilter="keyIs=false"/>
<div slot="content">
<Button v-if="keyIs" type="text" @click="keyIs=false">{{$L('取消筛选')}}</Button>
<Button v-else :loading="loadIng > 0" type="text" @click="getLists">{{$L('刷新')}}</Button>
</div>
</Tooltip>
</li> </li>
</ul> </ul>
</div> </div>
@ -369,11 +365,12 @@ import UserSelect from "../../../components/UserSelect.vue";
import UserAvatarTip from "../../../components/UserAvatar/tip.vue"; import UserAvatarTip from "../../../components/UserAvatar/tip.vue";
import ImgUpload from "../../../components/ImgUpload"; import ImgUpload from "../../../components/ImgUpload";
import ResizeLine from "../../../components/ResizeLine.vue"; import ResizeLine from "../../../components/ResizeLine.vue";
import SearchButton from "../../../components/SearchButton.vue";
import {mapState} from "vuex"; import {mapState} from "vuex";
export default { export default {
name: "TeamManagement", name: "TeamManagement",
components: {ResizeLine, UserAvatarTip, UserSelect, ImgUpload}, components: {SearchButton, ResizeLine, UserAvatarTip, UserSelect, ImgUpload},
props: { props: {
checkinMode: { checkinMode: {
type: Boolean, type: Boolean,

4
resources/assets/sass/pages/common.scss vendored
View File

@ -660,6 +660,10 @@ body {
> button + button { > button + button {
margin-left: 8px; margin-left: 8px;
} }
.ivu-btn-text {
box-shadow: none;
}
} }
} }
} }