样式

src/main/vue/element-variables.scss

@@ -6,19 +6,19 @@
 
 /* Transition
 -------------------------- */
-$--all-transition: all .3s cubic-bezier(.645,.045,.355,1) !default;
+$--all-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1) !default;
 $--fade-transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1) !default;
 $--fade-linear-transition: opacity 200ms linear !default;
 $--md-fade-transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1), opacity 300ms cubic-bezier(0.23, 1, 0.32, 1) !default;
-$--border-transition-base: border-color .2s cubic-bezier(.645,.045,.355,1) !default;
-$--color-transition-base: color .2s cubic-bezier(.645,.045,.355,1) !default;
+$--border-transition-base: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) !default;
+$--color-transition-base: color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) !default;
 
 /* Color
 -------------------------- */
 /// color|1|Brand Color|0
-$--color-primary: #D7AB41 !default;
+$--color-primary: #d7ab41 !default;
 /// color|1|Background Color|4
-$--color-white: #FFFFFF !default;
+$--color-white: #ffffff !default;
 /// color|1|Background Color|4
 $--color-black: #000000 !default;
 $--color-primary-light-1: mix($--color-white, $--color-primary, 10%) !default; /* 53a8ff */
@@ -31,11 +31,11 @@ $--color-primary-light-7: mix($--color-white, $--color-primary, 70%) !default; /
 $--color-primary-light-8: mix($--color-white, $--color-primary, 80%) !default; /* d9ecff */
 $--color-primary-light-9: mix($--color-white, $--color-primary, 90%) !default; /* ecf5ff */
 /// color|1|Functional Color|1
-$--color-success: #67C23A !default;
+$--color-success: #67c23a !default;
 /// color|1|Functional Color|1
-$--color-warning: #E6A23C !default;
+$--color-warning: #e6a23c !default;
 /// color|1|Functional Color|1
-$--color-danger: #F56C6C !default;
+$--color-danger: #f56c6c !default;
 /// color|1|Functional Color|1
 $--color-info: #909399 !default;
 
@@ -55,19 +55,19 @@ $--color-text-regular: #606266 !default;
 /// color|1|Font Color|2
 $--color-text-secondary: #909399 !default;
 /// color|1|Font Color|2
-$--color-text-placeholder: #C0C4CC !default;
+$--color-text-placeholder: #c0c4cc !default;
 /// color|1|Border Color|3
-$--border-color-base: #DCDFE6 !default;
+$--border-color-base: #dcdfe6 !default;
 /// color|1|Border Color|3
-$--border-color-light: #E4E7ED !default;
+$--border-color-light: #e4e7ed !default;
 /// color|1|Border Color|3
-$--border-color-lighter: #EBEEF5 !default;
+$--border-color-lighter: #ebeef5 !default;
 /// color|1|Border Color|3
-$--border-color-extra-light: #F2F6FC !default;
+$--border-color-extra-light: #f2f6fc !default;
 
 // Background
 /// color|1|Background Color|4
-$--background-color-base: #F5F7FA !default;
+$--background-color-base: #f5f7fa !default;
 
 /* Link
 -------------------------- */
@@ -81,9 +81,9 @@ $--border-style-base: solid !default;
 $--border-color-hover: $--color-text-placeholder !default;
 $--border-base: $--border-width-base $--border-style-base $--border-color-base !default;
 /// borderRadius|1|Radius|0
-$--border-radius-base: 4px !default;
+$--border-radius-base: 2px !default;
 /// borderRadius|1|Radius|0
-$--border-radius-small: 2px !default;
+$--border-radius-small: 0px !default;
 /// borderRadius|1|Radius|0
 $--border-radius-circle: 100% !default;
 /// borderRadius|1|Radius|0
@@ -91,9 +91,9 @@ $--border-radius-zero: 0 !default;
 
 // Box-shadow
 /// boxShadow|1|Shadow|1
-$--box-shadow-base: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04) !default;
+$--box-shadow-base: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04) !default;
 // boxShadow|1|Shadow|1
