<template>
	<lay-container fluid="true" style="padding: 10px">
		<lay-row space="10">
			<lay-col span="24">
				<lay-card>
					<lay-form :model="searchObj" class="search-box">
						<lay-row class="search-items">
							<lay-form-item label="物料号" prop="FCode">
								<lay-input v-model="searchObj.FCode"></lay-input>
							</lay-form-item>
							<lay-form-item label="试验号" prop="FTestCode">
								<lay-input v-model="searchObj.FTestCode"></lay-input>
							</lay-form-item>
							<lay-form-item label="物料描述" prop="FName">
								<lay-input v-model="searchObj.FName"></lay-input>
							</lay-form-item>
							<lay-form-item label="产品分类" prop="FType">
								<lay-select v-model="searchObj.FType">
									<lay-select-option v-for="(tIdv, tIdx) in typeList" :key="tIdx" :value="tIdv.FValue"
										:label="tIdv.FName"></lay-select-option>
								</lay-select>
							</lay-form-item>
						</lay-row>
						<lay-form-item class="search-btn">
							<lay-button size="sm" type="primary" @click="_clickSearch">搜索</lay-button>
							<lay-button size="sm" @click="_clickReset">重置</lay-button>
						</lay-form-item>
					</lay-form>
					<lay-table :columns="dataColumn" id="id" :dataSource="dataList" v-model:selectedKeys="selectedKeys"
						:checkbox="checkbox" :default-toolbar="defaultToolbar" :page="dataList.length > 0 ? pageInfo : null"
						@change="changePage">
						<template v-slot:toolbar>
							<lay-button size="sm" @click="_getPageList(false, true)">刷新</lay-button>
							<lay-button size="sm" type="normal" @click="_dockSureBox(1)">SAP物料同步</lay-button>
							<lay-button size="sm" type="normal">SAP物料导入
								<lay-upload :url="uploadInfo.url + 1" :data="uploadInfo.data" :headers="uploadInfo.headers"
									:acceptMime="uploadInfo.acceptMime" :accept="uploadInfo.accept" :exts="uploadInfo.exts"
									@done="uploadInfo.done" @before="uploadInfo.before" @error="uploadInfo.error"
									:auto-upload="true" :limit="1" :multiple="false">
								</lay-upload>
							</lay-button>
							<lay-button size="sm" type="normal">替代料导入
								<lay-upload :url="uploadInfo.url + 2" :data="uploadInfo.data" :headers="uploadInfo.headers"
									:acceptMime="uploadInfo.acceptMime" :accept="uploadInfo.accept" :exts="uploadInfo.exts"
									@done="uploadInfo.done" @before="uploadInfo.before" @error="uploadInfo.error"
									:auto-upload="true" :limit="1" :multiple="false">
								</lay-upload>
							</lay-button>
							<lay-button size="sm" type="normal">副产物导入
								<lay-upload :url="uploadInfo.url + 3" :data="uploadInfo.data" :headers="uploadInfo.headers"
									:acceptMime="uploadInfo.acceptMime" :accept="uploadInfo.accept" :exts="uploadInfo.exts"
									@done="uploadInfo.done" @before="uploadInfo.before" @error="uploadInfo.error"
									:auto-upload="true" :limit="1" :multiple="false">
								</lay-upload>
							</lay-button>
							<lay-button size="sm" type="normal">物料信息补全导入
								<lay-upload :url="uploadInfo.url + 4" :data="uploadInfo.data" :headers="uploadInfo.headers"
									:acceptMime="uploadInfo.acceptMime" :accept="uploadInfo.accept" :exts="uploadInfo.exts"
									@done="uploadInfo.done" @before="uploadInfo.before" @error="uploadInfo.error"
									:auto-upload="true" :limit="1" :multiple="false">
								</lay-upload>
							</lay-button>
							<lay-button size="sm" type="primary" @click="_clickDown(2)">SAP物料模板</lay-button>
							<lay-button size="sm" type="primary" @click="_clickDown(3)">替代料模板</lay-button>
							<lay-button size="sm" type="primary" @click="_clickDown(4)">副产物模板</lay-button>
							<lay-button size="sm" type="primary" @click="_clickDown(5)">信息补全模板</lay-button>
							<lay-button size="sm" type="primary" @click="_downViewAll(2)">导出SAP</lay-button>
							<lay-button size="sm" type="primary" @click="_downViewAll(1)">导出视图</lay-button>
						</template>
						<template v-slot:FCode="{ data }">
							{{ data.FCode }}
						</template>
						<template v-slot:FTestCode="{ data }">
							{{ data.FTestCode }}
						</template>
						<template v-slot:FName="{ data }">
							{{ data.FName }}
						</template>
						<template v-slot:FTypeName="{ data }">
							{{ data.FTypeName }}
						</template>
						<template v-slot:FSupplyCode="{ data }">
							{{ data.FSupplyCode }}
						</template>
						<template v-slot:FSuccedaneumCode="{ data }">
							{{ data.FSuccedaneumCode }}
						</template>
						<template v-slot:FSuccedaneumInfo="{ data }">
							{{ data.FSuccedaneumInfo }}
						</template>
						<template v-slot:FSuTypeName="{ data }">
							{{ data.FSuTypeName }}
						</template>
						<template v-slot:FFuProductsCode="{ data }">
							{{ data.FFuProductsCode }}
						</template>
						<template v-slot:FFuProductsInfo="{ data }">
							{{ data.FFuProductsInfo }}
						</template>
						<template v-slot:FFuTypeName="{ data }">
							{{ data.FFuTypeName }}
						</template>
						<template v-slot:FAddDate="{ data }">
							{{ data.FAddDate }}
						</template>
						<template v-slot:FEditDate="{ data }">
							{{ data.FEditDate }}
						</template>
						<template v-slot:operator="{ data }">
							<lay-button size="xs" type="normal" @click="_clickSetInfo(data, 1)">替代料</lay-button>
							<lay-button size="xs" type="normal" @click="_clickSetInfo(data, 2)">副产物</lay-button>
							<lay-button size="xs" type="primary" @click="_clickSetInfo(data, 3)">视图</lay-button>
						</template>
					</lay-table>
				</lay-card>
			</lay-col>
		</lay-row>
		<lay-layer area="70%" v-model="showEditBox" :title="editBoxTitle">
			<EditMaterial :objInfoObj="objInfoObj" :typeListObj="typeList" @cancelClick="cancelClick" :editType="editType">
			</EditMaterial>
		</lay-layer>
		<lay-layer area="90%" v-model="showShowBox" title="视图查看">
			<ShowMaterial :objInfoObj="objInfoObj" @cancelClick="cancelClick"></ShowMaterial>
		</lay-layer>
	</lay-container>
