<!--
 * @Author: zwq
 * @Date: 2023-08-01 14:55:51
 * @LastEditors: zhp
 * @LastEditTime: 2024-02-28 10:38:34
 * @Description:
-->
<template>
	<div class="app-container">
		<search-bar
			:formConfigs="formConfig"
			ref="searchBarForm"
			@headBtnClick="buttonClick" />
		<base-table
			:table-props="tableProps"
			:page="listQuery.pageNo"
			:limit="listQuery.pageSize"
			:table-data="tableData">
			<method-btn
				v-if="tableBtn.length"
				slot="handleBtn"
				:width="120"
				label="操作"
				:method-list="tableBtn"
				@clickBtn="handleClick" />
		</base-table>
		<pagination
			:limit.sync="listQuery.pageSize"
			:page.sync="listQuery.pageNo"
			:total="listQuery.total"
			@pagination="getDataList" />
		<add-or-update
			v-if="addOrUpdateVisible"
			ref="addOrUpdate"
			@refreshDataList="getDataList" />
	</div>
</template>

<script>
import AddOrUpdate from './add-or-updata';
// import unitDict from './unitDict';
import basicPage from '../mixins/basic-page';
import { parseTime } from '../mixins/code-filter';
import {
  getPackingModel,
} from '@/api/base/printModel.js'
import {
	deletePacking,
  getPackingPage,
  getWorkOrderList,
	exportPackingExcel,
} from '@/api/base/packingInfo';

const tableProps = [
	{
    prop: 'packagingCode',
    label: '包装流水号'
  },
  {
    prop: 'packagingBarCode',
    label: '包装条码'
  },
	{
    prop: 'workOrderName',
		label: '所属工单'
	},
	{
    prop: 'customerName',
		label: '客户'
	},
	{
    prop: 'content',
		label: '内容',
		// subcomponent: unitDict,
  },
  {
    prop: 'modelName',
    label: '标签模板',
    // subcomponent: unitDict,
  },
  {
    prop: 'printStatus',
    label: '打印状态',
    filter: (val) => val == 1 ? '未打印' : '已打印',
  },
	{
    prop: 'createTime',
		label: '生成日期',
		filter: parseTime
	},
];