-$--box-shadow-dark: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .12) !default;
+$--box-shadow-dark: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.12) !default;
 /// boxShadow|1|Shadow|1
 $--box-shadow-light: 0 2px 12px 0 rgba(0, 0, 0, 0.1) !default;
 
@@ -210,8 +210,6 @@ $--checkbox-button-checked-font-color: $--color-white !default;
 /// color||Color|0
 $--checkbox-button-checked-border-color: $--color-primary !default;
 
-
-
 /* Radio
 -------------------------- */
 /// fontSize||Font|1
@@ -426,13 +424,13 @@ $--input-font-size: $--font-size-base !default;
 /// color||Color|0
 $--input-font-color: $--color-text-regular !default;
 /// height||Other|4
-$--input-width: 140px !default;
+$--input-width: 200px !default;
 /// height||Other|4
 $--input-height: 40px !default;
 $--input-border: $--border-base !default;
 $--input-border-color: $--border-color-base !default;
 /// borderRadius||Border|2
-$--input-border-radius: $--border-radius-base !default;
+$--input-border-radius: 0px !default;
 $--input-border-color-hover: $--border-color-hover !default;
 /// color||Color|0
 $--input-background-color: $--color-white !default;
@@ -460,9 +458,9 @@ $--input-medium-font-size: 14px !default;
 /// height||Other|4
 $--input-medium-height: 36px !default;
 /// fontSize||Font|1
-$--input-small-font-size: 13px !default;
+$--input-small-font-size: 12px !default;
 /// height||Other|4
-$--input-small-height: 32px !default;
+$--input-small-height: 36px !default;
 /// fontSize||Font|1
 $--input-mini-font-size: 12px !default;
 /// height||Other|4
@@ -480,8 +478,8 @@ $--cascader-menu-radius: $--border-radius-base !default;
 $--cascader-menu-border: solid 1px $--border-color-light !default;
 $--cascader-menu-shadow: $--box-shadow-light !default;
 $--cascader-node-background-hover: $--background-color-base !default;
-$--cascader-node-color-disabled:$--color-text-placeholder !default;
-$--cascader-color-empty:$--color-text-placeholder !default;
+$--cascader-node-color-disabled: $--color-text-placeholder !default;
+$--cascader-color-empty: $--color-text-placeholder !default;
 $--cascader-tag-background: #f0f2f5;
 
 /* Group
@@ -591,7 +589,6 @@ $--button-info-background-color: $--color-info !default;
 $--button-hover-tint-percent: 20% !default;
 $--button-active-shade-percent: 10% !default;
 
-
 /* cascader
 -------------------------- */
 $--cascader-height: 200px !default;
@@ -639,7 +636,7 @@ $--table-row-hover-background-color: $--background-color-base !default;
 $--table-current-row-background-color: $--color-primary-light-9 !default;
 /// color||Color|0
 $--table-header-background-color: $--color-white !default;
-$--table-fixed-box-shadow: 0 0 10px rgba(0, 0, 0, .12) !default;
+$--table-fixed-box-shadow: 0 0 10px rgba(0, 0, 0, 0.12) !default;
 
 /* Pagination
 -------------------------- */
@@ -827,8 +824,8 @@ $--loading-fullscreen-spinner-size: 50px !default;
 
 /* Scrollbar
 --------------------------*/
-$--scrollbar-background-color: rgba($--color-text-secondary, .3) !default;
-$--scrollbar-hover-background-color: rgba($--color-text-secondary, .5) !default;
+$--scrollbar-background-color: rgba($--color-text-secondary, 0.3) !default;
+$--scrollbar-hover-background-color: rgba($--color-text-secondary, 0.5) !default;
 
 /* Carousel
 --------------------------*/
@@ -937,7 +934,7 @@ $--link-info-font-color: $--color-info !default;
 /// border||Other|4
 $--calendar-border: $--table-border !default;
 /// color||Other|4
