commit | author | age
|
4d51af
|
1 |
<template> |
I |
2 |
<a-modal title="新增友情链接" :width="900" :visible="visible" :confirmLoading="confirmLoading" @ok="handleSubmit" |
|
3 |
@cancel="handleCancel"> |
|
4 |
<a-spin :spinning="confirmLoading"> |
|
5 |
<a-form :form="form"> |
|
6 |
<a-form-item label="名称" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback> |
|
7 |
<a-input placeholder="请输入名称" v-decorator="['name', {rules: [{required: true, message: '请输入名称!'}]}]" /> |
|
8 |
</a-form-item> |
|
9 |
<a-form-item label="url地址" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback> |
|
10 |
<a-input placeholder="请输入url地址" v-decorator="['url', {rules: [{required: true, message: '请输入url地址!'}]}]" /> |
|
11 |
</a-form-item> |
|
12 |
<a-form-item label="头像地址" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback> |
|
13 |
<a-input placeholder="请输入头像地址" |
|
14 |
v-decorator="['avatar', {rules: [{required: false, message: '请输入头像地址!'}]}]" /> |
|
15 |
</a-form-item> |
|
16 |
<a-form-item label="描述" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback> |
|
17 |
<a-input placeholder="请输入描述" v-decorator="['remark', {rules: [{required: false, message: '请输入描述!'}]}]" /> |
|
18 |
</a-form-item> |
|
19 |
<a-form-item label="链接类型" :labelCol="labelCol" :wrapperCol="wrapperCol"> |
|
20 |
<a-radio-group placeholder="请选择链接类型" |
|
21 |
v-decorator="['linkType',{rules: [{ required: true, message: '请选择链接类型!' }]}]"> |
|
22 |
<a-radio v-for="(item,index) in linkTypeData" :key="index" :value="item.code">{{ item.name }}</a-radio> |
|
23 |
</a-radio-group> |
|
24 |
</a-form-item> |
|
25 |
<a-form-item label="权重" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback> |
|
26 |
<a-input placeholder="请输入权重" v-decorator="['topValue', {rules: [{required: true, message: '请输入权重!'}]}]" /> |
|
27 |
</a-form-item> |
|
28 |
<a-form-item label="是否新窗口打开" :labelCol="labelCol" :wrapperCol="wrapperCol"> |
|
29 |
<a-radio-group placeholder="请选择是否新窗口打开" |
|
30 |
v-decorator="['isNewWindowOpen',{rules: [{ required: true, message: '请选择是否新窗口打开!' }]}]"> |
|
31 |
<a-radio v-for="(item,index) in isNewWindowOpenData" :key="index" :value="item.code">{{ item.name }} |
|
32 |
</a-radio> |
|
33 |
</a-radio-group> |
|
34 |
</a-form-item> |
|
35 |
</a-form> |
|
36 |
</a-spin> |
|
37 |
</a-modal> |
|
38 |
</template> |
|
39 |
|
|
40 |
<script> |
|
41 |
import { |
|
42 |
blogFriendshipLinkAdd |
|
43 |
} from '@/api/modular/main/blogfriendshiplink/blogFriendshipLinkManage' |
|
44 |
export default { |
|
45 |
data() { |
|
46 |
return { |
|
47 |
labelCol: { |
|
48 |
xs: { |
|
49 |
span: 24 |
|
50 |
}, |
|
51 |
sm: { |
|
52 |
span: 5 |
|
53 |
} |
|
54 |
}, |
|
55 |
wrapperCol: { |
|
56 |
xs: { |
|
57 |
span: 24 |
|
58 |
}, |
|
59 |
sm: { |
|
60 |
span: 15 |
|
61 |
} |
|
62 |
}, |
|
63 |
linkTypeData: [], |
|
64 |
isNewWindowOpenData: [], |
|
65 |
visible: false, |
|
66 |
confirmLoading: false, |
|
67 |
form: this.$form.createForm(this) |
|
68 |
} |
|
69 |
}, |
|
70 |
methods: { |
|
71 |
// 初始化方法 |
|
72 |
add(record) { |
|
73 |
this.visible = true |
|
74 |
const linkTypeOption = this.$options |
|
75 |
this.linkTypeData = linkTypeOption.filters['dictData']('blog_link_type') |
|
76 |
const isNewWindowOpenOption = this.$options |
|
77 |
this.isNewWindowOpenData = isNewWindowOpenOption.filters['dictData']('blog_yes_or_no') |
|
78 |
}, |
|
79 |
/** |
|
80 |
* 提交表单 |
|
81 |
*/ |
|
82 |
handleSubmit() { |
|
83 |
const { |
|
84 |
form: { |
|
85 |
validateFields |
|
86 |
} |
|
87 |
} = this |
|
88 |
this.confirmLoading = true |
|
89 |
validateFields((errors, values) => { |
|
90 |
if (!errors) { |
|
91 |
for (const key in values) { |
|
92 |
if (typeof(values[key]) === 'object' && values[key] != null) { |
|
93 |
values[key] = JSON.stringify(values[key]) |
|
94 |
} |
|
95 |
} |
|
96 |
blogFriendshipLinkAdd(values).then((res) => { |
|
97 |
if (res.success) { |
|
98 |
this.$message.success('新增成功') |
|
99 |
this.confirmLoading = false |
|
100 |
this.$emit('ok', values) |
|
101 |
this.handleCancel() |
|
102 |
} else { |
|
103 |
this.$message.error('新增失败') // + res.message |
|
104 |
} |
|
105 |
}).finally((res) => { |
|
106 |
this.confirmLoading = false |
|
107 |
}) |
|
108 |
} else { |
|
109 |
this.confirmLoading = false |
|
110 |
} |
|
111 |
}) |
|
112 |
}, |
|
113 |
handleCancel() { |
|
114 |
this.form.resetFields() |
|
115 |
this.visible = false |
|
116 |
} |
|
117 |
} |
|
118 |
} |
|
119 |
</script> |