<template>
	<div>
		<div flex="main:justify">
			<div style="width: 47%">
				<base-form ref="customForm" :formRow="gnerationFormRow" :isFunBtn="false" 
					@onSubmit="getSubmit">
				</base-form>
				<p class="small_title">功能点</p>
				<div flex="main:justify" style="align-items: center;">
					<div class="disabled">
						<el-checkbox v-model="dataMain.Bm_IsApprover" label="审批流" disabled border></el-checkbox>
						<el-checkbox v-model="dataMain.Bm_IsAttachment" label="附件" disabled border></el-checkbox>
					</div>
					<el-radio-group v-model="dataMain.Bm_openType" disabled class="disabled">
						<el-radio :label="1">弹窗</el-radio>
						<el-radio :label="2">菜单</el-radio>
					</el-radio-group>
				</div>
				<p class="small_title">已经生成代码</p>
				<div class="disabled">
					<el-checkbox fill="#000"  v-for="(item,index) in codeList1" :key="index" v-model="buildSelected" :label="item.propName" style="width: calc(25% - 10px);margin: 0 0 10px 10px;" border disabled>{{item.labelName}}</el-checkbox>
				</div>
				<p class="small_title">本次需要生成</p>
				<div>
					<el-checkbox  v-for="(item,index) in codeList2" :key="index" v-model="needToSelect" :label="item.propName" @change="checked=>needCheck(checked,item.propName)" style="width: calc(25% - 10px);margin: 0 0 10px 10px;" border>{{item.labelName}}</el-checkbox>
				</div>
			</div>
			<div style="width: 50%;">
				<p class="small_title">数据库表名</p>
				<base-layout ref="databaseName" :showTitle="false">
					<div slot="main">
						<base-table ref="databaseCustomtable" :border="true" :showIndex="false"
							:tabLoading.sync="databaseTabLoading" :tableHeight="databaseTableHeight" 
							:tableData="databaseTableData" :tableColumn="databaseTableColumn"
							@rowDblclick="databaseDbclick"
							>
						</base-table>
					</div>
				</base-layout>
				<p class="small_title">数据库字段集合</p>
				<p class="bigTitle">表名称{{fieldName}}</p>
				<base-layout ref="fieldName" :showTitle="false">
					<div slot="main">
						<base-table ref="fieldCustomtable" :border="true" :showIndex="false"
							:tabLoading.sync="fieldTabLoading" :tableHeight="fieldTableHeight" :tableData="fieldTableData" 
							:tableColumn="fieldTableColumn" >
							<template v-slot:isMustFill="{ row }">
        				     <span>{{ row.isMustFill == "1" ? "是" : "否" }}</span>
        				    </template>
        				    <template v-slot:isVisible="{ row }">
        				      <span>{{ row.isVisible == "1" ? "是" : "否" }}</span>
        				    </template>
						</base-table>
					</div>
				</base-layout>
			</div>
		</div>
	</div>
</template>