</template>
<script>
import {
	ref,
	watch
} from "vue";
import {
	getBasicList,
	getPageList,
	getTempFile
} from "/src/api/api/common";
import {
	getUploadInfo
} from "/src/api/http";
import {
	getFactoryList
} from "/src/api/api/factory";
import {
	dockSapMaterial,
	DownViewAll
} from "/src/api/api/material";

import EditMaterial from './components/EditMaterial.vue';
import ShowMaterial from './components/ShowMaterial.vue';
import '@layui/layui-vue/es/checkbox/index.css';
import '@layui/layui-vue/es/radio/index.css';

export default {
	components: {
		EditMaterial,
		ShowMaterial
	},
	setup() {
		let dataColumn = [{
			title: "物料号",
			key: "FCode",
			width: "190px"
		},
		{
			title: "试验号",
			key: "FTestCode",
			width: "190px"
		},
		{
			title: "物料描述",
			key: "FName",
			width: "300px"
		},
		{
			title: "产品分类",
			key: "FTypeName",
			width: "110px"
		},
		{
			title: "供应标识符",
			key: "FSupplyCode",
			hide: true,
			width: "100px"
		},
		{
			title: "替代料物料号",
			key: "FSuccedaneumCode",
			hide: true,
			width: "190px"
		},
		{
			title: "替代料描述",
			key: "FSuccedaneumInfo",
			width: "300px"
		},
		{
			title: "替代料分类",
			key: "FSuTypeName",
			width: "110px",
			hide: true,
		},
		{
			title: "副产物物料号",
			key: "FFuProductsCode",
			width: "190px",
			hide: true
		},
		{
			title: "副产物描述",
			key: "FFuProductsInfo",
			width: "300px"
		},
		{
			title: "副产物分类",
			key: "FFuTypeName",
			width: "110px",
			hide: true
		},
		{
			title: "副产物数量",
			key: "FFuProductsCount",
			width: "100px",
			hide: true
		},
		{
			title: "创建时间",
			key: "FAddDate",
			width: "182px",
			hide: true
		},
		{
			title: "最后修改时间",
			key: "FEditDate",
			width: "182px",
			hide: true
		},
		{
			title: "操作",
			key: "operator",
			width: "190px",
			fixed: "right"
		}
		];
		dataColumn.forEach((item) => {
			item.customSlot = item.key;
			item.align = "center";
		});
		const selectedKeys = ref(["1"]);
		const checkbox = ref(false);
		const defaultToolbar = ref(true);
		const materialInfoObj = ref({});
		const pageInfo = ref({
			total: 0,
			limit: 10,
			current: 1
		});
		const dataList = ref([]);
		const typeList = ref([]);
		const factoryList = ref([]);
		const searchObj = ref({});
		const postData = ref({});
		const uploadInfo = ref({});

		const showEditBox = ref(false);
		const showShowBox = ref(false);
		const editBoxTitle = ref("");
		const objInfoObj = ref({});
		const editType = ref(1);
		return {
			materialInfoObj,
			selectedKeys,
			checkbox,
			defaultToolbar,
			dataColumn,
			dataList,
			pageInfo,
			searchObj,
			postData,
			uploadInfo,
			factoryList,
			typeList,
			showEditBox,
			showShowBox,
			editBoxTitle,
			objInfoObj,
			editType
		};
	},
	mounted() {
		this._getTypeList();
		this._getPageList(true);
		this._getUploadInfo();
		this._getFactoryList();
	},
	methods: {
		changePage(obj) {
			this.pageInfo.current = obj.current;
			this.pageInfo.limit = obj.limit;
			this._getPageList();
		},
		cancelClick(isRefresh) {
			if (isRefresh && this.showEditBox) {
				this._getPageList(true);
			}
			this.showEditBox = false;
		},
		async _downViewAll(i) {
			let result = await DownViewAll({
				FType: i
			})

			let id= layer.msg('数据整理中...', {
				icon: 16,
				shade: 0.01,
				time: 240000
			});

			if(result.Code==200)
			{
				window.location.href=result.Data;
				layer.close(id);
			}


		},
		async _getTypeList() {
			this.typeList = await getBasicList(32) || [];
		},
		async _getFactoryList() {
			this.factoryList = await getFactoryList() || [];
		},
		//上传配置
		_getUploadInfo() {
			let $this = this;
			this.uploadInfo = getUploadInfo({
				url: "/api/Material/UploadTempFile?FType=2&FFuncType=",
				accept: "file",
				acceptMime: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel",
				exts: "xlsx|xls",
				before: function (obj) {
					layer.msg('文件上传中...', {
						icon: 16,
						shade: 0.01,
						time: 0
					});
				},
				done: function (res) {
					let inResult = JSON.parse(res.data || {});
					setTimeout(() => {
						let inResult = JSON.parse(res.data || "{}");
						inResult = "导入成功，有" + (inResult.Data || "0") + "个物料信息被修改";
						layer.closeAll();
						layer.msg(inResult, {
							time: 1500,
							icon: 1
						});
						$this._getPageList(true);
					}, 300);
				},
				error: function (res) {
					layer.msg('网络异常，请稍后再试!', {
						icon: 2
					});
				}
			});
		},
		//获取物料集合
		async _getPageList(isFirst, showOk) {
			//this.dataList = [];
			this.pageInfo.total = 0;
			if (isFirst) {
				this.pageInfo.current = 1;
				this.pageInfo.total = 0;
			}
			this.postData.FPageIndex = this.pageInfo.current;
			this.postData.FPageSize = this.pageInfo.limit;
			let result = await getPageList(this.postData, "Material");
			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 ? "" : type.FName;
				type = this.typeList.find(s => s.FValue == item.FSuccedaneumType);
				item.FSuTypeName = type == null ? "" : type.FName;
				type = this.typeList.find(s => s.FValue == item.FFuProductsType);
				item.FFuTypeName = type == null ? "" : type.FName;
				item.FAddDate = item.FAddDate == null ? "" : this.dateFormat(item.FAddDate);
				item.FEditDate = item.FEditDate == null ? "" : this.dateFormat(item.FEditDate);
			});
			this.pageInfo.total = result.Data.Total || 0;
			this.dataList = result.Data.List;
		},
		//日期处理
		dateFormat(dataStr) {
			return dataStr.replace('T', ' ').split('.')[0];
		},

		//模板下载
		async _clickDown(type) {
			let result = await getTempFile(type);
			window.open(result);
		},
		//设置-副替
		_clickSetInfo(data, type) {
			this.objInfoObj = data;
			this.editType = type;
			if (type == 1) this.editBoxTitle = "替代品设置";
			else this.editBoxTitle = "副产物设置";
			if (type == 3) {
				this.showShowBox = true;
			} else {
				this.showEditBox = true;
			}
		},
		//检索-检索
		_clickSearch() {
			this.postData = {};
			for (let key in this.searchObj) {
				let val = this.searchObj[key];
				if (val != null && val != "") this.postData[key] = val;
			}
			this._getPageList(true);
		},
		//检索-重置
		_clickReset() {
			this.searchObj = {};
			this._clickSearch();
		},
		//对接-SAP
		async _clickSyncSap() {
			layer.closeAll();
			let idx = layer.load(2);
			try {
				let result = await dockSapMaterial() || 0;
				layer.msg("操作成功，本次有" + result + "个物料信息被修改", {
					time: 2000,
					icon: 1
				});
			} catch (e) { }
			layer.close(idx);
		},
		//对接-执行
		_dockSureNext(type) {
			if (type == 1) this._clickSyncSap();
		},
		//对接-确认
		_dockSureBox(type) {
			let $this = this;
			layer.confirm("同步需要一定时间，您确认需要同步吗？", {
				title: "提示",
				btn: [{
					text: '同步',
					callback: function (id) {
						layer.close(id);
						$this._dockSureNext(type);
					}
				},
				{
					text: '取消',
					callback: function (id) {
						layer.close(id);
					}
				}
				]
			});
		}
	}
}
</script>
