Merge branch 'master' of http://git.yoho.cn/fe/ufo-platform-fe

@@ -8,7 +8,7 @@ class ResourceApi extends Api {
   info(id) {
     return this._post('/ufoPlatform/resource/getResourceInfo', {
       id
-    }, true);
+    });
   }
 
   editResource(data) {

@@ -12,16 +12,48 @@
           <th>
             <Form>
               <FormItem>
-                <Select>
+                <Select v-model="i.url.action">
                   <Option value="go.h5">H5网页</Option>
                   <Option value="go.ufo">商品列表页</Option>
                   <Option value="go.pool">商品池</Option>
                 </Select>
               </FormItem>
 
-              <FormItem>
-                <Input/>
-              </FormItem>
+              <template v-if="i.url.action === 'go.h5'">
+                <FormItem>
+                  <Input v-model="i.url.title" placeholder="参数"/>
+
+                </FormItem>
+                <FormItem>
+                  <Input v-model="i.url.url" placeholder="参数"/>
+                </FormItem>
+              </template>
+
+              <template v-if="i.url.action === 'go.ufo'">
+                <FormItem>
+                  <Input v-model="i.url.productListTitle" placeholder="参数"/>
+                </FormItem>
+
+                <FormItem>
+                  <Input v-model="i.url.productPool" placeholder="参数"/>
+                </FormItem>
+
+                <FormItem>
+                  <Input v-model="i.url.url" placeholder="参数"/>
+                </FormItem>
+                
+              </template>
+
+              <template v-if="i.url.action === 'go.pool'">
+                <FormItem>
+                  <Input v-model="i.url.productId" placeholder="参数"/>
+                </FormItem>
+
+                <FormItem>
+                  <Input v-model="i.url.url" placeholder="参数"/>
+                </FormItem>
+              </template>
+
             </Form>
           </th>
 
@@ -40,7 +72,7 @@
 
 <script>
 
-import fileUpload from './file-upload';
+import fileUpload from './drag-file-upload';
 
 export default {
   props: {
@@ -87,12 +119,24 @@ export default {
 
       for (const i of keys) {
         let a = m[i];
+        let url = new URL(a.url.url);
+        let params = new URLSearchParams(url.search);
+
+        a.url.url = `${url.origin}${url.pathname}`
 
-        console.log(a);
+        if (a.url.action === 'go.ufo' && params.get('pagename') === 'productDetail') {
+          a.url.action = 'go.pool'
+        }
+
+        for (let p of params) {
+          a.url[p[0]] = p[1]
+        }
 
         result.push(a)
       }
 
+      console.log(result);
+
       return result;
     }
   },

@@ -20,7 +20,7 @@ export default {
     props: {
         action: {
             type: String,
-            default: '/ufoPlatform/fileupload/uploadImage'
+            default: '/ufoPlatform/fileupload/upload?debug=XYZ'
         },
         data: {
             type: Object,

+<template>
+    <div v-if="show">
+        <image-purview
+            v-if="uploadList[0]"
+            :status="uploadList[0].status"
+            :url="uploadList[0].url"
+            :progress="uploadList[0].showProgress"
+            :percentage="uploadList[0].percentage"
+            :remove="true"
+            @remove-image="handleRemove"></image-purview>
+
+        <div class="upload-box"  v-show="!uploadList[0]">
+            <Upload ref="upload"
+                    :show-upload-list="false"
+                    :data="{bucket: bucket}"
+                    :on-success="handleSuccess"
+                    :on-error="handleError"
+                    :default-file-list="defaultList"
+                    :format="['jpg','jpeg','png']"
+                    :max-size="2048"
+                    :on-format-error="handleFormatError"
+                    :on-exceeded-size="handleMaxSize"
+                    action="/ufoPlatform/fileupload/upload?debug=XYZ">
+                <Icon type="ios-cloud-upload-outline" title="上传图片"></Icon>
+            </Upload>
+        </div>
+    </div>
+</template>
+<script>
+
+import imagePurview from './image-purview'
+
+export default {
+    name: 'drag-file-upload',
+    props: {
+        defaultFile: {
+            type: String
+        },
+        bucket: {
+            type: String,
+            default() {
+                return 'yhb-img01';
+            }
+        }
+    },
+    data() {
+        let _this = this;
+
+        return {
+            imgUrl: '',
+            show: true,
+            visible: false,
+            uploadList: [],
+            defaultList: _this.defaultFile ? [{url: _this.defaultFile}] : []
+        };
+    },
+    methods: {
+        handleView(url) {
+            this.imgUrl = url;
+            this.visible = true;
+        },
+        handleRemove() {
+            let file = this.uploadList[0];
+            let files = this.$refs.upload.fileList;
+
+            this.$refs.upload.fileList.splice(files.indexOf(file), 1);
+            this.uploadList = this.$refs.upload.fileList;
+            this.$emit('remove', this.id);
+        },
+        handleSuccess(response, file, files) {
+            if (response.data) {
+                file.url = response.data.imagesList[0];
+            }
+
+            this.uploadList = files;
+            this.$emit('success', this.id, file);
+        },
+        handleError() {
+            this.$Notice.error('上传失败');
+            this.$emit('error', this.id);
+        },
+        handleFormatError(file) {
+            this.$Notice.warning({
+                title: '文件格式不正确',
+                desc: '文件 ' + file.name + ' 格式不正确，请上传 jpg 或 png 格式的图片。'
+            });
+        },
+        handleMaxSize(file) {
+            this.$Notice.warning({
+                title: '超出文件大小限制',
+                desc: '文件 ' + file.name + ' 太大，不能超过 2M。'
+            });
+        },
+        selected(url) {
+            this.uploadList = this.defaultList = [{url}];
+            this.$emit('success', this.id, {url});
+        },
+
+    },
+    mounted() {
+        this.uploadList = this.$refs.upload.fileList;
+    },
+    watch: {
+        defaultFile: function(newValue) {
+            if (newValue) {
+                this.defaultList = [{url: newValue}];
+            }
+        }
+    },
+    components: {
+        imagePurview
+    }
+};
+</script>
+<style lang="scss">
+
+.upload-box {
+    width: 100px;
+    height: 100px;
+    background: #fff;
+    border: 1px dashed #dddee1;
+    border-radius: 4px;
+    text-align: center;
+    cursor: pointer;
+    position: relative;
+    overflow: hidden;
+    transition: border-color 0.2s ease;
+    margin: 0 auto;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    &:hover {
+        border-color: #2d8cf0;
+    }
+
+    .ivu-upload {
+        height: 30px;
+    }
+
+    .ivu-icon {
+        font-size: 30px;
+        margin: 0 2px;
+        color: #000;
+        transition: color 0.2s ease;
+
+        &:hover {
+            color: #2d8cf0;
+        }
+    }
+}
+</style>

+<template>
+    <div class="image-purview">
+        <template v-if="status === 'finished' || url">
+            <img :src="url">
+            <div class="image-purview-cover">
+                <Icon type="ios-eye-outline" size="30" @click.native="purviewImage"></Icon>
+                <Icon type="ios-trash-outline" v-if="remove" size="30" @click.native="removeImage"></Icon>
+            </div>
+        </template>
+        <template v-else>
+            <Progress v-if="progress" :percent="percentage" hide-info></Progress>
+        </template>
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'image-purview',
+    props: {
+        status: {
+            type: String,
+            default: 'finished'
+        },
+        url: {
+            type: String,
+        },
+        progress: {
+            type: Boolean,
+            default: false,
+        },
+        percentage: {
+            type: Number,
+        },
+        remove: {
+            type: Boolean,
+            default: false
+        }
+    },
+    data() {
+        return {
+            showModal: false
+        };
+    },
+    methods: {
+        purviewImage() {
+            this.showModal = true;
+            this.$emit('purview', this.url);
+        },
+        removeImage() {
+            this.$emit('remove-image', this.url);
+        }
+    },
+};
+</script>
+
+<style lang="scss">
+.image-purview {
+    margin: 0 auto;
+    width: 100px;
+    height: 100px;
+    text-align: center;
+    border-radius: 4px;
+    overflow: hidden;
+    background: #fff;
+    position: relative;
+    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
+    border: 1px solid #e8e8e8;
+    align-items: center;
+    justify-content: center;
+    display: flex;
+
+    .ivu-progress {
+        width: 90%;
+    }
+}
+
+.image-purview img {
+    width: 100px;
+    height: 100px;
+}
+
+.image-purview-cover {
+    display: none;
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    background: rgba(0, 0, 0, 0.6);
+    align-items: center;
+    justify-content: center;
+}
+
+.image-purview:hover .image-purview-cover {
+    display: flex;
+}
+
+.image-purview-cover i {
+    color: #fff;
+    font-size: 20px;
+    cursor: pointer;
+    margin: 0 2px;
+}
+</style>