1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
| <template>
| <div class="layout">
| <Form ref="formValidate" :label-width="150" label-position="right" :model="formValidate" :rules="ruleValidate">
| <FormItem label="云IM地址" prop="httpUrl">
| <Input v-model="formValidate.httpUrl"/>
| <span class="desc">配置买家端联系客服以及商家端登录客服跳转的路径</span>
| </FormItem>
|
| <div class="label-btns">
| <Button type="primary" @click="submit('formValidate')">保存</Button>
| </div>
| </Form>
| </div>
| </template>
| <script>
| import {setSetting} from "@/api/index";
| import {handleSubmit} from "./validate";
|
| export default {
| data() {
| return {
| ruleValidate: {}, // 验证规则
| formValidate: { // 表单数据
| httpUrl: ""
| },
| result:"",
| };
| },
| props: ["res", "type"],
| created() {
| this.init();
| },
| methods: {
| // 保存
| submit(name) {
| let that = this;
| if (handleSubmit(that, name)) {
| this.setupSetting()
| }
| },
| // 保存设置
| setupSetting() {
| setSetting(this.type, this.formValidate).then((res) => {
| if (res.success) {
| this.$Message.success("保存成功!");
| } else {
| this.$Message.error("保存失败!");
| }
| });
| },
| // 实例化数据
| init() {
| this.result = JSON.parse(this.res);
|
| this.$set(this, "formValidate", {...this.result});
| Object.keys(this.formValidate).forEach((item) => {
| this.ruleValidate[item] = [
| {
| required: true,
| message: "请填写必填项",
| trigger: "blur",
| },
| ];
| });
| },
| },
| };
| </script>
|
| <style lang="scss" scoped>
| @import "./style.scss";
|
| .label-item {
| display: flex;
| }
|
| /deep/ .ivu-input {
| width: 300px !important;
| margin: 0 10px;
| }
|
| .ivu-input-wrapper {
| width: 300px;
| margin-right: 10px;
| }
| </style>
|
|
