import { Component, Vue, Model, Prop } from "vue-property-decorator";
import { Message } from "@/customer-service/model";
import { isAccessibleUrl } from "@/customer-service/service/tools";

@Component({ components: {} })
export default class BaseMessage extends Vue {
    @Model()
    protected readonly value!: Message;

    @Prop()
    protected readonly userName!: string;

    protected messageRealUrl = "";
    protected fileFailed2Load = false;
    protected loadingRealUrl = false;

    protected get messageBody(): { eid?: string; oid?: string; msg: any } {
        if (this.value) {
            try {
                if (this.value.msg.startsWith("{")) {
                    return { ...this.value, msg: JSON.parse(this.value.msg) };
                }
                return { ...this.value, msg: this.value.msg };
            } catch {
                return {
                    ...this.value,
                    msg: JSON.parse(this.value.msg.replace(/\n/g, "\\n")),
                };
            }
        }

        return { msg: { text: "" } };
    }

    protected openFile() {
        this.$emit("open", this.messageRealUrl, this.messageBody.msg.name);
    }

    protected buildMessageUrl() {
        if (this.messageRealUrl || this.loadingRealUrl) {
            return;
        }
        const url = this.messageBody.msg.url as string;
        if (url) {
            if (isAccessibleUrl(url)) {
                return (this.messageRealUrl = url);
            }
            this.loadingRealUrl = true;
        } else {
            this.fileFailed2Load = true;
        }
    }
}