export default {
	mixins: [basicPage],
	data() {
		return {
			urlOptions: {
        getDataListURL: getPackingPage,
				deleteURL: deletePacking,
				exportURL: exportPackingExcel,
			},
			tableProps,
      tableBtn: [
        {
          type: 'print',
          btnName: '打印',
        },
        this.$auth.hasPermi(`base:packaging-print-log:update`)
					? {
							type: 'edit',
							btnName: '编辑',
					  }
          : undefined,
        this.$auth.hasPermi(`base:packaging-print-log:delete`)
					? {
							type: 'delete',
							btnName: '删除',
					  }
          : undefined,
			].filter((v) => v),
			tableData: [],
      formConfig: [
        {
          type: 'select',
          label: '工单',
          selectOptions: [],
          labelField: 'name',
          valueField: 'id',
          param: 'workOrderId',
          filterable: true,
        },
        {
          // parent: 'dateFilterType',
          // 时间段选择
          type: 'datePicker',
          // label: '时间段',
          dateType: 'daterange',
          format: 'yyyy-MM-dd HH:mm:ss',
          valueFormat: 'yyyy-MM-dd HH:mm:ss',
          defaultTime: ['00:00:00', '00:00:00'],
          rangeSeparator: '-',
          startPlaceholder: '开始时间',
          endPlaceholder: '结束时间',
          param: 'createTime',
        },
				{
					type: 'button',
					btnName: '搜索',
					name: 'search',
					color: 'primary',
				},
				// {
				// 	type: 'separate',
				// },
				// {
				// 	type: 'button',
				// 	btnName: '重置',
				// 	name: 'reset',
				// },
				{
					type: 'separate',
				},
				{
          type: this.$auth.hasPermi('base:packaging-print-log:create') ? 'button' : '',
					btnName: '新增',
					name: 'add',
					color: 'success',
					plain: true,
				},
				// {
				// 	type: 'separate',
				// 	type: this.$auth.hasPermi('base:product:create') ? 'separate' : '',
				// },
				// {
				// 	type: this.$auth.hasPermi('base:product:export') ? 'button' : '',
				// 	btnName: '导出',
				// 	name: 'export',
				// 	color: 'warning',
				// },
			],
		};
	},
	components: {
		AddOrUpdate,
	},
  created() {
    this.getDict()
  },
  methods: {
    getDataList() {
      this.dataListLoading = true;
      this.urlOptions.getDataListURL(this.listQuery).then(response => {
        this.tableData = response.data.records;
        this.listQuery.total = response.data.total;
        this.dataListLoading = false;
      });
    },
    getDict() {
      // 获取产品的属性列表
      // getCustomerList().then((response) => {
      //   console.log(response);
      //   this.customerList = response.data
      //   // this.listQuery.total = response.data.total;
      // })
      // getModelList().then((response) => {
      //   console.log(response);
      //   this.modelList = response.data
      //   // this.listQuery.total = response.data.total;
      // })
      getWorkOrderList().then((response) => {
        // console.log(response);
        this.formConfig[0].selectOptions = response.data.map((item) => {
          return {
            name: item.name,
            id: item.id
          }
        })
        console.log(this.formConfig[0].selectOptions);
        // this.listQuery.total = response.data.total;
      })
    },
    deleteHandle(id, name, index, packagingCode) {
      this.$confirm(`是否确认删除${'[' + packagingCode + ']'}数据项?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.urlOptions.deleteURL(id).then(({ data }) => {
            this.$message({
              message: "操作成功",
              type: "success",
              duration: 1500,
              onClose: () => {
                this.getDataList();
              },
            });
          });
        })
        .catch(() => { });
    },
    handlePrint(id) {
      if (id) {
        getPackingModel(id).then(res => {
          var obj = {
            code: '11111222',
            test: '11111',
            test2: '3333333',
            test1: '222222',
          }
          console.log(res);
          // getPackingListInfo({
          //   size: 20,
          //   current: 1,
          //   boxNo: printModel.boxNo
          // }).then(result => {
          //   this.substrateList = result.data.records
          //   var obj = {
          //     // time: this.getNewDate(),
          //     boxNo: this.currentData.boxNo,
          //     orderNum: this.currentData.orderNum,
          //     powerLevel: this.currentData.powerLevel,
          //     sapMaterial: this.currentData.sapMaterial,
          //     img: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAHVklEQVR4nO2dT2wUVRzHv2/2T5eSAlvFilwgQUH+eLACaUxEiJLAxdh44MDZi2ChUIrSFtoCgbbSP4GDdwgeEA8kRTAI0iIGBL1ITLxgLAlCsCKBYndnx7zd35pl2+7On/de387OJ9l00515/z7z/szMmzfs7869mD0yCjw2gZAB4VhAiln4/dUaRGdU18aOnzw9dn24ioGJj0soFsJr1z2yNm+qN2/fvRFL8XyMYqTmFfxZ+TwMc1xKDsL/f2Ms8xGeLwuIRpCKx99MHf/i4uPrw5GQ9jIAfsCMXfw2HkuOX03Wb1qLh4+uIGFJjzecPoS5iEhUTg1hDMaM2GuRk6cGMTQUCYmPQQq86CMAkkPDkQirGAzXf7Du34ejN9IHmETCRjQGPL6D+4NnYDEJDQmXbaY6on/dm2Vm/jHdZe0Almm6Ll+YNQbzasX7765BNHI1o0sOYRghwExg7MG9dDQSiqsdwHuZmlFKMjLwQ3QcFtjlSxHTenLO3Lp7vfU09AOS41Ka+HC6CjIDIaqmguvIPgBtIgOcDhjVlMTQtarKOScumR/teCdpxoeNZGJCapjFt7Rcywrb2MYtnQBatCpZTzCkYCF+5suKRXf+6EvOmv0GSzwrhB/QpmGkBYZSpqvIZAlp8ZeMLFwKUH3z2gqWyd/+3F/5b1yRQQMCN8gQspeaKt+SAItSCxCiPjIjhDEkjRAMxmCZSbgZkYke537qdxl57KM8C0OkkD0ADohMXIlwgPIuBFFC9uS3p2XGflFSRAgpdxlZeBl84jUQr0ImjDTKGWZZBwE0eCkCL0J20UgjgGCwEDHNPjB86PbiilshfGRxOBCRD0tLCSWTnzMLO9yE4EbIzjIdTdmGpc8/rB4qK0c4FcKbqe7pyWZJ0k1lZhsnQnZq3EzV00dHDjupKXaFNGtcM7YA+Io+WzRIz2R0UxkWxY6QJgCHlCbfPlzAsZytj2ks5RCVZUGKCdkOoEt+Wl3RkCcjyzGv5wIS6aIynZJCQni7d0TTjPFaMFDg9wGNa8qRQn3KVEI+1rjPmKpm5KNzTemmMp7AZEK2AehXmz7bbC1SM/IZoH10pJ/K+hnyhXBrvZpmoBHAURf7HaV9daQ3v6Zk7hhWVr4AYDOAzzRNeKPHAyW7r459Yj/deUynMcyqqpY9/fXW+RTwkiF/ms5pADcd7nMbwAkBcfMM3wOwwOF+rys46TxCt+T72d2NG0YSg2fnC58ANDkbAZyVH41QNgAYVBTXNiMxeLYG6qawvagmGqGoTHOfwcAe6T8TvWwYlTC7OsALgRDNCIRoRiBEMwIhmhEI0YxAiGYEQjRDtZCY9iUyEaVpVi3kvuL4RKA0zSqF8Ad5TimMTxSnKO1KUCWEZ6hDVaYk0KFKigohbSUuI0uHiieKZQtp89kM+U7ZUmQKafHp4wpSH/eWJaTT5zPkD8g62GQI8cXqDTZok/HEsWgh+3Of2y4D2kU/0idKyEOaJdgqKLxSotXlfLFJESXkicKZGTrys6g0iRIyD8AvAFYLCq+UWC1yACOyD+Hrf1wAUCcwTN2pozzXiEqn6E59JoBvANQKDldHaimvM0WmTcawlydw2Oc1pY7yKFQGJJ4YxqiTXyEp/OlkBeVNyn0SmZdO5gC47rOOfjXlaY6sCGRfXKwA8LVP+pRaykuFzEhUXH7nR9P3AFYqiEsWKykP0mpGFlU3qKI0IlmlKD6RrKK0R1VEpvIW7uwSHXnVUdqVoHqSwz+K4xOB0jQH87I0IxCiGYEQzQiEaEYgRDMCIZoRCNGMQIhmBEI0gwuJK0xScKZemHiY1mzqUxThYgBLHO7zQOAzGnMBPOdwn8WC4rbDNjaSWVajQaEUp9wBsB7ALY/hLAVwHsB89VmwRXrhuGwf0q/xIl/z6f6105qVyxIKQ1cZjdlV/HI79V6N1yjk/dxlAMtc7LuM9lXZVzqhIXdxtvxR1kCxZUynkbl0o2ihgyQspH3mapqn7flrSE427O3TuKbwGZI/AlhuY9vltO08Belyw6T99lTnIQN2VmGeJqppskGhpfoW0DbVmuahaarVVQudGPZo3tH/RCOnfJbSbzp34D1T/VjsTL3X6esWFMJngJwDsCgnykX0P+mzQ1yyq9jqqtnzkGI0a7wgPz9pfJm+/6ZxB77bzus+7L7pkwdkarr8OBdwJee7jjQVaqZysVtDsuwK3j3lmGYnb5hwerW3S+PRl440OX3dh5vL7z0iXzXqY/bYbaZycXs/5KDdV/iUKc1URo7xcoOqq0yfui1Gq5e3EoUava1qzS/aJQGs8xKIj2jx+gCoVyGcoUBKGs8yIEgIAiliZEDwJAehL3ovIYS+2F9UDckyRH/fFhmoxuwTvdaJaCGc7+gyi9+br1YZSzTJEAIaffHrZG/JCFwDpK16JEsI5yK9uMdvzVe7zAUxZQrhXKKBwxqZkSikQ8aiZbnIFgKS4oea0i5bBhQJgQ+kKJEBhUJAUkqxo+cduJqVrQH8B6xBgBhvJFNDAAAAAElFTkSuQmCC',
          //     // lineBody: this.currentData.lineBody == 1 ? 'F ' : 'S',
          //     createTime: moment(this.currentData.createTime).format('YYYY-MM-DD HH:mm:ss')
          //     // modul1: '20210320000012',
          //     // modul2: '20210320000012',
          //     // modul3: '20210320000012'
          //   }
          //   for (var i = 0; i < this.substrateList.length; i++) {
          //     var model = 'model' + Number(i + 1)
          //     var pmpp = 'PMPP' + Number(i + 1)
          //     var m = 'm' + Number(i + 1)

          //     console.log(model)
          //     // console.log(this.list[i].woSubstrateId)
          //     // console.log(this.list[i].woSubstrateId)
          //     obj['' + model + ''] = this.substrateList[i].woSubstrateId
          //     obj['' + pmpp + ''] = this.substrateList[i].pmpp
          //     obj['' + m + ''] = i + 1
          //   }
          //   console.log(obj)
          // this.printPreview('预览', res.data)
          const hiprintTemplate = this.$print(undefined, JSON.parse(res.data.content), obj, {}, {
            // styleHandler: () => {
            //   const css = '<link href="http://hiprint.io/Content/hiprint/css/print-lock.css" media="print" rel="stylesheet">'
            //   return css
            // }
          })

          hiprintTemplate.on('printSuccess', function () {
            console.log(1111);
            // that.$notification.success({
            //   // key: key,
            //   placement: 'topRight',
            //   message: key + ' 打印成功',
            //   description: 'Api单独直接打印回调',
            // });
          });
          console.log(hiprintTemplate)
        })
      } else {
        this.$message({
          message: '请选择打印标签模板',
          type: 'warning'
        });
      }
    },
    closeCallback(vue) {
      console.log('关闭了打印工具')
    },
		buttonClick(val) {
			switch (val.btnName) {
				case 'search':
					this.listQuery.pageNo = 1;
					this.listQuery.pageSize = 10;
          this.listQuery.workOrderId = val.workOrderId;
          if (val.createTime && val.createTime.length != 0) {
            this.listQuery.createTime = val.createTime
            // this.listQuery.createTime[1] = val.timeVal[1]
          } else {
            this.listQuery.createTime = undefined
            // this.listQuery.endTime = undefined
          }
          this.getDataList();
          console.log(this.tableData)
					break;
				case 'reset':
					this.$refs.searchBarForm.resetForm();
					this.listQuery = {
						pageSize: 10,
						pageNo: 1,
						total: 1,
					};
					this.getDataList();
					break;
				case 'add':
					this.addOrEditTitle = '新增';
					this.addOrUpdateVisible = true;
					this.addOrUpdateHandle();
					break;
				case 'export':
					this.handleExport();
					break;
				default:
					console.log(val);
			}
		},
    otherMethods(val) {
      this.handlePrint(val.data.modelId)
			// this.addOrUpdateVisible = true;
			// this.addOrEditTitle = '详情';
			// this.$nextTick(() => {
			// 	this.$refs.addOrUpdate.init(val.data.id, true);
			// });
		},
	},
};
</script>
