|
|
|
@ -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;
|
|
|
|
|
// label自带padding-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>
|
|
|
|
|