Skip to content

Commit 419b56b

Browse files
committed
feat: ak sk feature
1 parent 8a8c281 commit 419b56b

4 files changed

Lines changed: 112 additions & 85 deletions

File tree

components.d.ts

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,8 @@ declare module 'vue' {
1212
NButton: typeof import('naive-ui')['NButton']
1313
NButtonGroup: typeof import('naive-ui')['NButtonGroup']
1414
NCard: typeof import('naive-ui')['NCard']
15+
NCheckbox: typeof import('naive-ui')['NCheckbox']
16+
NCheckboxGroup: typeof import('naive-ui')['NCheckboxGroup']
1517
NConfigProvider: typeof import('naive-ui')['NConfigProvider']
1618
NDataTable: typeof import('naive-ui')['NDataTable']
1719
NDatePicker: typeof import('naive-ui')['NDatePicker']
@@ -24,11 +26,13 @@ declare module 'vue' {
2426
NFlex: typeof import('naive-ui')['NFlex']
2527
NForm: typeof import('naive-ui')['NForm']
2628
NFormItem: typeof import('naive-ui')['NFormItem']
29+
NFormItemGi: typeof import('naive-ui')['NFormItemGi']
2730
NFormItemGridItem: typeof import('naive-ui')['NFormItemGridItem']
2831
NGrid: typeof import('naive-ui')['NGrid']
2932
NInput: typeof import('naive-ui')['NInput']
3033
NInputGroup: typeof import('naive-ui')['NInputGroup']
3134
NInputGroupLabel: typeof import('naive-ui')['NInputGroupLabel']
35+
NInputNumber: typeof import('naive-ui')['NInputNumber']
3236
NLayout: typeof import('naive-ui')['NLayout']
3337
NLayoutSider: typeof import('naive-ui')['NLayoutSider']
3438
NList: typeof import('naive-ui')['NList']
@@ -40,12 +44,18 @@ declare module 'vue' {
4044
NPageHeader: typeof import('naive-ui')['NPageHeader']
4145
NPopconfirm: typeof import('naive-ui')['NPopconfirm']
4246
NProgress: typeof import('naive-ui')['NProgress']
47+
NRadio: typeof import('naive-ui')['NRadio']
48+
NRadioButton: typeof import('naive-ui')['NRadioButton']
49+
NRadioGroup: typeof import('naive-ui')['NRadioGroup']
4350
NSelect: typeof import('naive-ui')['NSelect']
51+
NSlider: typeof import('naive-ui')['NSlider']
4452
NSpace: typeof import('naive-ui')['NSpace']
4553
NSpin: typeof import('naive-ui')['NSpin']
4654
NSwitch: typeof import('naive-ui')['NSwitch']
4755
NTabPane: typeof import('naive-ui')['NTabPane']
4856
NTabs: typeof import('naive-ui')['NTabs']
57+
NTimePicker: typeof import('naive-ui')['NTimePicker']
58+
NTransfer: typeof import('naive-ui')['NTransfer']
4959
RouterLink: typeof import('vue-router')['RouterLink']
5060
RouterView: typeof import('vue-router')['RouterView']
5161
}

components/access-keys/edit-item.vue

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { ref } from "vue"
33
const message = useMessage()
44
const emit = defineEmits<Emits>()
55
const { getServiceAccount, updateServiceAccount } = useAccessKeys()
6+
const { $api } = useNuxtApp()
67
78
const visible = ref(false)
89
@@ -27,6 +28,8 @@ async function openDialog(row: any) {
2728
formModel.value.accesskey = row.accessKey
2829
formModel.value.expiry = res.expiration
2930
formModel.value.status = res.accountStatus
31+
// const userInfo = await $api.get(`/accountinfo`)
32+
// formModel.value.policy = userInfo.Policy
3033
visible.value = true
3134
} catch (error) {
3235
message.error("获取数据失败")

components/access-keys/new-item.vue

Lines changed: 96 additions & 81 deletions
Original file line numberDiff line numberDiff line change
@@ -7,64 +7,51 @@
77
class="max-w-screen-md"
88
:segmented="{
99
content: true,
10-
action: true
10+
action: true,
1111
}">
1212
<n-card>
1313
<n-form
14+
ref="formRef"
1415
label-placement="left"
1516
:model="formModel"
17+
:rules="rules"
1618
label-align="center"
1719
:label-width="130">
1820
<n-grid :cols="24" :x-gap="18">
19-
<n-form-item-grid-item :span="24" label="Access Key" path="accessKey">
21+
<n-form-item-gi :span="24" label="Access Key" path="accessKey">
2022
<n-input v-model:value="formModel.accessKey" />
21-
</n-form-item-grid-item>
22-
<n-form-item-grid-item :span="24" label="Secret Key" path="secretKey">
23-
<n-input
24-
v-model:value="formModel.secretKey"
25-
show-password-on="mousedown"
26-
type="password" />
27-
</n-form-item-grid-item>
28-
<n-form-item-grid-item :span="24" label="策略" path="policy">
29-
<n-select
30-
v-model:value="formModel.policy"
31-
filterable
32-
multiple
33-
:options="polices" />
34-
</n-form-item-grid-item>
23+
</n-form-item-gi>
24+
<n-form-item-gi :span="24" label="Secret Key" path="secretKey">
25+
<n-input v-model:value="formModel.secretKey" show-password-on="mousedown" type="password" />
26+
</n-form-item-gi>
3527

36-
<!-- TODO: 时间格式有问题 -->
37-
<n-form-item-grid-item :span="24" label="有效期" path="expiry">
28+
<!-- <n-form-item-gi :span="24" label="策略" path="policy">
29+
<n-select v-model:value="formModel.policy" filterable multiple :options="polices" />
30+
</n-form-item-gi> -->
31+
32+
<n-form-item-gi :span="24" label="有效期" path="expiry">
3833
<n-date-picker
3934
class="!w-full"
4035
v-model:value="formModel.expiry"
4136
:is-date-disabled="dateDisabled"
42-
value-format="yyyy-MM-ddTkk:mm:SSS"
4337
type="datetime"
4438
clearable />
45-
</n-form-item-grid-item>
46-
<n-form-item-grid-item :span="24" label="名称" path="name">
39+
</n-form-item-gi>
40+
<n-form-item-gi :span="24" label="名称" path="name">
4741
<n-input v-model:value="formModel.name" />
48-
</n-form-item-grid-item>
49-
<!-- <n-form-item-grid-item :span="24" label="描述" path="comment">
42+
</n-form-item-gi>
43+
<!-- <n-form-item-gi :span="24" label="描述" path="comment">
5044
<n-input v-model:value="formModel.comment" />
51-
</n-form-item-grid-item> -->
52-
<n-form-item-grid-item :span="24" label="注释" path="description">
45+
</n-form-item-gi> -->
46+
<n-form-item-gi :span="24" label="注释" path="description">
5347
<n-input v-model:value="formModel.description" />
54-
</n-form-item-grid-item>
55-
<!-- <n-form-item-grid-item
56-
:span="24"
57-
label="限制超出用户策略"
58-
path="flag">
59-
<n-switch v-model:value="formModel.flag" />
60-
</n-form-item-grid-item>
61-
<n-form-item-grid-item
62-
v-if="formModel.flag"
63-
:span="24"
64-
label="策略详情"
65-
path="policy">
48+
</n-form-item-gi>
49+
<n-form-item-gi :span="24" label="使用主账户策略" path="impliedPolicy">
50+
<n-switch v-model:value="formModel.impliedPolicy" />
51+
</n-form-item-gi>
52+
<n-form-item-gi v-if="!formModel.impliedPolicy" :span="24" label="当前用户策略" path="policy">
6653
<json-editor v-model="formModel.policy" />
67-
</n-form-item-grid-item> -->
54+
</n-form-item-gi>
6855
</n-grid>
6956
</n-form>
7057
</n-card>
@@ -77,8 +64,9 @@
7764
</n-modal>
7865
</template>
7966
<script setup lang="ts">
80-
import { computed, ref } from 'vue'
81-
import { makeRandomString } from '~/utils/functions'
67+
import type { FormInst, FormItemRule } from "naive-ui"
68+
import { computed, ref } from "vue"
69+
import { makeRandomString } from "~/utils/functions"
8270
8371
interface Props {
8472
visible: boolean
@@ -87,26 +75,50 @@ const { visible } = defineProps<Props>()
8775
const message = useMessage()
8876
const { $api } = useNuxtApp()
8977
const { createServiceAccount } = useAccessKeys()
90-
const { listPolicies } = usePolicies()
91-
const { credentials } = useAuth()
9278
9379
const emit = defineEmits<Emits>()
9480
const defaultFormModal = {
9581
accessKey: makeRandomString(20),
9682
secretKey: makeRandomString(40),
97-
name: '',
98-
description: '',
99-
comment: '',
83+
name: "",
84+
description: "",
85+
// comment: "",
10086
expiry: null,
101-
policy: [],
102-
flag: false
87+
datetimeValue: null,
88+
policy: "",
89+
impliedPolicy: true,
10390
}
10491
const formModel = ref({ ...defaultFormModal })
10592
93+
// 验证
94+
const rules = ref({
95+
accessKey: {
96+
required: true,
97+
trigger: ["blur", "input"],
98+
message: "请输入Access Key",
99+
},
100+
secretKey: {
101+
required: true,
102+
trigger: ["blur", "input"],
103+
message: "请输入Secret Key",
104+
},
105+
expiry: {
106+
required: true,
107+
trigger: ["blur", "change"],
108+
// message: "请选择有效期",
109+
validator(rule: FormItemRule, value: string) {
110+
if (!value) {
111+
return new Error("请选择有效期")
112+
}
113+
return true
114+
},
115+
},
116+
})
117+
106118
interface Emits {
107-
(e: 'update:visible', visible: boolean): void
108-
(e: 'search'): void
109-
(e: 'notice', data: object): void
119+
(e: "update:visible", visible: boolean): void
120+
(e: "search"): void
121+
(e: "notice", data: object): void
110122
}
111123
112124
const modalVisible = computed({
@@ -115,49 +127,52 @@ const modalVisible = computed({
115127
},
116128
set(visible) {
117129
closeModal(visible)
118-
}
130+
},
119131
})
120132
function closeModal(visible = false) {
121-
emit('update:visible', visible)
133+
emit("update:visible", visible)
134+
formModel.value = { ...defaultFormModal, policy: JSON.stringify(parentPolicy.value) }
122135
}
123136
124137
function dateDisabled(ts: number) {
125138
const date = new Date(ts)
126139
return date < new Date()
127140
}
128-
async function submitForm() {
129-
try {
130-
const res = await createServiceAccount({
131-
...formModel.value,
132-
status: 'enabled',
133-
policy: formModel.value.policy.join(','),
134-
expiration: formModel.value.expiry
135-
? new Date(formModel.value.expiry).toISOString()
136-
: null
137-
})
138-
message.success('添加成功')
139-
emit('notice', res)
140-
closeModal()
141-
emit('search')
142-
} catch (error) {
143-
console.log('🚀 ~ submitForm ~ error:', error)
144-
message.error('添加失败')
145-
}
146-
}
147-
148-
// 策略列表
149-
const polices = ref<any[]>([])
150141
151-
const getPoliciesList = async () => {
152-
const res = await listPolicies()
153-
polices.value = Object.keys(res).map((key) => {
154-
return {
155-
label: key,
156-
value: key
142+
const formRef = ref<FormInst | null>(null)
143+
async function submitForm(e: MouseEvent) {
144+
// e.preventDefault()
145+
formRef.value?.validate(async (errors) => {
146+
if (!errors) {
147+
try {
148+
const res = await createServiceAccount({
149+
...formModel.value,
150+
policy: !formModel.value.impliedPolicy ? JSON.stringify(JSON.parse(formModel.value.policy)) : null,
151+
expiration: formModel.value.expiry ? new Date(formModel.value.expiry).toISOString() : null,
152+
})
153+
message.success("添加成功")
154+
emit("notice", res)
155+
closeModal()
156+
emit("search")
157+
} catch (error) {
158+
console.log("🚀 ~ submitForm ~ error:", error)
159+
message.error("添加失败")
160+
}
161+
} else {
162+
console.log(errors)
163+
message.error("请填写正确的格式")
157164
}
158165
})
159166
}
160-
getPoliciesList()
167+
168+
const parentPolicy = ref("")
169+
// 默认策略原文
170+
const getPolicie = async () => {
171+
const userInfo = await $api.get(`/accountinfo`)
172+
parentPolicy.value = userInfo.Policy
173+
formModel.value.policy = JSON.stringify(userInfo.Policy)
174+
}
175+
getPolicie()
161176
</script>
162177

163178
<style scoped></style>

pages/access-keys/index.vue

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -221,7 +221,7 @@ function changePassword() {
221221
/** ***********************************删除 */
222222
async function deleteItem(row: any) {
223223
try {
224-
const res = deleteServiceAccount(row.accessKey)
224+
const res = await deleteServiceAccount(row.accessKey)
225225
226226
message.success("删除成功")
227227
getDataList()
@@ -240,6 +240,7 @@ function handleCheck(keys: DataTableRowKey[]) {
240240
checkedKeys.value = keys
241241
return checkedKeys
242242
}
243+
// 批量删除
243244
function deleteByList() {
244245
dialog.error({
245246
title: "警告",
@@ -252,9 +253,7 @@ function deleteByList() {
252253
return
253254
}
254255
try {
255-
const res = await $api.delete("/service-accounts/delete-multi", {
256-
body: checkedKeys.value,
257-
})
256+
await Promise.all(checkedKeys.value.map((item) => deleteServiceAccount(item as string)))
258257
message.success("删除成功")
259258
getDataList()
260259
} catch (error) {

0 commit comments

Comments
 (0)