<template>
    <div class="row go-form-row flex-div go-common-drop-ctl">
        <go-label :labelAlign="labelAlign"
                  :labelSplit="labelFlag"
                  :showLabel="labelFlag"
                  :showLabelSlot="showLabelSlot"
                  :label="label" :item="item"></go-label>
        <div>
            <go-img-upload-view style="position: relative;top:10px;left: 10px;"
                v-if="!disabled"
                :disabled="disabled"
                v-model="value"
                @addFile="addImg"
                :multiple="false"
                :fileNumbers="1"
                :iconWidth="iconWidth"
                :iconHeight="iconHeight"
                :iconType="iconType"
                :iconSize="iconSize"
                :class="extendClass"
            ></go-img-upload-view>
            <span v-else>
        <span>
          <img
              class="show_img"
              :style="imgStyle"
              v-show="value != null && value.length > 0"
              :src="imgScr"
          />
            <div :style="boxStyle" v-show="value===''">
                <span :style="iconStyle" :class="defIcon"></span>
            </div>
        </span>
      </span>
        </div>
    </div>
</template>

<script>
    import GoImgUploadView from "../components/go-img-upload-view";
    import GoLabel from "../../../formVue/commponents/go-label";
    import { AssertUtils} from "goingutils";


    export default {
        name: "go-img-upload",
        data: function () {
            return {};
        },
        props: {
            defIcon: {
                type: String,
                default: 'ivu-icon ivu-icon-md-person'
            },
            defStyle: {
                type: [Object, String, Number],
                default: () => {
                    return {};
                }
            },
            extendClass: {
                type: String,
                default: ""
            },
            iconType: {
                type: String,
                default: "ios-image-outline"
            },
            disabled: {
                type: Boolean,
                default: false
            },
            labelAlign: {
                type: String,
                default: "right"
            },
            showLabel:{
                type: Boolean,
                default: false
            },
            label: {
                type: [String,Boolean],
                default: ""
            },
            icon: {
                type: Boolean,
                default: true
            },
            width: {
                type: [String, Number],
                default: "big"
            },
            iconSize: {
                type: [String, Number],
                default: 50
            },
            iconWidth: {
                type: [String, Number],
                default: 68
            },
            iconHeight: {
                type: [String, Number],
                default: 68
            },
            value: {
                type: [Object,String, Number],
                default: () => {
                    return {};
                }
            },
            item: {
                type: Object,
                default: () => {
                    return {};
                }
            }
        },
        computed: {
            labelFlag(){
                if(AssertUtils.isNotEmpty(this.item["label"])||AssertUtils.isNotEmpty(this.label)){
                    return true;
                }else{
                    return false;
                }
            },
            boxStyle() {
                return {
                    margin: 'auto',
                    border: "1px solid #dfdfdf",
                    borderRadius: "50%",
                    width: this.iconWidth + "px",
                    height: this.iconHeight + "px",
                    textAlign: "center"
                };
            },
            iconStyle() {
                return {...this.defStyle};
            },
            imgStyle() {
                return {
                    width: this.iconWidth - 10 + "px",
                    height: this.iconHeight - 10 + "px",
                    margin: "5px",
                    border: "1px solid #dfdfdf"
                };
            },
            imgScr() {
                if (AssertUtils.isNotEmpty(this.value && typeof (this.value) !== "object")) {
                    //如果图片id不为空 则展示图片
                    return `${window.SysConfigUtils.go_eplat_adress}${window.projectName.file}/attachment/showImg/` + this.value;
                } else {
                    return "";
                }
            }
        },
        mounted() {
        },
        methods: {
            addImg(imgObj) {
                this.$emit("addImg", imgObj);
                this.$emit("input", imgObj[0]);
            }
        },
        components: {
            GoLabel,
            GoImgUploadView
        }
    };
</script>