<script>
	import baseForm from "@/components/base/baseNewForm"
	import baseTable from "@/components/base/baseTable"
	import baseTree from "@/components/base/BaseMenuTree"
	import baseLayout from "@/components/base/baseLayout"
	import configData from "./configData"
	import { GetTablesCoulmn } from '@/api/apis/documentManagement'
	export default {
		components: {
			baseForm,
			baseLayout,
			baseTable,
			baseTree
		},
		data() {
			return {
				checkList: [],
				radioValue: '',
				databaseTabLoading: false,
				databaseTableHeight: '20vh',
				gnerationFormRow: configData.gnerationFormRow,
				databaseTableColumn: configData.databaseTableColumn,
				codeList1:[
					{propName:'Bm_IsMenu',labelName:'菜单',value:0},
					{propName:'Bm_IsButton',labelName:'标准按钮',value:0},
					{propName:'Bm_IsCreateTable',labelName:'数据库表',value:0},
					{propName:'Bm_IsEntity',labelName:'实体',value:0},
					{propName:'Bm_IsController',labelName:'接口',value:0},
					{propName:'Bm_IsView',labelName:'Html',value:0},
					{propName:'Bm_IsJS',labelName:'Js',value:0},
				],
				codeList2:[
					{propName:'IsCreateMenuNew',labelName:'菜单',value:0},
					{propName:'IsCreateButtonNew',labelName:'标准按钮',value:0},
					{propName:'IsCreateTableNew',labelName:'数据库表',value:0},
					{propName:'IsEntityNew',labelName:'实体',value:0},
					{propName:'IsControllerNew',labelName:'接口',value:0},
					{propName:'IsViewNew',labelName:'Html',value:0},
					{propName:'IsJSNew',labelName:'Js',value:0},
				],
				databaseTableData: [],
				fieldTabLoading: false,
				fieldTitle:'新增表字段',
				fieldTableHeight: '40vh',
				fieldTableColumn: configData.fieldTableColumn,
				fieldFormRow: configData.fieldFormRow,
				fieldTableData: [],
				fieldName: '暂未选择数据库表',
				mainTablemData:[
					{sort:1,nameEn:'billid',nameCH:'唯一ID',zdType:'uniqueidentifier',zdLength:'',showType:'',dataSource:'',mustWrite:'1',show:'0'},
					{sort:2,nameEn:'billCode',nameCH:'单据编号',zdType:'nvarchar',zdLength:'(50)',showType:'',dataSource:'',mustWrite:'1',show:'1'},
					{sort:3,nameEn:'organID',nameCH:'部门ID',zdType:'nvarchar',zdLength:'(50)',showType:'',dataSource:'',mustWrite:'1',show:1},
					{sort:101,nameEn:'createPersonID',nameCH:'创建人ID',zdType:'nvarchar',zdLength:'(50)',showType:'',dataSource:'',mustWrite:'1',show:'0'},
					{sort:102,nameEn:'createDate',nameCH:'创建日期',zdType:'datetime',zdLength:'',showType:'',dataSource:'',mustWrite:'1',show:'0'},
					{sort:103,nameEn:'updatePersonID',nameCH:'最后一次修改人',zdType:'nvarchar',zdLength:'',showType:'',dataSource:'',mustWrite:'0',show:'0'},
					{sort:104,nameEn:'updateDate',nameCH:'最后一次修改日期',zdType:'datetime',zdLength:'',showType:'',dataSource:'',mustWrite:'0',show:'0'},
					{sort:105,nameEn:'isdelete',nameCH:'删除标识（1删除）',zdType:'int',zdLength:'',showType:'',dataSource:'',mustWrite:'0',show:'0'},
				],
				subtableData:[
					{sort:1,nameEn:'detail_ID',nameCH:'子表唯一ID',zdType:'uniqueidentifier',zdLength:'',showType:'',dataSource:'',mustWrite:'1',show:'0'},
					{sort:104,nameEn:'rowIndex',nameCH:'行号',zdType:'int',zdLength:'',showType:'',dataSource:'',mustWrite:'1',show:'1'},
					{sort:101,nameEn:'mainID',nameCH:'主表ID',zdType:'nvarchar',zdLength:'(50)',showType:'',dataSource:'',mustWrite:'1',show:0},
					{sort:102,nameEn:'detail_createDate',nameCH:'创建日期',zdType:'datetime',zdLength:'(50)',showType:'',dataSource:'',mustWrite:'1',show:'0'},
					{sort:103,nameEn:'Detail_updateDate',nameCH:'最后一次修改日期',zdType:'datetime',zdLength:'',showType:'',dataSource:'',mustWrite:'0',show:'0'},
				],
				grandsonTableData:[
					{sort:1,nameEn:'detail_ID',nameCH:'子表唯一ID',zdType:'uniqueidentifier',zdLength:'',showType:'',dataSource:'',mustWrite:'1',show:'0'},
					{sort:104,nameEn:'rowIndex',nameCH:'行号',zdType:'int',zdLength:'',showType:'',dataSource:'',mustWrite:'1',show:'1'},
					{sort:101,nameEn:'mainID',nameCH:'主表ID',zdType:'nvarchar',zdLength:'(50)',showType:'',dataSource:'',mustWrite:'1',show:0},
					{sort:102,nameEn:'detail_createDate',nameCH:'创建日期',zdType:'datetime',zdLength:'(50)',showType:'',dataSource:'',mustWrite:'1',show:'0'},
					{sort:103,nameEn:'Detail_updateDate',nameCH:'最后一次修改日期',zdType:'datetime',zdLength:'',showType:'',dataSource:'',mustWrite:'0',show:'0'},
				],
				temporaryTableData:[],
				dataMain:{
					Bm_IsApprover:'',
					Bm_IsAttachment:'',
					Bm_openType:''
				},
				buildSelected:[],
				needToSelect: []
			}
		},
		mounted() {
		},
		methods: {
			//提交
			getSubmit() {
			},
			// 双击事件
			async databaseDbclick(row){
				this.fieldName = row.tableNameEN
				let res = await GetTablesCoulmn({
					tableNameEN: row.tableNameEN
				})
				if (res.code = 1) {
					this.fieldTableData = Object.assign([], res.data[0])
				}

				// this.fieldName = row.nameEn
				// let arr = {
				// 	name:row.nameEn,
				// 	tableData:[]
				// }
				// let identical = true
				// if(this.temporaryTableData.length > 0){
				// 	this.temporaryTableData.forEach(el =>{
				// 		if(el.name == row.nameEn){
				// 			this.fieldTableData = el.tableData
				// 			identical = false
				// 			return
				// 		}
				// 	})
				// 	if(identical){
				// 			if(row.tableType == '0'){
				// 				arr.tableData = Object.assign([], this.mainTablemData)
				// 			}
				// 			if(row.tableType == '1'){
				// 				arr.tableData = Object.assign([], this.subtableData)
				// 			}
				// 			if(row.tableType == '2'){
				// 				arr.tableData = Object.assign([], this.grandsonTableData)
				// 			}
				// 			this.temporaryTableData.push(arr)
				// 			this.fieldTableData = arr.tableData 
				// 	}
				// }else{
				// 	if(row.tableType == '0'){
				// 		arr.tableData = Object.assign([], this.mainTablemData)
				// 	}
				// 	if(row.tableType == '1'){
				// 		arr.tableData = Object.assign([], this.subtableData)
				// 	}
				// 	if(row.tableType == '2'){
				// 		arr.tableData = Object.assign([], this.grandsonTableData)
				// 	}
				// 	this.temporaryTableData.push(arr)
				// 	this.fieldTableData = arr.tableData 
				// }
			},
			// 选择需要生成的代码
			needCheck(state,val) {
				if (state) {
					if (val == "IsCreateMenuNew") {
						if (this.buildSelected.includes("Bm_IsMenu")) {
							this.open(val)
						}
					} else if (val == "IsCreateButtonNew") {
						if (this.buildSelected.includes("Bm_IsButton")) {
							this.open(val)
						}
					} else if (val == "IsCreateTableNew") {
						if (this.buildSelected.includes("Bm_IsCreateTable")) {
							this.open(val)
						}
					} else if (val == "IsEntityNew") {
						if (this.buildSelected.includes("Bm_IsEntity")) {
							this.open(val)
						}
					} else if (val == "IsControllerNew") {
						if (this.buildSelected.includes("Bm_IsController")) {
							this.open(val)
						}
					} else if (val == "IsViewNew") {
						if (this.buildSelected.includes("Bm_IsView")) {
							this.open(val)
						}
					} else if (val == "IsJSNew") {
						if (this.buildSelected.includes("Bm_IsJS")) {
							this.open(val)
						}
					}
				}
			},
			open(val){
				this.$confirm('当前代码已生成，重新生成代码将被覆盖，是否重新生成?', '提示', {
        		  confirmButtonText: '确定',
        		  cancelButtonText: '取消',
        		  type: 'warning'
        		}).then(() => {
        		//   this.$message({
        		//     type: 'success',
        		//     message: '删除成功!'
        		//   });
        		}).catch(() => {
				  this.needToSelect.splice(this.needToSelect.indexOf(val),1)
        		  this.$message({
        		    type: 'info',
        		    message: '已取消生成'
        		  });   
        		});
			}
		}
	}
