guoxiangbin
/
ocr-web
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity
Labels Milestones
New Pull Request

fix:样式修改 #324

Merged
yaoshuli merged 1 commits from fix/change_task into test 1 year ago
Conversation 0 Commits 1 Files Changed 11
11 changed files with 132 additions and 29 deletions
Show Stats Download Patch File Download Diff File

BIN
src/assets/images/actorbg.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 29 KiB

23
src/layout/components/Header/UserSettings.vue
Unescape View File

@ -131,7 +131,7 @@ const options = computed(() => {
<n-avatar <n-avatar
:src="(useInfo.usericon && getImgUrl(useInfo.usericon)) || defaultAvatar" :src="(useInfo.usericon && getImgUrl(useInfo.usericon)) || defaultAvatar"
round round
style="width: 53px; height: 53px" style="width: 40px; height: 40px"
/> />
<div style="margin-left: 12px"> <div style="margin-left: 12px">
<span style="display: block" class="user-name">{{ useInfo.username }}</span> <span style="display: block" class="user-name">{{ useInfo.username }}</span>
@ -140,7 +140,7 @@ const options = computed(() => {
</div> </div>
<div class="trigger"> <div class="trigger">
<span>{{ currentCompanyName }}</span> <span>{{ currentCompanyName }}</span>
<span style="cursor: pointer" @click="changeFlag = !changeFlag"><SvgIcon name="switchCompany" size="24" /></span> <span style="cursor: pointer" @click="changeFlag = !changeFlag"><SvgIcon name="switchCompany" size="18" /></span>
</div> </div>
<div class="item"> <div class="item">
<span>AI设置开关</span> <span>AI设置开关</span>
@ -149,19 +149,20 @@ const options = computed(() => {
<div class="trigger"> <div class="trigger">
联系我们 联系我们
</div> </div>
<n-divider style="margin-top: 0px; margin-bottom: 10px; padding: 0 22px" /> <n-divider style="margin-top: 0px; margin-bottom: 0px; padding: 0 22px" />
<div class="trigger" @click="logOut"> <div class="trigger" @click="logOut">
退出登录 退出登录
</div> </div>
<div <div
v-show="changeFlag" v-show="changeFlag"
class="container sub-container" class="container sub-container"
style="position: absolute; right: 17vw; width: 11.5vw; padding: 24px 0" style="position: absolute; right: 15vw;top:7vh; width: 163px; padding: 24px 0;border-radius:0;height:144px"
> >
<div <div
v-for="option in options" v-for="option in options"
:key="option.key" :key="option.key"
class="trigger" class="trigger"
style="margin-top: -84px;"
@click="handleSelect(option)" @click="handleSelect(option)"
> >
{{ option.label }} {{ option.label }}
@ -176,11 +177,9 @@ const options = computed(() => {
.header { .header {
.user-name { .user-name {
font-size: 16px; font-size: 16px;
font-weight: 600;
} }
.depart-name { .depart-name {
font-size: 12px; font-size: 12px;
font-weight: 600;
} }
} }
} }
@ -196,25 +195,27 @@ const options = computed(() => {
border-radius: 10px; border-radius: 10px;
justify-content: center; justify-content: center;
background-color: #ffffff; background-color: #ffffff;
width: 16vw; width: 240px;
height: 225px;
position: relative; position: relative;
.header { .header {
border-radius: 10px 10px 0px 0px; border-radius: 10px 10px 0px 0px;
background: linear-gradient(122deg, #4867ff 5%, #a0b3ff 100%); background: url("../../../assets/images/actorbg.png") no-repeat;
background-size: 100%;
padding: 10px 20px; padding: 10px 20px;
display: flex; display: flex;
align-items: center; align-items: center;
margin-bottom: 14px; margin-bottom: 10px;
color: #ffffff; color: #ffffff;
height: 80px; height: 60px;
} }
.trigger, .trigger,
.item { .item {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding: 13px 20px; padding: 9px 17px;
cursor: pointer; cursor: pointer;
color: #333333; color: #333333;
font-size: 13px; font-size: 13px;

24
src/views/final/comp/FilterModal.vue
Unescape View File

@ -528,5 +528,29 @@ function handleOk() {
::v-deep(.n-data-table .n-data-table-th .n-data-table-sorter) { ::v-deep(.n-data-table .n-data-table-th .n-data-table-sorter) {
position: relative; position: relative;
left: -80px; left: -80px;
}
::v-deep(.n-dropdown){
width: 76px;
height: 84px;
background: #ffffff;
box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.15);
>div{
margin-left: 8px;
margin-right: 8px;
text-align: center;
height: 50%;
color: #666666;
border-bottom: none;
margin-top: 2px;
}
>div:not(:last-child){
margin-left: 8px;
margin-right: 8px;
text-align: center;
height: 50%;
color: #666666;
border-bottom: 1px solid #eeeeee;
}
} }
</style> </style>

19
src/views/final/comp/NewFilterModal.vue
Unescape View File

@ -363,6 +363,8 @@ defineExpose({
:style="noBorderInput" :style="noBorderInput"
icon-placement="right" icon-placement="right"
@click="removeCondition(index)" @click="removeCondition(index)"
style=" padding: 0;
margin-left: 17px;"
> >
<template #icon> <template #icon>
<SvgIcon size="24" name="close" /> <SvgIcon size="24" name="close" />
@ -373,15 +375,16 @@ defineExpose({
</div> </div>
<div class="wrapper-new" @click="createCondition"> <div class="wrapper-new" @click="createCondition">
<span style="font-size: 16px">+</span> <span style="font-size: 16px">+</span>
<span style="margin-left: 8px">添加筛选条件</span> <span style="margin-left: 8px;margin-bottom: 40px;">添加筛选条件</span>
</div> </div>
</div> </div>
<div class="bottomline"></div>
<template #footer> <template #footer>
<div class="wrapper-footer"> <div class="wrapper-footer">
<n-button type="info" @click="handleSumbit"> <n-button style="background-color: #507afd;width: 72px;height: 38px;" type="info" @click="handleSumbit">
保存 保存
</n-button> </n-button>
<n-button secondary style="margin-left: 15px" @click="closeModal"> <n-button secondary style="margin-left: 15px ;width: 72px;height: 38px;" @click="closeModal">
取消 取消
</n-button> </n-button>
</div> </div>
@ -422,7 +425,7 @@ defineExpose({
line-height: 22px; line-height: 22px;
cursor: pointer; cursor: pointer;
span { span {
font-size: 11px; font-size: 14px;
} }
&:hover { &:hover {
@ -455,6 +458,14 @@ defineExpose({
} }
} }
} }
.bottomline{
width: 100%;
height: 0.5px;
background: #d9d9d9;
position: absolute;
left: 0;
bottom: 69.5px;
}
::v-deep(.n-form-item .n-form-item-label) { ::v-deep(.n-form-item .n-form-item-label) {
font-size: 14px; font-size: 14px;
color: #666666; color: #666666;

12
src/views/home/aside/comp/modals/FilterModal.vue
Unescape View File

@ -618,10 +618,22 @@ height: 84px;
background: #ffffff; background: #ffffff;
box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.15); box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.15);
>div{ >div{
margin-left: 8px;
margin-right: 8px;
text-align: center;
height: 50%;
color: #666666;
border-bottom: none;
margin-top: 2px;
}
>div:not(:last-child){
margin-left: 8px;
margin-right: 8px;
text-align: center; text-align: center;
height: 50%; height: 50%;
color: #666666; color: #666666;
border-bottom: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee;
} }
} }
</style> </style>

19
src/views/home/aside/comp/modals/NewFilterModal.vue
Unescape View File

@ -27,6 +27,7 @@ const cardStyle = {
} }
const noBorderInput = { const noBorderInput = {
'--n-border': '0px', '--n-border': '0px',
'--n-border-hover': '0px', '--n-border-hover': '0px',
'--n-border-pressed': '0px', '--n-border-pressed': '0px',
@ -395,11 +396,14 @@ defineExpose({
:style="noBorderInput" :style="noBorderInput"
icon-placement="right" icon-placement="right"
@click="removeCondition(index)" @click="removeCondition(index)"
style=" padding: 0;
margin-left: 17px;"
> >
<template #icon> <template #icon>
<!-- <SvgIcon size="24" name="close" color="#F00"/> <!-- <SvgIcon size="24" name="close" color="#F00"/>
--> -->
<svg <svg
width="24px" width="24px"
height="24px" height="24px"
viewBox="0 0 64 64" viewBox="0 0 64 64"
@ -449,9 +453,10 @@ defineExpose({
<span style="margin-left: 8px">添加筛选条件</span> <span style="margin-left: 8px">添加筛选条件</span>
</div> </div>
</div> </div>
<div class="bottomline"></div>
<template #footer> <template #footer>
<div class="wrapper-footer"> <div class="wrapper-footer">
<n-button style="background-color: #507afd" type="info" @click="handleSumbit"> <n-button style="background-color: #507afd;width: 72px;height: 38px;" type="info" @click="handleSumbit">
保存 保存
</n-button> </n-button>
<n-button <n-button
@ -461,6 +466,7 @@ defineExpose({
background-color: #ffffff; background-color: #ffffff;
border: 1px solid #cad2dd; border: 1px solid #cad2dd;
color: #333333; color: #333333;
;width: 72px;height: 38px;
" "
@click="closeModal" @click="closeModal"
> >
@ -504,7 +510,7 @@ defineExpose({
line-height: 22px; line-height: 22px;
cursor: pointer; cursor: pointer;
span { span {
font-size: 11px; font-size: 14px;
} }
&:hover { &:hover {
color: #507aac; color: #507aac;
@ -549,8 +555,15 @@ defineExpose({
width: 808px !important; width: 808px !important;
height: 432px !important; height: 432px !important;
} }
::v-deep(.n-card__content) { .bottomline{
width: 100%;
height: 0.5px;
background: #d9d9d9;
position: absolute;
left: 0;
bottom: 69.5px;
} }
.modal_wrapper { .modal_wrapper {
padding: 14px 14px 0 14px !important; padding: 14px 14px 0 14px !important;
} }

15
src/views/home/content/Content.vue
Unescape View File

@ -776,7 +776,13 @@ function previewImageUrl(img1, img2) {
img.src = img2 img.src = img2
}, 50) }, 50)
} }
function renderToolbar ( nodes ) {
return [
nodes.prev,
nodes.next,
]
};
defineExpose({ defineExpose({
showLoginSuccessModal, showLoginSuccessModal,
closeLoginSuccessModal, closeLoginSuccessModal,
@ -871,6 +877,7 @@ defineExpose({
<n-image <n-image
ref="imageRef" ref="imageRef"
:renderToolbar="renderToolbar"
:key="item.imgUrl" :key="item.imgUrl"
class="img" class="img"
:img-props="{ :img-props="{
@ -888,6 +895,7 @@ defineExpose({
:fallback-src="bgLoadingImg" :fallback-src="bgLoadingImg"
:style="{ backgroundImage: `url(${loading ? bgLoadingImg : 'none'})` }" :style="{ backgroundImage: `url(${loading ? bgLoadingImg : 'none'})` }"
style="display: none" style="display: none"
/> />
<img <img
@ -991,8 +999,10 @@ defineExpose({
<n-image <n-image
ref="imageRef" ref="imageRef"
:renderToolbar="renderToolbar"
:key="item.imgUrl" :key="item.imgUrl"
class="img" class="img"
:img-props="{ :img-props="{
onClick: ($event) => { onClick: ($event) => {
hideDownload($event); hideDownload($event);
@ -1008,6 +1018,7 @@ defineExpose({
:fallback-src="bgLoadingImg" :fallback-src="bgLoadingImg"
:style="{ backgroundImage: `url(${loading ? bgLoadingImg : 'none'})` }" :style="{ backgroundImage: `url(${loading ? bgLoadingImg : 'none'})` }"
style="display: none" style="display: none"
/> />
<img <img
@ -1407,4 +1418,8 @@ defineExpose({
top: 20%; top: 20%;
z-index: 10000000000000000000; z-index: 10000000000000000000;
} }
/*::v-deep(.n-image-preview-toolbar .n-base-icon:nth-last-child(2)){
display: none;
}*/
</style> </style>

4
src/views/home/content/modal/PackageSettingsModal.vue
Unescape View File

@ -219,7 +219,11 @@ function afterLeave() {
} }
} }
} }
::v-deep(.n-form-item .n-form-item-label .n-form-item-label__asterisk){
position: absolute;
left: 15px;
}
::v-deep(.n-button--info-type) { ::v-deep(.n-button--info-type) {
} }
</style> </style>

19
src/views/task/modal/NewFilterModal.vue
Unescape View File

@ -361,6 +361,8 @@ defineExpose({
:style="noBorderInput" :style="noBorderInput"
icon-placement="right" icon-placement="right"
@click="removeCondition(index)" @click="removeCondition(index)"
style=" padding: 0;
margin-left: 17px;"
> >
<template #icon> <template #icon>
<SvgIcon size="24" name="close" /> <SvgIcon size="24" name="close" />
@ -374,12 +376,14 @@ defineExpose({
<span style="margin-left: 8px">添加筛选条件</span> <span style="margin-left: 8px">添加筛选条件</span>
</div> </div>
</div> </div>
<div class="bottomline"></div>
<template #footer> <template #footer>
<div class="wrapper-footer"> <div class="wrapper-footer">
<n-button type="info" @click="handleSumbit"> <n-button type="info" @click="handleSumbit" style="width: 72px;height: 38px;
">
保存 保存
</n-button> </n-button>
<n-button secondary style="margin-left: 15px" @click="closeModal"> <n-button secondary style="margin-left: 15px ;width: 72px;height: 38px;" @click="closeModal" >
取消 取消
</n-button> </n-button>
</div> </div>
@ -420,7 +424,7 @@ defineExpose({
line-height: 22px; line-height: 22px;
cursor: pointer; cursor: pointer;
span { span {
font-size: 11px; font-size: 14px;
} }
&:hover { &:hover {
color: #507aac; color: #507aac;
@ -456,7 +460,14 @@ defineExpose({
width: 808px !important; width: 808px !important;
height: 432px !important; height: 432px !important;
} }
.bottomline{
width: 100%;
height: 0.5px;
background: #d9d9d9;
position: absolute;
left: 0;
bottom: 69.5px;
}
.modal_wrapper { .modal_wrapper {
padding: 14px 14px 0 14px !important; padding: 14px 14px 0 14px !important;
} }

7
src/views/worksheet/aside/Aside.vue
Unescape View File

@ -242,6 +242,7 @@ if (searchContent) {
/> />
</div> </div>
</div> </div>
<div class="topline"></div>
<WorkSheetList <WorkSheetList
ref="packageListRef" ref="packageListRef"
class="work-sheet-list" class="work-sheet-list"
@ -318,5 +319,11 @@ if (searchContent) {
right: -20px; right: -20px;
z-index: 10; z-index: 10;
} }
.topline{
border-top: 1px solid #e8e8e8;
width: 100%;
height: 1px;
padding-bottom: 16px;
}
} }
</style> </style>

19
src/views/worksheet/aside/ListItem.vue
Unescape View File

@ -72,7 +72,10 @@ onMounted(async () => {})
<div v-for="(item, index) in showFieldList" :key="index"> <div v-for="(item, index) in showFieldList" :key="index">
<div v-if="item.id === 'name'" class="list-item-header"> <div v-if="item.id === 'name'" class="list-item-header">
<div class="id-wrap"> <div class="id-wrap">
<SvgIcon :name="svgName" size="28" /> <SvgIcon :name="svgName" size="22"
style="
margin-top: -8px;"
/>
<span <span
class="list-item-header-name" class="list-item-header-name"
:class="{ 'list-item-header-selected': selected }" :class="{ 'list-item-header-selected': selected }"
@ -162,10 +165,10 @@ onMounted(async () => {})
</ul> </ul>
</div> </div>
<template v-if="showFieldList?.length > 6"> <template v-if="showFieldList?.length > 6">
<div class="absolute bottom-0 py-[8px] pl-[36px] text-[#666] item-action"> <div class="absolute bottom-0 py-[8px] pl-[20px] text-[#666] item-action">
<span class="cursor-pointer" @click.stop="showFull = !showFull"> <span style="font-size:13px" class="cursor-pointer" @click.stop="showFull = !showFull">
<SvgIcon v-if="showFull" style="margin-left: 6px" name="expand" size="16" /> <SvgIcon v-if="showFull" style="margin-left: 6px" name="expand" size="11" />
<SvgIcon v-else style="margin-left: 6px" name="collapse" size="16" /> <SvgIcon v-else style="margin-left: 6px" name="collapse" size="11" />
{{ showFull ? "收起" : "展开" }} {{ showFull ? "收起" : "展开" }}
</span> </span>
</div> </div>
@ -189,7 +192,8 @@ onMounted(async () => {})
<style lang="less" scoped> <style lang="less" scoped>
.list-item { .list-item {
padding: 10px 0px 30px 8px; margin-left: 16px;
padding: 10px 0px 30px 0px;
position: relative; position: relative;
border-bottom: 1px solid #e8e8e8; border-bottom: 1px solid #e8e8e8;
// · transition: height: 0.2s ease-out; // · transition: height: 0.2s ease-out;
@ -201,6 +205,7 @@ onMounted(async () => {})
&-header { &-header {
display: flex; display: flex;
align-items: center; align-items: center;
margin-left: 6px;
.id-wrap { .id-wrap {
display: flex; display: flex;
@ -257,7 +262,7 @@ onMounted(async () => {})
} }
&-detail { &-detail {
margin-left: 36px; margin-left: 28px;
li { li {
color: #666666; color: #666666;

Write Preview
Loading…
Cancel
Save