<template>
	<lay-form :model="dataInfo" class="dataInfo">
		<lay-form-item label="新增销售号描述" prop="FSaleCode" required label-width="120" style="margin-bottom:30px;">
			<lay-input v-model="dataInfo.FSaleCode" @input="_inputSaleCode"></lay-input>
			<lay-select class="sale-note" v-if="saleList.length > 0" v-model="dataInfo.FSaleCode" :showEmpty="false"
				@change="saleList = []">
				<lay-select-option v-for="(sv, si) in saleList" key="si" :value="sv.FName" :label="sv.FName" size="xs">
				</lay-select-option>
			</lay-select>
			<p class="note">注：根据销售号查询结果，如果是新销售号则可以选择新的配方</p>
		</lay-form-item>
		<lay-form-item label="包规" required prop="FPackCode" label-width="120" style="margin-bottom:30px;">
			<lay-input v-model="dataInfo.FPackCode"></lay-input>
		</lay-form-item>
		<lay-form-item label="选择模式" prop="factoryValue" required label-width="120">
			<lay-select v-model="factoryValue" placeholder="请选择">
				<lay-select-option v-for="(fIdv, fIdx) in factoryLists" key="fIdx" :value="fIdv.FID" :label="fIdv.FName"></lay-select-option>
			</lay-select>
		</lay-form-item>
		<lay-form-item label="选择物料组" prop="FMaterialGroup" required label-width="120">
			<lay-select v-model="dataInfo.FMaterialGroup" v-if="seletList[1].length > 0">
				<lay-select-option v-for="(rV, rI) in seletList[1]" key="rI" :value="rV.FValue + ''" :label="rV.FName">
				</lay-select-option>
			</lay-select>
		</lay-form-item>
		<lay-form-item label="订单试验号" prop="FTestCode" required label-width="120">
			<lay-input v-model="dataInfo.FTestCode"></lay-input>
		</lay-form-item>
		<lay-form-item label="计量单位" prop="FWeightUnit" required label-width="120">
			<lay-select v-model="dataInfo.FWeightUnit" v-if="seletList[0].length > 0">
				<lay-select-option v-for="(rV, rI) in seletList[0]" key="rI" :value="rV.FValue + ''" :label="rV.FValue">
				</lay-select-option>
			</lay-select>
			<p class="note3" v-if="seletList[0].find(s => s.FValue == dataInfo.FWeightUnit) != null">
				{{ seletList[0].find(s => s.FValue == dataInfo.FWeightUnit).FName }}
			</p>
		</lay-form-item>
		<lay-form-item label="物料类型" prop="FMaterialType" required label-width="120" style="margin-bottom:30px;">
			<lay-input v-model="dataInfo.FMaterialType" disabled="disabled"></lay-input>
			<p class="note">备注：默认，不允许变更</p>
		</lay-form-item>
		<lay-form-item label="配方选择" prop="FFormulaName" required label-width="120" style="margin-bottom:30px;">
			<lay-input v-model="dataInfo.FFormulaName" disabled="disabled"></lay-input>
			<p class="note">备注：实际选择试验号。通过下方“配方检索”检索配方，然后点击行最左侧
			<div class="layui-form-radio"><i class="layui-icon"></i></div>选择配方</p>
		</lay-form-item>
		<lay-form-item label="配方检索" prop="FSearchName" label-width="120" class="FSearchName">
			<lay-input v-model="dataInfo.FSearchName"></lay-input>
			<lay-button type="primary" @click="_searchPageList" class="search-btn2">检索</lay-button>
		</lay-form-item>
		<lay-form-item v-if="dataList.length > 0">
			<lay-table height="200px" :columns="dataColumn" v-model:selected-key="selectedKey" id="FID"
				:dataSource="dataList" :page="dataList.length > 0 ? pageInfo : null" @change="changePage">
			</lay-table>
		</lay-form-item>
	</lay-form>
	<div v-if="showButton">
		<lay-form-item v-if="dataInfoObj.FTeamID">
			<lay-button type="normal" @click="submitClick(true)">确认</lay-button>
			<lay-button @click="cancelClick">取消</lay-button>
			<p class="note2">备注：BOM清单后台静默下载，若下载失败会生成“手动下载BOM事项”</p>
		</lay-form-item>
		<lay-form-item v-else>
			<lay-button type="normal" @click="submitClick(true)">新增</lay-button>
			<lay-button type="primary" @click="submitClick(false)">暂存</lay-button>
			<lay-button @click="cancelClick">取消</lay-button>
			<p class="note2">备注：BOM清单后台静默下载，若下载失败会生成“手动下载BOM事项”</p>
		</lay-form-item>
	</div>
