Merge branch 'feature-ui-20221205' of e.coding.yili.com:yldc/ylst/ylst-survey-web into feature-ui-20221205

This commit is contained in:
steven
2022-12-07 13:57:31 +08:00
7 changed files with 43 additions and 24 deletions

View File

@@ -28,7 +28,7 @@ function getPagination() {
defaultPageSize: 10, defaultPageSize: 10,
pageSize: 10, pageSize: 10,
pageSizeOptions: ["10", "20", "30"], pageSizeOptions: ["10", "20", "30"],
showQuickJumper: true, // showQuickJumper: true,
showSizeChanger: true, showSizeChanger: true,
showTotal: (total) => `${total}`, showTotal: (total) => `${total}`,
total: 0, total: 0,
@@ -86,8 +86,11 @@ export default {
<style scoped lang="less"> <style scoped lang="less">
.pagination { .pagination {
display: inline-flex; display: inline-flex;
justify-content: flex-end;
position: relative; position: relative;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
border-radius: 0 0 2px 2px;
width: 100%;
} }
</style> </style>

View File

@@ -7,23 +7,35 @@
<!-- 总计表头 --> <!-- 总计表头 -->
<vxe-column min-width="85" fixed="left" key="total" type="html" show-overflow="ellipsis" title="" field="option_title"> <vxe-column min-width="85" fixed="left" key="total" type="html" show-overflow="ellipsis" title="" field="option_title">
<template #default="{ row }"> <template #default="{ row }">
<a-popover :overlayStyle="{'max-width':'20%'}"> <a-tooltip placement="topLeft" :overlayStyle="{'max-width':'20%'}">
<template #title>
<div class="pop-span"><span v-html="row.option_title"></span></div>
</template>
<div class="pop-div" style="width:67px;"><span v-html="row.option_title"></span></div>
</a-tooltip>
<!-- <a-popover :overlayStyle="{'max-width':'20%'}">
<template #content> <template #content>
<div class="pop-span"><span v-html="row.option_title"></span></div> <div class="pop-span"><span v-html="row.option_title"></span></div>
</template> </template>
<div class="pop-div" style="width:67px;"><span v-html="row.option_title"></span></div> <div class="pop-div" style="width:67px;"><span v-html="row.option_title"></span></div>
</a-popover> </a-popover> -->
</template> </template>
</vxe-column> </vxe-column>
<!-- 其他表头 --> <!-- 其他表头 -->
<vxe-colgroup min-width="170" align="center" v-for="(columnsDateItem,columnsDate_index) in item.header" :title="columnsDateItem.title" :key="columnsDate_index"> <vxe-colgroup min-width="170" align="left" v-for="(columnsDateItem,columnsDate_index) in item.header" :title="columnsDateItem.title" :key="columnsDate_index">
<template #header> <template #header>
<a-popover :overlayStyle="{'max-width':'20%'}"> <a-tooltip placement="topLeft" :overlayStyle="{'max-width':'20%'}">
<template #title>
<div class="pop-span"><span v-html="columnsDateItem.title"></span></div>
</template>
<div class="pop-div"><span v-html="columnsDateItem.title"></span></div>
</a-tooltip>
<!-- <a-popover :overlayStyle="{'max-width':'20%'}">
<template #content> <template #content>
<div class="pop-span"><span v-html="columnsDateItem.title"></span></div> <div class="pop-span"><span v-html="columnsDateItem.title"></span></div>
</template> </template>
<div class="pop-div"><span v-html="columnsDateItem.title"></span></div> <div class="pop-div"><span v-html="columnsDateItem.title"></span></div>
</a-popover> </a-popover> -->
</template> </template>
<vxe-column min-width="80" v-for="(children,children_index) in columnsDateItem.child" :key="'children'+children_index" :title="children.title" :field="children.key"></vxe-column> <vxe-column min-width="80" v-for="(children,children_index) in columnsDateItem.child" :key="'children'+children_index" :title="children.title" :field="children.key"></vxe-column>
</vxe-colgroup> </vxe-colgroup>

View File

@@ -46,23 +46,23 @@
<!-- 总计表头 --> <!-- 总计表头 -->
<vxe-column min-width="85" fixed="left" key="total" type="html" show-overflow="ellipsis" title="" field="option_title"> <vxe-column min-width="85" fixed="left" key="total" type="html" show-overflow="ellipsis" title="" field="option_title">
<template #default="{ row }"> <template #default="{ row }">
<a-popover :overlayStyle="{'max-width':'20%'}"> <a-tooltip placement="topLeft" :overlayStyle="{'max-width':'20%'}">
<template #content> <template #title>
<div class="pop-span"><span v-html="row.option_title"></span></div> <div class="pop-span"><span v-html="row.option_title"></span></div>
</template> </template>
<div class="pop-div" style="width:67px;"><span v-html="row.option_title"></span></div> <div class="pop-div" style="width:67px;"><span v-html="row.option_title"></span></div>
</a-popover> </a-tooltip>
</template> </template>
</vxe-column> </vxe-column>
<!-- 其他表头 --> <!-- 其他表头 -->
<vxe-colgroup min-width="170" align="center" v-for="(columnsDateItem,columnsDate_index) in item.header" :title="columnsDateItem.title" :key="columnsDate_index"> <vxe-colgroup min-width="170" align="left" v-for="(columnsDateItem,columnsDate_index) in item.header" :title="columnsDateItem.title" :key="columnsDate_index">
<template #header> <template #header>
<a-popover :overlayStyle="{'max-width':'20%'}"> <a-tooltip placement="topLeft" :overlayStyle="{'max-width':'20%'}">
<template #content> <template #title>
<div class="pop-span"><span v-html="columnsDateItem.title"></span></div> <div class="pop-span"><span v-html="columnsDateItem.title"></span></div>
</template> </template>
<div class="pop-div"><span v-html="columnsDateItem.title"></span></div> <div class="pop-div"><span v-html="columnsDateItem.title"></span></div>
</a-popover> </a-tooltip>
</template> </template>
<vxe-column min-width="80" v-for="(children,children_index) in columnsDateItem.child" :key="'children'+children_index" :title="children.title" :field="children.key"></vxe-column> <vxe-column min-width="80" v-for="(children,children_index) in columnsDateItem.child" :key="'children'+children_index" :title="children.title" :field="children.key"></vxe-column>
</vxe-colgroup> </vxe-colgroup>
@@ -83,22 +83,22 @@
> >
<a-table-column fixed="left" key="total" title="" data-index="columnChil0" > <a-table-column fixed="left" key="total" title="" data-index="columnChil0" >
<template #default="{ record }"> <template #default="{ record }">
<a-popover :overlayStyle="{'max-width':'25%'}"> <a-tooltip placement="topLeft" :overlayStyle="{'max-width':'25%'}">
<template #content> <template #title>
<div class="pop-span"><span v-html="record.columnChil0"></span></div> <div class="pop-span"><span v-html="record.columnChil0"></span></div>
</template> </template>
<div class="pop-div" style="width:67px"><span v-html="record.columnChil0"></span></div> <div class="pop-div" style="width:67px"><span v-html="record.columnChil0"></span></div>
</a-popover> </a-tooltip>
</template> </template>
</a-table-column> </a-table-column>
<a-table-column-group v-for="(columnsDateItem,columnsDate_index) in item.columnsData" :key="columnsDate_index"> <a-table-column-group v-for="(columnsDateItem,columnsDate_index) in item.columnsData" :key="columnsDate_index">
<template #title> <template #title>
<a-popover :overlayStyle="{'max-width':'25%'}"> <a-tooltip placement="topLeft" :overlayStyle="{'max-width':'25%'}">
<template #content> <template #title>
<div class="pop-span"><span v-html="columnsDateItem.title"></span></div> <div class="pop-span"><span v-html="columnsDateItem.title"></span></div>
</template> </template>
<div class="pop-div"><span v-html="columnsDateItem.title"></span></div> <div class="pop-div"><span v-html="columnsDateItem.title"></span></div>
</a-popover> </a-tooltip>
</template> </template>
<a-table-column v-for="(children,children_index) in columnsDateItem.children" :key="'children'+children_index" :data-index="children.dataIndex"> <a-table-column v-for="(children,children_index) in columnsDateItem.children" :key="'children'+children_index" :data-index="children.dataIndex">
<template #title><span>{{children.title}}</span></template> <template #title><span>{{children.title}}</span></template>

View File

@@ -3,15 +3,15 @@
<div class="analysisResult"> <div class="analysisResult">
<div class="tit"> <div class="tit">
<span>分析结果</span> <span>分析结果</span>
<a-popover class="poppver" placement="topLeft" arrow-point-at-center> <a-tooltip class="poppver" placement="topLeft" arrow-point-at-center :overlayStyle="{'max-width':'630px'}">
<template #content> <template #title>
<p>PMC(可采纳最低价格): 太便宜的交点低于此临界点就会太便宜</p> <p>PMC(可采纳最低价格): 太便宜的交点低于此临界点就会太便宜</p>
<p>PME(可采纳的最高价格): 便宜太贵的交点高于此临界点就会太贵</p> <p>PME(可采纳的最高价格): 便宜太贵的交点高于此临界点就会太贵</p>
<p>OPP(最优价格): 太便宜太贵的交点最优价格</p> <p>OPP(最优价格): 太便宜太贵的交点最优价格</p>
<p>IPP(既不贵也不便宜的价格): 便宜的交点不太贵和不太便宜基本一样模棱两可的价格</p> <p>IPP(既不贵也不便宜的价格): 便宜的交点不太贵和不太便宜基本一样模棱两可的价格</p>
</template> </template>
<i class="icon iconfont">&#xe6de;</i> <i class="icon iconfont">&#xe6de;</i>
</a-popover> </a-tooltip>
</div> </div>
<div class="arrow">四条折线分别代表四种态度对应的价格认可占比</div> <div class="arrow">四条折线分别代表四种态度对应的价格认可占比</div>
<div class="arrow"> <div class="arrow">

View File

@@ -335,7 +335,7 @@ const pagination = computed(() => {
current: analysisResults.value?.meta.current_page ?? 1, current: analysisResults.value?.meta.current_page ?? 1,
pageSize: analysisResults.value?.meta.per_page ?? 5, pageSize: analysisResults.value?.meta.per_page ?? 5,
showSizeChanger: true, showSizeChanger: true,
showQuickJumper: true, // showQuickJumper: true,
pageSizeOptions: ["5", "10", "20", "30", "40"], pageSizeOptions: ["5", "10", "20", "30", "40"],
showTotal: (total) => `${total} 条数据`, showTotal: (total) => `${total} 条数据`,
}; };

View File

@@ -61,7 +61,6 @@
<template v-slot:footer> <template v-slot:footer>
<a-pagination <a-pagination
class="pagination" class="pagination"
:showQuickJumper="true"
:showTotal="(total) => `共 ${total} 条`" :showTotal="(total) => `共 ${total} 条`"
show-size-changer show-size-changer
v-model:current="pagination.current" v-model:current="pagination.current"

View File

@@ -876,3 +876,8 @@ export default defineComponent({
} }
</style> </style>
<style lang="scss">
.ant-pagination-prev .ant-pagination-item-link, .ant-pagination-next .ant-pagination-item-link, .ant-pagination-item, .ant-select:not(.ant-select-customize-input) .ant-select-selector {
border-radius: 4px;
}
</style>