<template>
  <div>
    <el-toolbar v-if="tabName==='basic'">
      <el-button v-loading="saveLoading" @click="saveClickHandler"><i class="fa fa-floppy-o"></i> 保存</el-button>
      <c-clean-button :catalog-id="dimensionCatalogId" :dimension-id="dimensionId"></c-clean-button>
      <c-publish-button :catalog-id="dimensionCatalogId" :dimension-id="dimensionId" @callback="afterPulishCallback"></c-publish-button>
    </el-toolbar>
    <div>
      <el-form class="dimension-catalog-detail-form"
        label-position="right"
        ref="dimension-catalog-info"
        :model="dimensionCatalogBasicInfo"
        label-width="155px">
        <div class="panel-fieldset">
          <h4 class="panel-legend">基本信息</h4>
          <el-form-item label="栏目ID：">
            {{dimensionCatalogBasicInfo.ID}}(内部编码：{{dimensionCatalogBasicInfo.innerCode}})
          </el-form-item>
          <el-form-item label="栏目名称：" prop="name" :verify="['NotNull','Length<30']">
            <el-input v-model="dimensionCatalogBasicInfo.name"></el-input>
          </el-form-item>
          <el-form-item label="栏目别名：" prop="alias" :verify="['NotNull','Regex=^[a-zA-Z0-9_\.\-\/]+$','Length<100']">
            <el-input v-model="dimensionCatalogBasicInfo.alias"></el-input>
          </el-form-item>
          <el-form-item label="所在目录：" prop="path" :verify="['NotNull','Regex=^[a-zA-Z0-9_\.\-\/]+$','Length<100']">
            <path-picker
            :path.sync="dimensionCatalogBasicInfo.path"
            select-title="选择栏目路径"

            ></path-picker>
          </el-form-item>
          <el-form-item label="Logo图片：">
            <logo-path
              :path.sync="dimensionCatalogBasicInfo.logoFile"
              upload-title="上传栏目Logo图片"
              edit-position="right"
              :preview-path.sync="dimensionCatalogBasicInfo.logoSrc"
              :resource-dialog-props="resourceDialogProps"
            ></logo-path>
          </el-form-item>
        </div>
        <div class="panel-fieldset">
          <h4 class="panel-legend">模板属性</h4>
          <el-form-item label="首页模板：">
            <template-picker
              v-model="dimensionCatalogBasicInfo.indexTemplate"
              type="CatalogIndex"
              :catalog-id="dimensionCatalogId">
            </template-picker>
          </el-form-item>
          <el-form-item label="列表页模板：">
            <template-picker
              v-model="dimensionCatalogBasicInfo.listTemplate"
              type="ListTemplate"
              :catalog-id="dimensionCatalogId">
            </template-picker>
            <el-button v-loading="applyLoading" @click="applyTemplateToChildren('ListTemplate')">应用子栏目</el-button>
          </el-form-item>
          <el-form-item label="列表页显示文档数：">
            <el-input-number v-model="dimensionCatalogBasicInfo.listPageSize" :min="1"></el-input-number>
            <el-tooltip placement="right" effect="dark">
              <div slot="content">列表页显示多少条记录，如果模板中有指定pagesize属性，则以模板为准</div>
              <span><i class="fa fa-lightbulb-o" style="color:#FFC125; margin-left:5px"></i></span>
            </el-tooltip>
          </el-form-item>
          <el-form-item label="列表页最大更新分页数：">
            <el-input-number v-model="dimensionCatalogBasicInfo.listMaxPage" :min="-1"></el-input-number>
            <el-tooltip placement="right" effect="dark">
              <div slot="content">列表页最多更新多少页，小于等于0的数字表示无限制，按实际页数来生成</div>
              <span><i class="fa fa-lightbulb-o" style="color:#FFC125; margin-left:5px"></i></span>
            </el-tooltip>
          </el-form-item>
        </div>
        <div class="panel-fieldset">
          <h4 class="panel-legend">SEO属性</h4>
          <el-form-item label="首页路径及文件名：">
            <path-picker
            :path.sync="dimensionCatalogBasicInfo.indexFileName"
            :parent-path="dimensionCatalogBasicInfo.path"
            extension = "htm,shtml,html"
            select-type="File"
            select-title="选择首页文件"
            ></path-picker>
          </el-form-item>
          <el-form-item label="SEO关键字：">
            <el-input v-model="dimensionCatalogBasicInfo.SEOKeywords"></el-input><br/>
            <span>注意：多个SEO关键字以逗号隔开</span>
          </el-form-item>
          <el-form-item label="SEO描述：">
            <el-input type="textarea" :rows="2" v-model="dimensionCatalogBasicInfo.SEODescription"></el-input>
          </el-form-item>
          <el-form-item label="SEO标题：">
            <el-input v-model="dimensionCatalogBasicInfo.SEOTitle"></el-input>
          </el-form-item>
        </div>
      </el-form>
    </div>
  </div>
</template>
<script src="./dimensionCatalogBasic.js"></script>
<style scoped>
.dimension-catalog-logo-avatar {
  max-width: 120px;
  max-height: 120px;
}
</style>