</template>

<style scoped>
.dataInfo {
	max-width: 90%;
	height: 600px;
	margin: 30px auto;
	padding-right: 30px;
	overflow-y: auto;
}

.search-btn2 {
	position: absolute;
	right: 0;
	top: 0;
}

.note2 {
	display: inline-block;
	margin-left: 16px;
}

.note3 {
	display: inline-flex;
	line-height: 38px;
	margin-left: 12px;
}

.note2,
.note {
	color: #999;
	font-size: 12px;
}

.note {
	margin-top: 4px;
	position: absolute;
	right: 0;
}

.note .layui-form-radio,
.note .layui-form-radio i {
	margin: 0 1px 0 0;
	padding: 0;
	font-size: 14px;
	margin-top: -2px;
	line-height: 0;
}

.FSearchName {
	color: var(--global-primary-color)
}
</style>
<script>
import {
	ref,
	watch
} from 'vue';
import {
	getDataCode,
	getPageList,
	getBasicList,
	insertDataInfo,
	updateDataInfo,
	getDataModel
} from "/src/api/api/common";
import {
	getFactoryList
} from "/src/api/api/factory";

export default {
	setup() {
		const dataInfo = ref({
			FMaterialType: "ZMAT",
			FWeightUnit: "KG"
		});
		const formulaList = ref([]);
		const seletList = ref([
			[],
			[]
		]);
		const typeList = ref([]);

		let dataColumn = [{
			type: "radio"
		}, {
			title: "名称",
			key: "FName"
		},
		{
			title: "试验号",
			key: "FTestCode"
		},
		{
			title: "配方种类",
			key: "FTypeName",
			width: "110px"
		},
		{
			title: "版本号",
			key: "FVersionCode"
		}
		];
		dataColumn.forEach((item) => {
			item.align = "center";
		});
		const pageInfo = ref({
			total: 0,
			limit: 5,
			current: 1
		});
		const dataList = ref([]);
		const selectedKey = ref("");
		watch(selectedKey, function () {
			const chose = dataList.value.find(s => s.FID == selectedKey.value) || null;
			if (chose != null) {
				dataInfo.value.FFormulaName = chose.FName + "+" + chose.FTestCode + "+" + chose.FVersionCode;
				dataInfo.value.FFormulaID = chose.FID;
				dataInfo.value.FVersionCode = chose.FVersionCode;
				dataInfo.value.FFormulaTestCode = chose.FTestCode;
			}
		});

		const showEditBox = ref(false);
		const showButton = ref(true);
		const saleList = ref([]);
		const factoryLists = ref([]);
		const factoryValue=ref(null);
		return {
			dataInfo,
			formulaList,
			seletList,
			typeList,
			dataColumn,
			dataList,
			pageInfo,
			selectedKey,
			showEditBox,
			showButton,
			saleList,
			factoryLists,
			factoryValue
		}
	},
	props: {
		dataInfoObj: {
			type: Object,
			default: () => { },
		}
	},
	mounted() {
		//其他地方过来获取数据
		if (this.dataInfoObj && this.dataInfoObj.FTeamID) {
			this._getTeamData(this.dataInfoObj.FTeamID);
			this.showButton = this.dataInfoObj.FCanEdit != 2
		}
		this._getSelectList();
		this._getFactoryList();
	},
	methods: {
		cancelClick(isFirst) {
			this.$emit('cancelClick', isFirst ? isFirst : false);
		},
		async _getFactoryList() {
			this.factoryLists = await getFactoryList() || [];
		},
		async _getTeamData(dataId) {
			let result = await getDataModel({
				FID: dataId,
				FKey: "FID,FTestCode,FWeightUnit,FSaleCode,FMaterialType,FMaterialGroup,FFormulaTestCode,FFormulaName,FFormulaID"
			}, "Teamwork");
			this.dataInfo = result || this.dataInfo;
		},
		async _getSelectList() {
			let result = await getDataCode({
				FType: '1,2'
			});
			this.seletList[0] = result.FType1 || [];
			this.seletList[1] = result.FType2 || [];
			this.typeList = await getBasicList(37) || [];
			this._getPageList();
		},
		async _inputSaleCode(val) {
			let pData = {
				FPageIndex: 1,
				FPageSize: 10,
				FName: val || ""
			};
			this.saleList = [];
			if (pData.FName != "") {
				let result = await getPageList(pData, "Material");
				this.saleList = result.Data.List || [];
			}
		},
		//配方检索
		_searchPageList(value) {
			this._getPageList(true);
		},
		//配方翻页
		changePage(obj) {
			this.pageInfo.current = obj.current;
			this.pageInfo.limit = obj.limit;
			this._getPageList();
		},
		//配方接口
		async _getPageList(isFirst) {
			if (isFirst) {
				this.pageInfo.current = 1;
				this.pageInfo.total = 0;
			}
			let postData = {
				FPageIndex: this.pageInfo.current,
				FPageSize: this.pageInfo.limit
			}
			let search = this.dataInfo.FSearchName;
			if (search && search != "") {
				postData.Or_FPlmCode = postData.Or_FTestCode = postData.Or_FName = postData.Or_FVersionCode =
					search;
			}
			let result = await getPageList(postData, "Formula");
			result.Data.List = result.Data.List || [];
			result.Data.List.forEach((item) => {
				let type = this.typeList.find(s => s.FValue == item.FType);
				item.FTypeName = type == null ? item.FType : type.FName;
				if (this.dataInfo.FFormulaID == item.FID) this.selectedKey = item.FID
			});
			this.pageInfo.total = result.Data.Total || 0;
			this.dataList = result.Data.List;
		},
		//数据-验证
		async submitClick(isCreate) {
			let postData = this.dataInfo;
			postData.FSaleCode = (postData.FSaleCode || "").trim();
			postData.FTestCode = (postData.FTestCode || "").trim();
			postData.FMaterialGroup = (postData.FMaterialGroup || "").trim();
			postData.FWeightUnit = (postData.FWeightUnit || "").trim();
			postData.FFormulaName = (postData.FFormulaName || "").trim();
			postData.factoryValue=this.factoryValue;
			for (let key in postData) {
				if (postData[key] == "") return false;
			}
			// let indexs = [postData.FSaleCode.indexOf("-"), postData.FSaleCode.indexOf("@")];
			// if (indexs[0] == -1 || indexs[1] == -1 || indexs[1] - indexs[0] < 2) {
			// 	layer.msg('必须要输入包材代码')
			// 	return false;
			// }
			postData.FState = isCreate ? 1 : 0;
			postData = JSON.parse(JSON.stringify(postData));
			if (postData.FTestCode != postData.FFormulaTestCode) {
				this.sureTextCode(postData);
				return false;
			}
			this._postTermData(postData);
		},
		//数据-确认
		sureTextCode(postData) {
			let $this = this;
			layer.confirm("选择的配方和订单试验号不一致，请确认使用选择的配方嘛？", {
				title: "提示",
				btn: [{
					text: '暂时保存',
					callback: function (id) {
						layer.close(id);
						postData["FState"] = 0;
						$this._postTermData(postData);
					}
				},
				{
					text: '确认提交',
					callback: function (id) {
						layer.close(id);
						postData["FState"] = 1;
						$this._postTermData(postData);
					}
				}
				]
			});
		},
		//数据-提交
		async _postTermData(postData) {
			delete postData["FSearchName"];
			let result = 0;
			let idx = layer.load(2);
			if (postData.FID && postData.FID > 0) {
				result = await updateDataInfo(postData, "Teamwork") || 0;
			} else {
				result = await insertDataInfo(postData, "Teamwork") || 0;
			}
			if (result > 0) {
				this.cancelClick(true);
			}
			layer.close(idx);
		}
	}
}
</script>
