|
|
@@ -1,31 +1,16 @@
|
|
|
<template>
|
|
|
<div class="header-actions" v-if="getActionList.length != 0">
|
|
|
<div class="overflow-box">
|
|
|
- <el-button
|
|
|
- v-for="(item, index) in getActionList"
|
|
|
- :key="index"
|
|
|
- :type="item.type || 'primary'"
|
|
|
- :plain="item.plain || false"
|
|
|
- v-bind="getHeaderActions(item)"
|
|
|
- @click="item.action"
|
|
|
- :disabled="item.disabled || false"
|
|
|
- >
|
|
|
+ <el-button v-for="(item, index) in getActionList" :key="index" :type="item.type || 'primary'" :plain="item.plain || false"
|
|
|
+ v-bind="getHeaderActions(item)" @click="item.action" :disabled="item.disabled || false">
|
|
|
{{ item.text }}
|
|
|
</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- statWarpHeight > 200 && -->
|
|
|
- <div
|
|
|
- class="stat-warp"
|
|
|
- v-if="statConfig.length != 0"
|
|
|
- :class="isMore ? 'show-more' : ''"
|
|
|
- >
|
|
|
+ <div class="stat-warp" v-if="statConfig.length != 0" :class="isMore ? 'show-more' : ''">
|
|
|
<div class="title">
|
|
|
- <select
|
|
|
- v-model="statSelectVal"
|
|
|
- v-if="statConfig.length > 1"
|
|
|
- @change="changeStatData"
|
|
|
- >
|
|
|
+ <select v-model="statSelectVal" v-if="statConfig.length > 1" @change="changeStatData">
|
|
|
<option :value="index" v-for="(i, index) in statConfig" :key="index">
|
|
|
{{ i.label }}
|
|
|
</option>
|
|
|
@@ -33,34 +18,21 @@
|
|
|
<div v-if="statConfig.length === 1">{{ statConfig[0].label }}</div>
|
|
|
</div>
|
|
|
<!-- v-if="statWarpHeight > 200" -->
|
|
|
- <div class="more-btn" @click="isMore = !isMore" >
|
|
|
+ <div class="more-btn" @click="isMore = !isMore">
|
|
|
<span>
|
|
|
<i v-if="!isMore" class="iconfont icon-btn_xiala22"></i>
|
|
|
<i v-else class="iconfont icon-btn_shouqi22"></i>
|
|
|
-
|
|
|
+
|
|
|
</span>
|
|
|
</div>
|
|
|
<ul id="statWarp">
|
|
|
- <li
|
|
|
- v-show="!i.data"
|
|
|
- :class="'theme' + i.type"
|
|
|
- v-for="(i, index) in statConfig[statSelectVal].data"
|
|
|
- :key="index"
|
|
|
- @click="i.click ? i.click(i, index) : ''"
|
|
|
- :style="i.click ? 'cursor: pointer' : ''"
|
|
|
- >
|
|
|
+ <li v-show="!i.data" :class="'theme' + i.type" v-for="(i, index) in statConfig[statSelectVal].data" :key="index"
|
|
|
+ @click="i.click ? i.click(i, index) : ''" :style="i.click ? 'cursor: pointer' : ''">
|
|
|
<div class="label">{{ i.label }}</div>
|
|
|
<div class="num">{{ i.num }}</div>
|
|
|
</li>
|
|
|
- <li
|
|
|
- v-show="i.data"
|
|
|
- v-for="(i, index) in statConfig[statSelectVal].data"
|
|
|
- :key="index"
|
|
|
- class="multi-data"
|
|
|
- :class="'theme' + i.type"
|
|
|
- @click="i.click ? i.click(i, index) : ''"
|
|
|
- :style="i.click ? 'cursor: pointer' : ''"
|
|
|
- >
|
|
|
+ <li v-show="i.data" v-for="(i, index) in statConfig[statSelectVal].data" :key="index" class="multi-data" :class="'theme' + i.type"
|
|
|
+ @click="i.click ? i.click(i, index) : ''" :style="i.click ? 'cursor: pointer' : ''">
|
|
|
<div class="label">{{ i.label }}</div>
|
|
|
<div class="num-warp">
|
|
|
<div class="num-box" v-for="(j, jindex) in i.data" :key="jindex">
|
|
|
@@ -80,12 +52,7 @@
|
|
|
</header>
|
|
|
<div class="by-search" v-if="!hideSearch">
|
|
|
<div style="display: flex">
|
|
|
- <div
|
|
|
- class="by-dropdown"
|
|
|
- v-for="(i, index) in selectConfigCopy"
|
|
|
- :key="i.prop"
|
|
|
- style="margin-right: 10px"
|
|
|
- >
|
|
|
+ <div class="by-dropdown" v-for="(i, index) in selectConfigCopy" :key="i.prop" style="margin-right: 10px">
|
|
|
<div class="by-dropdown-title">
|
|
|
{{
|
|
|
pagination[i.prop]
|
|
|
@@ -98,19 +65,10 @@
|
|
|
<i style="margin-left: 5px" class="iconfont icon-iconm_xialan1"></i>
|
|
|
</div>
|
|
|
<ul class="by-dropdown-lists">
|
|
|
- <li
|
|
|
- @click="searchItemSelct('all', i, index)"
|
|
|
- v-if="i.isShowAll === false ? i.isShowAll : true"
|
|
|
- style=""
|
|
|
- >
|
|
|
+ <li @click="searchItemSelct('all', i, index)" v-if="i.isShowAll === false ? i.isShowAll : true" style="">
|
|
|
{{ $t("common.all") }}
|
|
|
</li>
|
|
|
- <li
|
|
|
- v-for="j in i.data"
|
|
|
- :key="j.value"
|
|
|
- @click="searchItemSelct(j, i)"
|
|
|
- style=""
|
|
|
- >
|
|
|
+ <li v-for="j in i.data" :key="j.value" @click="searchItemSelct(j, i)" style="">
|
|
|
{{ j.label }}
|
|
|
</li>
|
|
|
</ul>
|
|
|
@@ -118,26 +76,11 @@
|
|
|
</div>
|
|
|
|
|
|
<div style="display: flex">
|
|
|
- <el-input
|
|
|
- :placeholder="$t('common.pleaseEnterKeywords')"
|
|
|
- suffix-icon="search"
|
|
|
- size="mini"
|
|
|
- v-model="pagination.keyword"
|
|
|
- @keyup.enter="searchFn"
|
|
|
- >
|
|
|
+ <el-input :placeholder="$t('common.pleaseEnterKeywords')" suffix-icon="search" size="mini" v-model="pagination.keyword"
|
|
|
+ @keyup.enter="searchFn">
|
|
|
</el-input>
|
|
|
- <el-button
|
|
|
- type="primary"
|
|
|
- style="margin-left: 10px"
|
|
|
- size="default"
|
|
|
- v-no-double-click="searchFn"
|
|
|
- >{{ $t("common.search") }}</el-button
|
|
|
- >
|
|
|
- <div
|
|
|
- class="more-icon"
|
|
|
- @click="retrievalModalFn"
|
|
|
- v-if="$attrs.onMoreSearch"
|
|
|
- >
|
|
|
+ <el-button type="primary" style="margin-left: 10px" size="default" v-no-double-click="searchFn">{{ $t("common.search") }}</el-button>
|
|
|
+ <div class="more-icon" @click="retrievalModalFn" v-if="$attrs.onMoreSearch">
|
|
|
<i class="iconfont icon-iconx_saixuan"></i>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -147,52 +90,25 @@
|
|
|
<slot />
|
|
|
</div>
|
|
|
|
|
|
- <el-table
|
|
|
- ref="hocElTable"
|
|
|
-
|
|
|
- :data="source"
|
|
|
- v-if="!hideTable"
|
|
|
- style="width: 100%"
|
|
|
- v-bind="$attrs"
|
|
|
- v-on="tableEvents"
|
|
|
- row-key="id"
|
|
|
- lazy
|
|
|
- :load="load"
|
|
|
- :tree-props="{
|
|
|
+ <el-table ref="hocElTable" :data="source" v-if="!hideTable" style="width: 100%" v-bind="$attrs" v-on="tableEvents" row-key="id" lazy
|
|
|
+ :load="load" :tree-props="{
|
|
|
children: 'children',
|
|
|
hasChildren: 'hasChildren',
|
|
|
- }"
|
|
|
- :height="tableHeight"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- v-for="(item, index) in config"
|
|
|
- :key="index"
|
|
|
- v-bind="getAttrsValue(item)"
|
|
|
- :type="item.type || ''"
|
|
|
- :selectable="
|
|
|
+ }" :height="tableHeight">
|
|
|
+ <el-table-column v-for="(item, index) in config" :key="index" v-bind="getAttrsValue(item)" :type="item.type || ''" :selectable="
|
|
|
(rowData, rowIndex) => isSelectable(rowData, rowIndex, item)
|
|
|
- "
|
|
|
- >
|
|
|
+ ">
|
|
|
<template #default="scope" v-if="!item.type">
|
|
|
- <slot
|
|
|
- :name="item.attrs.slot"
|
|
|
- :item="scope.row"
|
|
|
- v-if="item.attrs.slot"
|
|
|
- >
|
|
|
+ <slot :name="item.attrs.slot" :item="scope.row" v-if="item.attrs.slot">
|
|
|
插槽占位符
|
|
|
</slot>
|
|
|
<div v-else-if="isFunction(getValue(scope, item))">
|
|
|
- <component
|
|
|
- :is="renderTypeList[getMatchRenderFunction(item)].target"
|
|
|
- :cell-list="getValue(scope, item)()"
|
|
|
- :row="scope.row"
|
|
|
- :parent="getParent"
|
|
|
- @click="
|
|
|
+ <component :is="renderTypeList[getMatchRenderFunction(item)].target" :cell-list="getValue(scope, item)()" :row="scope.row"
|
|
|
+ :parent="getParent" @click="
|
|
|
($event) => {
|
|
|
handleNativeClick(getAttrsValue(item), $event, item);
|
|
|
}
|
|
|
- "
|
|
|
- />
|
|
|
+ " />
|
|
|
</div>
|
|
|
<div v-else>
|
|
|
{{ getValue(scope, item) }}
|
|
|
@@ -201,21 +117,10 @@
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
|
|
|
- <el-row
|
|
|
- v-if="!hidePagination"
|
|
|
- class="table-pagination"
|
|
|
- justify="end"
|
|
|
- type="flex"
|
|
|
- >
|
|
|
- <el-pagination
|
|
|
- background
|
|
|
- layout="total, sizes, prev, pager, next, jumper"
|
|
|
- :current-page="getPagination.pageNum"
|
|
|
- :page-size="getPagination.pageSize"
|
|
|
- :total="getPagination.total"
|
|
|
- @size-change="handleSizeChange"
|
|
|
- @current-change="handlePageChange"
|
|
|
- />
|
|
|
+ <el-row v-if="!hidePagination" class="table-pagination" justify="end" type="flex">
|
|
|
+ <el-pagination background layout="total, sizes, prev, pager, next, jumper" :current-page="getPagination.pageNum"
|
|
|
+ :page-size="getPagination.pageSize" :page-sizes="[10,50,100,500,1000]" :total="getPagination.total"
|
|
|
+ @size-change="handleSizeChange" @current-change="handlePageChange" />
|
|
|
</el-row>
|
|
|
</component>
|
|
|
</div>
|
|
|
@@ -360,7 +265,7 @@ export default defineComponent({
|
|
|
const changeStatData = () => {
|
|
|
statWarpHeight.value = document.getElementById("statWarp").offsetHeight;
|
|
|
};
|
|
|
-
|
|
|
+
|
|
|
let statWarpHeight = ref(0);
|
|
|
watch(
|
|
|
proxy.statConfig,
|
|
|
@@ -370,7 +275,7 @@ export default defineComponent({
|
|
|
statWarpHeight.value =
|
|
|
document.getElementById("statWarp").offsetHeight;
|
|
|
}, 500);
|
|
|
- },
|
|
|
+ },
|
|
|
{ immediate: true }
|
|
|
);
|
|
|
let statSelectVal = ref(0);
|
|
|
@@ -449,7 +354,7 @@ export default defineComponent({
|
|
|
return isFn(fn);
|
|
|
};
|
|
|
const searchFn = (val) => {
|
|
|
- if(props.loading) return;
|
|
|
+ if (props.loading) return;
|
|
|
proxy.$emit(
|
|
|
"getList",
|
|
|
Object.assign(props.filterParams, {
|
|
|
@@ -597,9 +502,13 @@ export default defineComponent({
|
|
|
font-size: 12px;
|
|
|
line-height: 30px;
|
|
|
text-align: center;
|
|
|
- background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 100%);
|
|
|
- i{
|
|
|
- color:#999;
|
|
|
+ background: linear-gradient(
|
|
|
+ 180deg,
|
|
|
+ rgba(255, 255, 255, 0) 0%,
|
|
|
+ rgba(255, 255, 255, 0.8) 100%
|
|
|
+ );
|
|
|
+ i {
|
|
|
+ color: #999;
|
|
|
}
|
|
|
}
|
|
|
.title {
|
cz