-$--calendar-selected-background-color: #F2F8FE !default;
+$--calendar-selected-background-color: #f2f8fe !default;
 $--calendar-cell-width: 85px !default;
 
 /* Form
@@ -950,7 +947,7 @@ $--form-label-font-size: $--font-size-base !default;
 /// color||Color|0
 $--avatar-font-color: #fff !default;
 /// color||Color|0
-$--avatar-background-color: #C0C4CC !default;
+$--avatar-background-color: #c0c4cc !default;
 /// fontSize||Font Size|1
 $--avatar-text-font-size: 14px !default;
 /// fontSize||Font Size|1
@@ -972,23 +969,49 @@ $--lg: 1200px !default;
 $--xl: 1920px !default;
 
 $--breakpoints: (
-  'xs' : (max-width: $--sm - 1),
-  'sm' : (min-width: $--sm),
-  'md' : (min-width: $--md),
-  'lg' : (min-width: $--lg),
-  'xl' : (min-width: $--xl)
+    'xs': (
+        max-width: $--sm - 1
+    ),
+    'sm': (
+        min-width: $--sm
+    ),
+    'md': (
+        min-width: $--md
+    ),
+    'lg': (
+        min-width: $--lg
+    ),
+    'xl': (
+        min-width: $--xl
+    )
 );
 
 $--breakpoints-spec: (
-  'xs-only' : (max-width: $--sm - 1),
-  'sm-and-up' : (min-width: $--sm),
-  'sm-only': "(min-width: #{$--sm}) and (max-width: #{$--md - 1})",
-  'sm-and-down': (max-width: $--md - 1),
-  'md-and-up' : (min-width: $--md),
-  'md-only': "(min-width: #{$--md}) and (max-width: #{$--lg - 1})",
-  'md-and-down': (max-width: $--lg - 1),
-  'lg-and-up' : (min-width: $--lg),
-  'lg-only': "(min-width: #{$--lg}) and (max-width: #{$--xl - 1})",
-  'lg-and-down': (max-width: $--xl - 1),
-  'xl-only' : (min-width: $--xl),
+    'xs-only': (
+        max-width: $--sm - 1
+    ),
+    'sm-and-up': (
+        min-width: $--sm
+    ),
+    'sm-only': '(min-width: #{$--sm}) and (max-width: #{$--md - 1})',
+    'sm-and-down': (
+        max-width: $--md - 1
+    ),
+    'md-and-up': (
+        min-width: $--md
+    ),
+    'md-only': '(min-width: #{$--md}) and (max-width: #{$--lg - 1})',
+    'md-and-down': (
+        max-width: $--lg - 1
+    ),
+    'lg-and-up': (
+        min-width: $--lg
+    ),
+    'lg-only': '(min-width: #{$--lg}) and (max-width: #{$--xl - 1})',
+    'lg-and-down': (
+        max-width: $--xl - 1
+    ),
+    'xl-only': (
+        min-width: $--xl
+    )
 );

src/main/vue/src/components/AddressPicker.vue

@@ -169,7 +169,7 @@ export default {
             if (option && option.city) {
                 var geocoder = new AMap.Geocoder({});
 
-                geocoder.getLocation(option.city, function(status, result) {
+                geocoder.getLocation(option.city, function (status, result) {
                     if (status === 'complete' && result.info === 'OK') {
                         console.log(result);
                     }

src/main/vue/src/components/DockingEdit.vue

@@ -0,0 +1,109 @@
+<template>
+    <el-form
+        :model="formData"
+        :rules="rules"
+        ref="form"
+        label-width="110px"
+        label-position="right"
+        size="small"
+        style="max-width: 620px;"
+        inline
+        class="input1"
+    >
+        <el-form-item prop="name" label="姓名">
+            <el-input v-model="formData.name" placeholder="请输入"></el-input>
+        </el-form-item>
+        <el-form-item prop="jobTitle" label="职务">
+            <el-input v-model="formData.jobTitle" placeholder="请输入"></el-input>
+        </el-form-item>
+        <el-form-item prop="phone" label="电话">
+            <el-input v-model="formData.phone" placeholder="请输入"></el-input>
+        </el-form-item>
+        <el-form-item prop="email" label="邮箱">
+            <el-input v-model="formData.email" placeholder="请输入"></el-input>
+        </el-form-item>
+    </el-form>
+</template>
+<script>
+export default {
+    name: 'DockingEdit',
+    props: {
+        info: {
+            type: Object,
+            default: () => {
+                return {};
+            }
+        }
+    },
+    data() {
+        return {
+            saving: false,
+            formData: {},
+            rules: {
+                phone: [
+                    {
+                        pattern: /^1[3-9]\d{9}$/,
+                        message: '请输入正确的手机号',
+                        trigger: 'blur'
+                    }
+                ],
+                email: [
+                    {
+                        type: 'email',
+                        message: '请输入正确的邮箱地址',
+                        trigger: 'blur'
+                    }
+                ]
+            }
+        };
+    },
+    created() {
+        this.form = { ...this.info };
+    },
+    methods: {
+        onSave() {
+            this.$refs.form.validate(valid => {
+                if (valid) {
+                    this.submit();
+                } else {
+                    return false;
+                }
+            });
+        },
+        submit() {
+            let data = { ...this.formData };
+
+            this.saving = true;
+            this.$http
+                .post('/docking/save', data, { body: 'json' })
+                .then(res => {
+                    this.saving = false;
+                    this.$message.success('成功');
+                    this.$router.go(-1);
+                })
+                .catch(e => {
+                    console.log(e);
+                    this.saving = false;
+                    this.$message.error(e.error);
+                });
+        },
+        onDelete() {
+            this.$alert('删除将无法恢复，确认要删除么？', '警告', { type: 'error' })
+                .then(() => {
+                    return this.$http.post(`/docking/del/${this.formData.id}`);
+                })
+                .then(() => {
+                    this.$message.success('删除成功');
+                    this.$router.go(-1);
+                })
+                .catch(e => {
+                    if (e !== 'cancel') {
+                        console.log(e);
+                        this.$message.error((e || {}).error || '删除失败');
+                    }
+                });
+        }
+    }
+};
+</script>
+<style lang="less" scoped></style>

src/main/vue/src/styles/app.less

@@ -335,11 +335,6 @@ li {
 }
 
 .el-form.line {
-    .el-col {
-        .el-input {
-            width: 200px;
-        }
-    }
 }
 .el-form {
     .el-select {
@@ -348,9 +343,13 @@ li {
 }
 .el-form.line > .el-form-item {
     padding: 0 70px;
+    max-width: 760px;
+    box-sizing: border-box;
 }
 .el-form.line > .el-row {
     padding: 0 70px;
+    max-width: 760px;
+    box-sizing: border-box;
 }
 
 .input1 {
@@ -359,8 +358,10 @@ li {
     }
 }
 
-.el-form-item__label {
-    font-size: 12px !important;
+.form-submit {
+    .el-button {
+        min-width: 120px;
+    }
 }
 
 .input-pre-zh {
@@ -379,10 +380,3 @@ li {
         color: #eead81;
     }
 }
-.el-form-item--small.el-form-item {
-    margin-bottom: 20px !important;
-}
-.el-input--small .el-input__inner {
-    line-height: 36px !important;
-    height: 36px !important;
-}

src/main/vue/src/views/Menus.vue

@@ -57,7 +57,7 @@
                             <el-form-item prop="category" label="分类" v-if="menu.root">
                                 <el-input v-model="menu.category"></el-input>
                             </el-form-item>
-                            <el-form-item prop="subUrl" label="子页面地址" v-if="menu.root">
+                            <el-form-item prop="subUrl" label="子页面地址" v-if="menu.path">
                                 <el-select
                                     v-model="menu.subUrl"
                                     multiple

src/main/vue/src/views/PartnerEdit.vue

@@ -17,7 +17,7 @@
                     label-width="110px"
                     label-position="right"
                     size="small"
-                    style="max-width: 760px;"
+                    style="max-width: 100%;"
                     class="line"
                 >
                     <el-form-item prop="type" label="type" v-if="!formData.type">
@@ -120,6 +120,21 @@
                         </el-col>
                     </el-row>
 
+                    <divider>
+                        指定对接人
+                    </divider>
+
+                    <div class="docking-list" v-for="(item, index) in showDockings" :key="index">
+                        <div class="docking-name">对接人{{ getNum(index + 1) }}</div>
+                        <docking-edit :info.sync="dockings[item.dockingsIndex]"></docking-edit>
+                        <el-button @click="delDocking(item.dockingsIndex)" class="del" plain type="danger" size="small"
+                            >删除</el-button
+                        >
+                    </div>
+                    <el-form-item style="margin-bottom: 60px;">
+                        <el-button type="primary" plain size="mini" @click="addDocking">新增</el-button>
+                    </el-form-item>
+
                     <el-form-item class="form-submit">
                         <el-button @click="onSave" :loading="saving" size="default" type="primary">保存 </el-button>
                         <el-button @click="onDelete" :loading="saving" size="default" type="danger" v-if="formData.id"
@@ -133,6 +148,7 @@
     </div>
 </template>
 <script>
+import DockingEdit from '../components/DockingEdit.vue';
 export default {
     name: 'PartnerEdit',
     created() {
@@ -146,6 +162,22 @@ export default {
                     console.log(e);
                     this.$message.error(e.error);
                 });
+
+            this.$http
+                .post(
+                    '/docking/all',
+                    {
+                        query: {
+                            partnerId: this.$route.query.id
+                        }
+                    },
+                    { body: 'json' }
+                )
+                .then(res => {
+                    this.dockings = res.content;
+                });
+        } else {
+            this.addDocking();
         }
         this.$nextTick(() => {
             if (this.$route.query.type === 'CLIENT') {
@@ -169,9 +201,25 @@ export default {
                 { label: '境内', value: 'DOMESTIC' },
                 { label: '境外', value: 'ABROAD' }
             ],
-            pageName: ''
+            pageName: '',
+            dockings: []
         };
     },
+    computed: {
+        showDockings() {
+            let dockings = [...this.dockings];
+            return dockings
+                .map((item, index) => {
+                    return {
+                        ...item,
+                        dockingsIndex: index
+                    };
+                })
+                .filter(item => {
+                    return !item.del;
+                });
+        }
+    },
     methods: {
         onSave() {
             this.$refs.form.validate(valid => {
@@ -214,8 +262,65 @@ export default {
                         this.$message.error((e || {}).error || '删除失败');
                     }
                 });
+        },
+        getNum(num) {
+            if (num < 10) {
+                return '0' + num;
+            } else {
+                return num;
+            }
+        },
+        addDocking() {
+            let docking = {
+                name: '',
+                jobTitle: '',
+                phone: '',
+                email: ''
+            };
+            if (this.formData.id) {
+                docking.partnerId = this.formData.id;
+            }
+            this.dockings.push(docking);
+        },
+        delDocking(index) {
+            let dockings = [...this.dockings];
+            this.$alert('删除将无法恢复，确认要删除么？', '警告', { type: 'error' })
+                .then(() => {
+                    if (dockings[index].id) {
+                        dockings[index] = { ...info, del: true };
+                    } else {
+                        dockings.splice(index, 1);
+                    }
+                    this.dockings = dockings;
+                })
+                .catch(e => {});
         }
+    },
+    components: {
+        DockingEdit
     }
 };
 </script>
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.docking-list {
+    .flex();
+    padding-left: 70px;
+    position: relative;
+
+    .docking-name {
+        align-self: flex-start;
+        font-size: 12px;
+        color: #c8c9cc;
+        line-height: 36px;
+        position: absolute;
+        left: 70px;
+        top: 0;
+    }
+
+    .del {
+        align-self: flex-start;
+        margin-left: 20px;
+        min-width: 60px;
+    }
+}
+</style>