</script>

<style scoped>

	.small_title {
		box-sizing: border-box;
		font-size: 14px;
		font-weight: 600;
		padding: 5px;
		margin: 0px auto 9px;
		color: #000000d9;
		border-bottom: 1px solid #ccc;
	}

	.bigTitle {
		font-size: 18px;
		font-weight: bold;
		color: black;
		text-align: center;
		margin-bottom: 15px;
	}

	.organizationBody {
		display: flex;
		justify-content: space-evenly;
		background-color: #f2f3f4;
		padding: 10px;
		max-height: 400px;
		overflow: auto;
	}

	.disabled >>> .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after {
	border-color: #fff;
	}
	.disabled >>> .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
	background-color: #409eff;
	border-color: #409eff;
	}
	.disabled >>> .el-checkbox__input.is-disabled + span.el-checkbox__label {
	color: #606266;
	}
	.disabled >>> .el-checkbox__label {
	font-size: 12px;
	}

	.disabled >>> .el-radio__input.is-disabled.is-radio .el-radio__inner::after {
	border-color: #fff;
	}
	.disabled >>> .el-radio__input.is-disabled.is-radio .el-radio__inner {
	background-color: #409eff;
	border-color: #409eff;
	}
	.disabled >>> .el-radio__input.is-disabled + span.el-radio__label {
	color: #606266;
	}
	.disabled >>> .el-radio__label {
	font-size: 12px;
	}
	.disabled >>> .el-radio__input.is-disabled.is-checked .el-radio__inner {
    background-color: #409eff;
    border-color: #fff;
	}
	/* .disabled >>> .el-radio__input.is-disabled {
    background-color: red;
    border-color: #dfe4ed;
    cursor: not-allowed;
	} */
</style>
