<template>
  <div class="page-wrap">
    <!-- <div style="width: 100%;padding: 10px;background-color: #fff;border-bottom: 1px solid #666666;box-sizing: border-box;">
      <c-select v-model="selectName" placeholder="请选择" @change="handleChange">
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value">
        </el-option>
      </c-select>
    </div> -->
    <div class="form-content">
			<c-page title="模板">
				<el-form label-width="120px" label-position="right" size="small" :model="frameData">
					<c-col :span="24">
						<c-col :span="Number(item.showwidth)" v-for="(item, index) in frameList" :key="index">
							<el-form-item 
								:label="item.name" 
								style="width: 100%"
								:disabled="item.showenable === 'Y'"
							>
								<c-input 
									v-if="['NUMBER','STRING'].includes(item.showtype)"
									v-model.trim="frameData[item.cod]"
									style="width:100%" 
									:placeholder="`请输入${item.name}`"
								></c-input>
							</el-form-item>
							<!-- <c-date-picker
									v-if="['datepicker'].includes(item.showtype)"
									type="date"
									v-model.trim="item.cod"
									style="width: 100%"
									placeholder="请选择日期"
									:disabled="item.showenable === 'Y'"
								></c-date-picker> -->
								<!-- <c-select
									v-if="['select'].includes(item.showtype)"
									v-model.trim="item.cod"
									style="width: 100%"
									:placeholder="`请选择${item.name}`"
									:disabled="item.showenable === 'Y'"
								>
									<el-option 
										v-for="item in item.codeList" 
										:key="item.value"
										:label="item.label"
										:value="item.value"
									>
									</el-option>
								</c-select> -->
						</c-col>
					</c-col>
				</el-form>
			</c-page>
    </div>
  </div>
</template>
<script>
import Api from "~/service/Api"
import commonFunctions from '~/mixin/commonFunctions.js';

export default {
	name: 'Template',
	mixins: [commonFunctions],
	provide() {
    return {
      root: this
    };
  },
  data () {
    return {
      options: [
        {
          value: '1',
          label: '1'
        }, {
          value: '2',
          label: '2'
        }, {
          value: '3',
          label: '3'
        }
      ],
      selectName: '1',
			frameList: [],
			frameData: {}
    }
  },
  mounted () {
    this.getConfigData()
  },
  methods: {
    handleChange () {
      this.getConfigData()
		},
    async getConfigData () {
			let params = {
				objinr: "00000008",
				objtyp: "gtx"
			}
			const loading = this.loading();
      let res = await Api.post('/manager/gtxUse/listGidTmplVar',params)
			if (res.respCode == SUCCESS) {
				this.frameList = res.data;
			} else {
				this.$notify.error({ title: "错误", message: "服务请求失败！" });
			}
			loading.close();
		},
  }
}
</script>
<style lang="less" scoped>
.page-wrap {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  padding: 2px;
  box-sizing: border-box;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  border: 1px solid #707070;
  .form-content {
    width: 100%;
    flex: 1;
    position: relative;
    border: 1px solid #B1B1B1;
    overflow-y: auto;
    background-color: #fff;
    padding: 5px 0;
  }
}
</style>