{$layout}
{$template "instance_menu"}
{$template "/code_editor"}

<table class="ui table definition selectable">
    <tr>
        <td class="title">媒介名称</td>
        <td>{{instance.name}}</td>
    </tr>
    <tr>
        <td>状态</td>
        <td>
            <label-on :v-is-on="instance.isOn"></label-on>
        </td>
    </tr>
    <tr>
        <td class="color-border">媒介类型</td>
        <td>
            {{instance.media.name}}
        </td>
    </tr>

    <!-- E-mail -->
    <tbody v-if="instance.media.type == 'email'">
        <tr>
            <td class="color-border">SMTP</td>
            <td>
                {{instance.params.smtp}}
            </td>
        </tr>
        <tr>
            <td class="color-border">账号</td>
            <td>
                {{instance.params.username}}
            </td>
        </tr>
        <tr>
            <td class="color-border">密码</td>
            <td>
                {{instance.params.password}}
            </td>
        </tr>
        <tr>
            <td class="color-border">发送者Email</td>
            <td>
                <span v-if="instance.params.from.length > 0">{{instance.params.from}}</span>
                <span v-if="instance.params.from.length == 0" class="disabled">没有设置</span>
            </td>
        </tr>
    </tbody>

    <!-- WebHook -->
    <tbody v-if="instance.media.type == 'webHook'">
    <tr>
        <td class="color-border">URL</td>
        <td>
            {{instance.params.url}}
        </td>
    </tr>
    <tr>
        <td class="color-border">请求方法</td>
        <td>
            {{instance.params.method}}
        </td>
    </tr>
    <tr>
        <td class="color-border">自定义Header</td>
        <td>
            <span v-if="instance.params.headers == null || instance.params.headers.length == 0" class="disabled">还没有自定义Header</span>
            <div v-if="instance.params.headers != null && instance.params.headers.length > 0">
                <span class="ui label small" v-for="header in instance.params.headers">{{header.name}}:{{header.value}}</span>
            </div>
        </td>
    </tr>
    <tr v-if="instance.params.contentType != null && instance.params.contentType.length > 0">
        <td class="color-border">
            <span v-if="instance.params.contentType == 'params'">自定义参数</span>
            <span v-if="instance.params.contentType == 'body'">自定义内容</span>
        </td>
        <td class="color-border">
            <div v-if="instance.params.contentType == 'params'">
                <span v-if="instance.params.params == null || instance.params.params.length == 0" class="disabled">还没有自定义参数</span>
                <div v-if="instance.params.params != null && instance.params.params.length > 0">
                    <span class="ui label small" v-for="param in instance.params.params">{{param.name}}:{{param.value}}</span>
                </div>
            </div>
            <div v-if="instance.params.contentType == 'body'">
                <xmp style="margin-top:0;margin-bottom:0">{{instance.params.body}}</xmp>
            </div>
        </td>
    </tr>
    </tbody>

    <!-- 脚本 -->
    <tbody v-if="instance.media.type == 'script'">
        <tr>
            <td class="color-border">脚本</td>
            <td>
                <span v-if="instance.params.scriptType == 'path'">{{instance.params.path}}</span>
                <div id="script-code-editor" v-show="instance.params.scriptType == 'code'"></div>
            </td>
        </tr>
        <tr>
            <td class="color-border">当前工作目录<em>（CWD）</em></td>
            <td>
                <span v-if="instance.params.cwd.length > 0">{{instance.params.cwd}}</span>
                <span v-if="instance.params.cwd.length == 0" class="disabled">没有设置</span>
            </td>
        </tr>
        <tr>
            <td class="color-border">环境变量<em>（ENV）</em></td>
            <td>
                <span v-if="instance.params.env == null || instance.params.env.length == 0" class="disabled">没有设置</span>
                <div v-if="instance.params.env != null && instance.params.env.length > 0">
                        <span class="ui label small" v-for="(var1, index) in instance.params.env">
                            <em>{{var1.name}}</em>: {{var1.value}}
                        </span>
                </div>
            </td>
        </tr>
        </tbody>
        <tbody v-if="instance.media.type == 'dingTalk'">
        <tr>
            <td class="color-border">Hook地址</td>
            <td>{{instance.params.webHookURL}}</td>
        </tr>
    </tbody>

    <!-- 企业微信 -->
    <tbody v-if="instance.media.type == 'qyWeixin'">
        <tr>
            <td class="color-border">企业ID</td>
            <td>
                {{instance.params.corporateId}}
            </td>
        </tr>
        <tr>
            <td class="color-border">应用AgentId</td>
            <td>
                {{instance.params.agentId}}
            </td>
        </tr>
        <tr>
            <td class="color-border">应用Secret</td>
            <td>
                {{instance.params.appSecret}}
            </td>
        </tr>
        <tr>
            <td class="color-border">内容文本格式</td>
            <td>
                <span v-if="instance.params.textFormat == null">text</span>
                {{instance.params.textFormat}}
            </td>
        </tr>
    </tbody>

    <!-- 企业微信群机器人 -->
    <tbody v-if="instance.media.type == 'qyWeixinRobot'">
    <tr>
        <td class="color-border">WebHook地址</td>
        <td>{{instance.params.webHookURL}}</td>
    </tr>
    <tr>
        <td class="color-border">内容文本格式</td>
        <td>
            <span v-if="instance.params.textFormat == null">text</span>
            {{instance.params.textFormat}}
        </td>
    </tr>
    </tbody>

    <!-- 阿里云短信 -->
    <tbody v-show="instance.media.type == 'aliyunSms'">
        <tr>
            <td class="color-border">签名名称</td>
            <td>
                {{instance.params.sign}}
            </td>
        </tr>
        <tr>
            <td class="color-border">模板CODE</td>
            <td>
                {{instance.params.templateCode}}
            </td>
        </tr>
        <tr>
            <td class="color-border">模板变量</td>
            <td>
                <div v-if="instance.params.variables != null">
                        <span class="ui label small" v-for="(var1, index) in instance.params.variables">
                            <em>{{var1.name}}</em>: {{var1.value}}
                        </span>
                </div>
            </td>
        </tr>
        <tr>
            <td class="color-border">AccessKey ID</td>
            <td>
                {{instance.params.accessKeyId}}
            </td>
        </tr>
        <tr>
            <td class="color-border">AccessKey Secret</td>
            <td>
                {{instance.params.accessKeySecret}}
            </td>
        </tr>
    </tbody>

    <!-- Telegram机器人 -->
    <tbody v-show="instance.media.type == 'telegram'">
        <tr>
            <td class="color-border">机器人Token</td>
            <td>{{instance.params.token}}</td>
        </tr>
        </tbody>

        <!-- TeaOS云短信 -->
        <tbody v-show="instance.media.type == 'teaSms'">
        <tr>
            <td class="color-border">AccessId</td>
            <td>{{instance.params.accessId}}</td>
        </tr>
        <tr>
            <td class="color-border">AccessSecret</td>
            <td>{{instance.params.accessSecret}}</td>
        </tr>
    </tbody>
    <tr>
        <td>发送频率<em>（次/分钟）</em></td>
        <td>
            <span v-if="instance.rate.minutes <= 0 || instance.rate.count <= 0" class="disabled">没有限制</span>
            <span v-else>{{instance.rate.count}}次/{{instance.rate.minutes}}分钟</span>
        </td>
    </tr>
    <tr>
        <td>忽略相似消息周期</td>
        <td>
            <span v-if="instance.hashLife > 0">{{instance.hashLife}}秒</span>
            <span v-else-if="instance.hashLife == 0" class="disabled">使用默认</span>
            <span v-else class="disabled">没有设置</span>
        </td>
    </tr>
    <tr>
        <td>备注</td>
        <td>
            <span v-if="instance.description.length > 0">{{instance.description}}</span>
            <span v-else class="disabled">没有设置</span>
        </td>
    </tr>
</table>