<!DOCTYPE html>
<!--解决idea thymeleaf 表达式模板报红波浪线-->
<!--suppress ALL -->
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <!-- 引入公用部分 -->
    <script th:replace="common/head::static"></script>
    <!-- 样式 -->
    <link th:href="@{/css/common/contianer.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/business/metadata/metadata.css}" rel="stylesheet" type="text/css"/>
    <script th:inline="javascript">
        const LabelConfigSet = /*[[${LabelConfigSet}]]*/ [];
    </script>
</head>
<body>
<div class="layui-row">
    <!-- 操作表单 -->
    <div class="layui-col-md12">
        <div class="layui-card">
            <!--<div class="layui-card-header">操作表单</div>-->
            <div class="layui-card-body">
                <form id="metadataForm" class="layui-form layui-form-pane" lay-filter="metadataForm">
                    <div class="layui-form-item">
                        <label class="layui-form-label">数据源</label>
                        <div class="layui-input-block">
                            <input type="hidden" name="dataFrom">
                            <select id="dataSourcesSelect" name="dataSourceId" lay-verify="required"
                                    lay-filter="dataSourcesSelect"></select>
                            <button id="btn_selectTable" type="button" class="layui-btn layui-btn-sm"
                                    style="float: left; margin: 4px">选择数据表
                            </button>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div id="metadataTablesTab"><label style="color: red">* 请先选择数据表</label></div>
                    </div>
                    <div class="layui-form-item" th:each="field,iterStat : ${metadataFormConfig}" th:if="${field.isShow}">
                        <label th:if="${field.isRequired}" class="layui-form-label">
                            <label style="color: red">*</label>
                            <label th:text="${field.showTitle}">*</label>
                        </label>
                        <label th:if="${!field.isRequired}" class="layui-form-label" th:text="${field.showTitle}"></label>
                        <div class="layui-input-block">
                            <input type="hidden" name="metadataComment" th:if="${field.fieldName == 'metadataName'}">
                            <!-- 文本框输入框类型 -->
                            <input class="layui-input" type="text" autocomplete="off"
                                   th:if="${field.fieldType == 'input' || field.fieldType == 'date'}"
                                   th:name="${field.fieldName}"
                                   th:disabled="${field.isDisabled}"
                                   th:placeholder="${field.showTitle}"
                                   th:lay-verify="${field.isRequired ? 'required' : ''}">
                            <!-- 数据字典类型 -->
                            <div dict-component="select"
                                 th:if="${field.fieldType == 'dict'}"
                                 th:disabled="${field.isDisabled}"
                                 th:dict-type="${field.dictType}"
                                 th:dict-name="${field.fieldName}"
                                 th:id="${'dict-'+field.fieldName}"></div>
                        </div>
                    </div>
                    <div class="layui-form-item" th:each="labelSet, iterState:${LabelConfigSet}">
                        <label class="layui-form-label" th:text="${labelSet.fieldTitle}">标签类型</label>
                        <div class="layui-input-block label-set-component"
                             th:data-id="${labelSet.id}"
                             th:data-field-title="${labelSet.fieldTitle}"
                             th:data-label-id="${labelSet.labelId}"
                             th:data-label-title="${labelSet.labelTitle}"
                             th:data-label-id-path="${labelSet.labelIdPath}"
                             th:data-label-title-path="${labelSet.labelTitlePath}"></div>
                    </div>
                    <div class="layui-form-item other-label-item">
                        <label class="layui-form-label"><a class="label-type choose-data add-other" id="addOtherLabelBtn">添加</a>其他标签</label>
                        <div class="layui-input-block other-label-item">
                            <div class="label-set-component other-label" th:data-field-title="其他标签"></div>
                        </div>
                    </div>
                    <!-- 隐藏域 -->
                    <input type="text" name="id" hidden="hidden"/>
                    <button id="btn_submit" lay-submit lay-filter="*"
                            style="position: absolute; left: -100px"></button>
                </form>
            </div>
        </div>
    </div>

</div>
</body>
<script th:replace="common/head::static-foot"></script>
<!-- 已选择的数据资源表标签模板 -->
<script id="checkedTableTemplate" type="text/html">
    {{# if(d.size == 0){ }}
    <label style="color: red">* 请先选择数据表</label>
    {{# }else{ }}
    <ul class="metadata-table-list">
        {{# for(let [index, item] of d){ }}
        <li class="metadata-table-list-item">
            <div class="table-tab">
                <input type="hidden" name="tableName" value="{{item.tableName}}">
                <div class="tab-text">{{item.tableName}}</div>
                <i class="layui-icon layui-icon-close" data-id="{{item.tableName}}"></i>
            </div>
            {{#
            if(d.size > 1){
            }}
            <select id="selectForginColumn_{{item.tableName}}" lay-filter="selectForeignColumn_{{item.tableName}}">
                <option>选择外键</option>
                {{# layui.each(item.columnList,function(idx, col){ }}
                <option value="{{col.columnName}}" {{col.selected}}>{{col.columnName}}</option>
                {{# }); }}
            </select>
            <select id="selectForeignTable_{{item.tableName}}" lay-filter="selectForeignTable_{{item.tableName}}">
                <option>选择外表</option>
                {{#
                for(let [i, o] of d){
                if(index == i ){continue;}
                let selected = o.tableName == item.foreignTable ? 'selected' : '';
                }}
                <option value="{{ i }}" {{selected}}>{{ i }}</option>
                {{# } }}
            </select>
            <input type="radio" name="master" value="{{item.tableName}}" lay-skin="primary" title="主表"
                   lay-filter="master-radio">
            {{# } }}
            <a class="layui-btn layui-btn-xs btn-field-config" data-table="{{item.tableName}}" title="字段配置"
               style="margin-top: 8px;">字段配置</a>
        </li>

        {{# } }}
    </ul>
    {{# } }}
</script>
<!-- js -->
<script th:src="@{/js/business/metadata/edit.js}"></script>
</html>
