lijingjia
/
ds-wms-client-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

框架重构

Browse Source
frame
lijingjia 2 days ago
parent 658979f6ab
commit 203075c55b
11 changed files with 316 additions and 286 deletions
Show Stats Download Patch File Download Diff File

2
index.html
Unescape Escape View File

@ -10,7 +10,7 @@
/>
<title><%= title %></title>
<link rel="icon" href="/favicon.ico" />
<link rel="stylesheet" href="//at.alicdn.com/t/c/font_3756681_boclsb2vb14.css" />
<link rel="stylesheet" href="//at.alicdn.com/t/c/font_3756681_wqiwqo0ahpj.css" />
</head>
<body>
<script>

21
src/components/Basic/src/BasicArrow.vue
Unescape Escape View File

@ -1,15 +1,15 @@
<!--
* @Author: Vben
* @Description: Arrow component with animation
* @Desc:
* @Author: lijj
* @Date: 2024-07-17 08:39:50
-->
<template>
<span :class="getClass">
<Icon icon="ion:chevron-forward" style="font-size: 12px;" />
<span class="iconfont icon-zhankaishouqi-xiao-danse"></span>
</span>
</template>
<script lang="ts" setup>
import { computed } from 'vue'
import { Icon } from '/@/components/Icon'
import { useDesign } from '/@/hooks/web/useDesign'
const props = defineProps({
@ -49,16 +49,17 @@
</script>
<style lang="less" scoped>
@prefix-cls: ~'@{namespace}-basic-arrow';
.@{prefix-cls} {
display: inline-block;
cursor: pointer;
transform: rotate(0deg);
transition: all 0.3s ease 0.1s;
transform-origin: center center;
.icon-zhankaishouqi-xiao-danse {
margin: 0;
}
&--active {
transform: rotate(90deg);
transform: rotate(180deg);
}
&.inset {
@ -66,15 +67,15 @@
}
&.up {
transform: rotate(-90deg);
transform: rotate(-0deg);
}
&.down {
transform: rotate(90deg);
transform: rotate(180deg);
}
&.up.@{prefix-cls}--active {
transform: rotate(90deg);
transform: rotate(180deg);
}
&.down.@{prefix-cls}--active {

27
src/components/Form/src/components/FormAction.vue
Unescape Escape View File

@ -26,23 +26,24 @@
<slot name="advanceBefore"></slot>
<a-button
v-if="showAdvancedButton && !hideAdvanceBtn"
type="link"
:class="{'ds-tb-form-tg-h': getDarkMode == 'black', 'ds-tb-form-tg-l': getDarkMode == 'blue', 'ds-tb-form-tg-b': getDarkMode == 'white'}"
size="small"
@click="toggleAdvanced"
>
<BasicArrow :style="{color: '#257AFA'}" :expand="!isAdvanced" up />
<span id="formFold" style="margin-left: 3px;">{{ isAdvanced ? t('component.form.putAway') : t('component.form.unfold') }}</span>
<BasicArrow :expand="!isAdvanced" up />
<!-- <span id="formFold" style="margin-left: 3px;">{{ isAdvanced ? t('component.form.putAway') : t('component.form.unfold') }}</span> -->
</a-button>
<slot name="advanceAfter"></slot>
<slot name="resetBefore"></slot>
<Button
:class="{'ds-tb-form-tg-h': getDarkMode == 'black', 'ds-tb-form-tg-l': getDarkMode == 'blue', 'ds-tb-form-tg-b': getDarkMode == 'white'}"
v-if="showResetButton"
type="default"
class="mr-2"
size="small"
v-bind="getResetBtnOptions"
@click="resetAction"
>
{{ getResetBtnOptions.text }}
<span class="iconfont icon-zhongzhi-xiao-danse"></span>
<!-- {{ getResetBtnOptions.text }} -->
</Button>
<!-- <slot name="submitBefore"></slot> -->
@ -75,7 +76,7 @@
import { useI18n } from '/@/hooks/web/useI18n'
import { propTypes } from '/@/utils/propTypes'
import AdvancedSearch from './AdvancedSearch.vue'
import { useRootSetting } from '/@/hooks/setting/useRootSetting'
type ButtonOptions = Partial<ButtonProps> & { text: string }
export default defineComponent({
@ -180,10 +181,11 @@
}
emit('toggle-advanced')
}
const { getDarkMode } = useRootSetting()
return {
t,
actionColOpt,
getDarkMode,
getResetBtnOptions,
getSubmitBtnOptions,
toggleAdvanced,
@ -197,7 +199,10 @@
</script>
<style scoped>
#formFold {
color: #257afa!important;
}
.icon-zhongzhi-xiao-danse {
margin: 0;
}
.ds-tb-form-tg-h {
}
</style>

3
src/components/SimpleMenu/src/components/menu.less
Unescape Escape View File

@ -183,9 +183,10 @@
padding-left: 0px!important;
}
&-vertical &-item-active &-submenu-title {
.light-border();
font-weight: 700;
color: @primary-color;
border-radius: 4px;
background: rgba(255, 255, 255, 0.15)!important;
// background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(217, 232, 255, 1) 100%);
}
&-vertical .@{menu-prefix-cls} {

3
src/components/SimpleMenu/src/index.less
Unescape Escape View File

@ -6,6 +6,8 @@
background-color: @sider-dark-bg-color;
> .@{prefix-cls}-submenu-title {
background-color: @sider-dark-bg-color;
font-size: 14px;
color: #ffffff;
}
}
.ant-col {
@ -14,6 +16,7 @@
&-dark&-vertical .@{simple-prefix-cls}__children,
&-dark&-popup .@{simple-prefix-cls}__children {
height: 30px;
color: rgba(255, 255, 255, 0.5);
// background-color: @sider-dark-lighten-bg-color;
> .@{prefix-cls}-submenu-title {
// background-color: @sider-dark-lighten-bg-color;

16
src/components/Table/src/BasicTable.vue
Unescape Escape View File

@ -34,7 +34,7 @@
show-overflow
show-header-overflow
show-footer-overflow
:min-height="tableHeightRef + 35"
:min-height="tableHeightRef + 36"
:height="tableHeightRef + 35"
:row-config="{ isCurrent: true, isHover: true }"
:column-config="{ resizable: true }"
@ -104,7 +104,12 @@
</Table>
<slot name="right" class="right" ></slot>
</div>
<Pagination v-if="getBindValues.tableComponent === 'vxe'" v-bind="getBindValues.pagination" @change="pageChange" @showSizeChange="onShowSizeChange" />
<Pagination
v-if="getBindValues.tableComponent === 'vxe'"
v-bind="getBindValues.pagination"
@change="pageChange"
@showSizeChange="onShowSizeChange"
/>
</div>
</template>
<script lang="ts">
@ -581,7 +586,7 @@ export default defineComponent({
.ant-form {
width: 100%;
padding: 10px 8px 10px;
background-color: #F5F9FC;
background-color: #F0F2F5;
}
}
@ -672,8 +677,9 @@ export default defineComponent({
color: #257afa!important;
}
.vxe-cell--sort {
font-size: 0.8em!important;
height: 1.5em!important;
font-size: 0.7em!important;
height: 1.3em!important;
margin-left: 3px;
}
.vxe-header--row {
background: #f0f4fa!important;

25
src/design/ant/pagination.less
Unescape Escape View File

@ -5,19 +5,17 @@ html[data-theme='dark'] {
.ant-pagination-next,
.ant-pagination-item {
background-color: rgb(255 255 255 / 4%) !important;
a {
color: #8b949e !important;
}
}
.ant-select-arrow {
color: @text-color-secondary !important;
}
.ant-pagination-item-active {
background-color: @primary-color !important;
border: none;
border: 1px solid @primary-color;
border-radius: none !important;
a {
@ -65,20 +63,20 @@ html[data-theme='dark'] {
}
.ant-pagination-item-active {
// background-color: @primary-color !important;
border: none;
border-radius: none !important;
border: 1px solid @primary-color;
color: @primary-color;
a {
color: rgba(70, 145, 255, 1) !important;
color: @primary-color!important;
}
}
.ant-pagination-options {
padding-right: 20px;
position: relative;
top: -2.5px;
.ant-select-selector, .ant-input-number-input-wrap {
height: 20px!important;
min-height: 20px!important;
height: 26px!important;
min-height: 26px!important;
}
margin-left: 12px;
.ant-select-selector {
@ -93,7 +91,7 @@ html[data-theme='dark'] {
font-size: 12px;
font-weight: 400;
letter-spacing: 1px;
line-height: 20px !important;
line-height: 26px !important;
color: rgba(122, 135, 152, 1);
}
}
@ -103,17 +101,16 @@ html[data-theme='dark'] {
}
.ant-pagination-options-quick-jumper input {
height: 20px!important;
height: 26px!important;
margin: 3px 6px;
border: none !important;
text-align: center;
border-radius: 4px;
background: rgba(240, 244, 250, 1);
line-height: 22px;
font-size: 12px;
font-weight: 400;
letter-spacing: 1px;
line-height: 20px !important;
line-height: 26px !important;
color: rgba(122, 135, 152, 1);
}

26
src/design/ant/table.less
Unescape Escape View File

@ -1,12 +1,28 @@
// 列表页面表单和表格的整体样式管理
.ds-table, .ds-mini-table {
.table-wrapper {
padding-left: 20px;
}
border: 1px solid #CCD6DF;
border-radius: 6px;
padding: 20px 20px 0!important;
height: auto!important;
}
.ds-table, .ds-table-detail, .ds-mini-table, .ds-mini-table-detail {
.vxe-header--column {
font-weight: 400;
color: #121826;
background-color: #F0F2F5;
.vxe-cell--sort {
line-height: 1.2em;
.sort--active {
color: @primary-color;
}
i {
font-size: 0.8em;
}
}
}
.ant-form {
padding: 10px 19px 1px!important;
padding: 10px 20px 11px!important;
border-radius: 6px;
.ant-btn {
height: 26px;
margin: 0 0 0px 10px;
@ -58,7 +74,7 @@
}
}
.ant-pagination {
margin: 2px 0 3px!important;
margin: 10px 0 11px!important;
font-size: 12px;
}
.ant-pagination-total-text {

3
src/design/public.less
Unescape Escape View File

@ -193,6 +193,9 @@ h5 {
.pl0 {
padding-left: 0 !important;
}
.p20 {
padding: 20px;
}
// 表格状态使用
.ds-green-tag,
.ds-blue-tag,

8
src/views/operation/seaexport/changeConfig/index.vue
Unescape Escape View File

@ -1,5 +1,5 @@
<template>
<div>
<div class="p20">
<BasicTable class="ds-table" @register="registerTable">
<template #tableTitle>
</template>
@ -120,7 +120,7 @@
</template>
<script lang="ts" setup>
import { onMounted } from 'vue'
import { BasicTable, useTable, TableAction } from '/@/components/Table'
import { BasicTable, useTable } from '/@/components/Table'
import { GetSeaExportRefundList } from './api'
import { formatParams } from '/@/hooks/web/common'
import { columns, searchFormSchema } from '../columns'
@ -151,7 +151,9 @@
bordered: true,
showIndexColumn: true,
canResize: true,
resizeHeightOffset: 15,
resizeHeightOffset: 45,
tableComponent: 'vxe',
autoHeight: window.innerHeight - 330.5
// actionColumn: {
// width: 80,
// title: '操作',

18
src/views/operation/seaexport/index.vue
Unescape Escape View File

@ -1,6 +1,7 @@
<template>
<div class="ds-sea-export-table">
<BasicTable class="ds-table" @register="registerTable" @rowDbClick="handledbclick">
<div class="ds-table">
<BasicTable @register="registerTable" @rowDbClick="handledbclick">
<template #tableTitle>
<div>
<TableActionBar :selectRow="getVxeSelectRows" :reload="reload">
@ -236,9 +237,7 @@
</template>
</BasicTable>
<!-- 合计 -->
<div class="static-box">
<h5 v-if="calcData.length" style="position: absolute; bottom: 68px; left: 22px">合计</h5>
<a-table class="ds-table" :columns="calcColumns" :data-source="calcData" :pagination="false"></a-table>
<a-table class="static-box" :columns="calcColumns" :data-source="calcData" :pagination="false"></a-table>
</div>
<!-- 多提单号查询 -->
<a-modal class="ds-modal-small" title="多提单号查询" :maskClosable="false" :width="400" :visible="moreNumVisible"
@ -335,8 +334,6 @@ import { formatParams } from '/@/hooks/web/common'
const appStore = useAppStore()
const { createMessage } = useMessage()
const go = useGo()
// 空数据表格高度
const tbHeight = window.innerHeight - 310
// 合计列
const calcColumns = [
{
@ -508,10 +505,10 @@ const [registerTable, { reload, getVxeSelectRows, setLoading }] = useTable({
width: 60,
},
canResize: true,
resizeHeightOffset: 75,
resizeHeightOffset: 131,
immediate: false,
tableComponent: 'vxe',
autoHeight: tbHeight,
autoHeight: window.innerHeight - 416.5,
id: '0',
actionColumn: {
width: 60,
@ -657,6 +654,7 @@ onActivated(() => {
<style lang="less">
.ds-sea-export-table {
padding: 20px;
height: 100%;
.TIJIAO {
@ -699,9 +697,7 @@ onActivated(() => {
}
.static-box {
position: fixed;
bottom: 0;
padding-left: 20px;
margin-bottom: 20px;
}
.icon-fuzhi3 {

Write Preview
Loading…
Cancel
Save