Compare commits

...

5 Commits

@ -90,13 +90,13 @@ const getThemeOverrides = computed(() => {
// transform: rotate(-90deg) !important;
// }
.n-scrollbar-content {
padding: 0 7.97px 0 4px;
padding: 0 7.97px 16 16px;
}
.n-form-item .n-form-item-label {
font-size: 14px !important;
color: #333333 !important;
}
.n-slider-dots > .n-slider-dot:nth-child(2) {
.n-slider-dots > .n-slider-dot {
display: none !important;
}
.n-collapse-item-arrow i svg {

@ -1,6 +1,15 @@
<script lang="ts">
import { useDialog, useMessage } from 'naive-ui'
import { defineComponent, inject, onMounted, reactive, ref, toRefs, unref, watch } from 'vue'
import {
defineComponent,
inject,
onMounted,
reactive,
ref,
toRefs,
unref,
watch,
} from 'vue'
import { useRoute, useRouter } from 'vue-router'
import QuillModal from './QuillModal.vue'
import RecycleModal from './RecycleModal.vue'
@ -198,6 +207,7 @@ export default defineComponent({
<!-- 菜单收起 -->
<div
class="ml-1 layout-header-trigger layout-header-trigger-min"
style="padding-left: 13px"
@click="() => $emit('update:collapsed', !collapsed)"
>
<SvgIcon name="homepage" size="16" />
@ -227,7 +237,11 @@ export default defineComponent({
<!-- 个人中心 -->
<div class="layout-header-trigger layout-header-trigger-min">
<!-- <n-avatar :src="getImgUrl(useInfo.usericon)" round /> -->
<n-avatar style="width:36px;height:36px;" :src="(useInfo.usericon && getImgUrl(useInfo.usericon)) || defaultAvatarSrc" round />
<n-avatar
style="width: 36px; height: 36px"
:src="(useInfo.usericon && getImgUrl(useInfo.usericon)) || defaultAvatarSrc"
round
/>
</div>
<!-- 设置 -->
<UserSettings @logout="doLogout" />

@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { FormInst, FormRules } from 'naive-ui';
import { useMessage } from 'naive-ui';
import { ref } from 'vue';
import type { FormInst, FormRules } from 'naive-ui'
import { useMessage } from 'naive-ui'
import { ref } from 'vue'
const emit = defineEmits<{
(e: 'commit', value: any)
@ -72,18 +72,38 @@ function afterLeave() {
<template>
<n-modal v-model:show="show" transform-origin="center" @after-leave="afterLeave">
<n-card :style="cardStyle" :bordered="false" size="huge" role="dialog" aria-modal="true">
<n-card
:style="cardStyle"
:bordered="false"
size="huge"
role="dialog"
aria-modal="true"
>
<div class="wrapper">
<span class="wrapper-title">生成任务包设置</span>
<div class="wrapper-bar">
<div class="wrapper-info">
<span :style="{ 'margin-left': '18px', 'font-size': '16px','font-weight':'600' }">基本信息</span>
<span
:style="{
'margin-left': '18px',
'font-size': '16px',
'font-weight': '600',
}"
>基本信息</span>
</div>
</div>
<!-- require-mark-placement="left" -->
<n-form ref="formRef" :model="model" style="margin-top: 8px;" :rules="rules">
<n-form-item class="wrapper-task-package-name" path="packagename" label="任务包名称">
<n-input v-model:value="model.packagename" maxlength="12" @keydown.enter.prevent />
<n-form ref="formRef" :model="model" style="margin-top: 8px" :rules="rules">
<n-form-item
class="wrapper-task-package-name"
path="packagename"
label="任务包名称"
>
<n-input
v-model:value="model.packagename"
maxlength="12"
@keydown.enter.prevent
/>
</n-form-item>
<!-- <n-form-item path="mark" :style="formItemStyle">
<n-checkbox v-model:checked="model.mark" >
@ -94,10 +114,23 @@ function afterLeave() {
</div>
<template #footer>
<div class="wrapper-footer">
<n-button style="background-color: #507AFD !important;" type="info" @click="handleSumbit">
<n-button
style="background-color: #507afd !important"
type="info"
@click="handleSumbit"
>
生成任务包
</n-button>
<n-button secondary style="margin-left:15px;color: #333;background-color: #fff;border: 1px solid #CAD2DD;" @click="closeModal">
<n-button
secondary
style="
margin-left: 15px;
color: #333;
background-color: #fff;
border: 1px solid #cad2dd;
"
@click="closeModal"
>
取消
</n-button>
</div>
@ -110,7 +143,7 @@ function afterLeave() {
.wrapper {
display: flex;
flex-direction: column;
padding: 14px 14px 0 14px ;
padding: 14px 14px 0 14px;
&-title {
font-weight: 600;
// font-weight: bold;
@ -123,7 +156,8 @@ function afterLeave() {
width: 100%;
margin-top: 24px;
font-size: 16px;
margin-bottom: 16px;
// margin-top:8px;
margin-bottom: 8px;
span {
color: #333;
}
@ -139,7 +173,8 @@ function afterLeave() {
::v-deep(.n-form-item-label) {
color: #666;
font-weight: 500;
margin-bottom: 8px;
// labelpadding-bottom 2px 8-2
margin-bottom: 6px;
}
}
@ -162,8 +197,8 @@ function afterLeave() {
&-footer {
display: flex;
justify-content: flex-end;
padding-bottom:6px ;
button{
padding-bottom: 6px;
button {
font-size: 14px !important;
font-weight: 500 !important;
}
@ -174,7 +209,7 @@ function afterLeave() {
position: relative;
&:before {
background-color: #1980FF;
background-color: #1980ff;
content: "";
width: 5px;
border-radius: 2px;
@ -185,7 +220,6 @@ function afterLeave() {
}
}
::v-deep(.n-button--info-type){
::v-deep(.n-button--info-type) {
}
</style>

@ -1,50 +1,50 @@
<script lang="ts" setup>
import { ref } from "vue";
import { useConfig } from "@/store/modules/asideConfig";
import { ref } from 'vue'
import { useConfig } from '@/store/modules/asideConfig'
const emit = defineEmits<{
(e: "closeCallback", value: any);
}>();
(e: 'closeCallback', value: any)
}>()
const show = ref(false);
const show = ref(false)
const stys = {
width: "424px",
height: "232px",
"--n-padding-bottom": "20px",
"--n-padding-left": "0px",
background:
"linear-gradient(132deg, rgba(255, 255, 255, 0.32) 21%, rgba(152, 172, 255, 0.14) 100%)",
"border-radius": "4px",
"box-shadow": "0px 12px 48px 16px rgba(0, 0, 0, 0.03)",
"backdrop-filter": " blur(10px)",
};
'width': '424px',
'height': '232px',
'--n-padding-bottom': '20px',
'--n-padding-left': '0px',
'background':
'linear-gradient(132deg, rgba(255, 255, 255, 0.32) 21%, rgba(152, 172, 255, 0.14) 100%)',
'border-radius': '4px',
'box-shadow': '0px 12px 48px 16px rgba(0, 0, 0, 0.03)',
'backdrop-filter': ' blur(10px)',
}
function showModal() {
show.value = true;
show.value = true
}
function closeModal() {
show.value = false;
emit("closeCallback", true);
show.value = false
emit('closeCallback', true)
}
function closeOnlyModal() {
show.value = false;
show.value = false
}
defineExpose({
showModal,
closeModal,
closeOnlyModal,
});
})
const configStore = useConfig();
const percent = ref(0);
const configStore = useConfig()
const percent = ref(0)
configStore.$subscribe(() => {
percent.value = configStore.getTimeNum;
});
percent.value = configStore.getTimeNum
})
</script>
<template>
@ -58,13 +58,13 @@ configStore.$subscribe(() => {
<svg-icon
size="15"
name="close"
@click="closeModal"
style="position: absolute; right: 15.7px; top: 6px; cursor: pointer"
@click="closeModal"
/>
<div class="wrapper">
<svg-icon size="90" name="robot2" />
<span style="margin-top: 24px">正在查重中</span>
</div>
<span class="span_box">正在查重中</span>
<div style="padding: 0 20px">
<n-progress type="line" :percentage="percent" :show-indicator="false" />
</div>
@ -74,10 +74,22 @@ configStore.$subscribe(() => {
<style lang="less" scoped>
.wrapper {
width: 100%;
height: 95px;
display: flex;
height: 100%;
flex-direction: column;
justify-content: center;
align-items: center;
}
.span_box {
display: flex;
justify-content: center;
}
.n-modal {
// 360*157 20px
width: 360px !important;
height: 157px !important;
}
.n-modal > .n-card > .n-card__content:first-child {
--n-padding-top: 16px !important;
}
</style>

Loading…
Cancel
Save