<!--
 * @Author: zwq
 * @Date: 2023-08-01 14:55:51
 * @LastEditors: zhp
 * @LastEditTime: 2023-12-04 13:38:45
 * @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" />
    <print-model-design v-if="modelShow" ref="printModelDesign" @saveData="getModelData" />
  </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 printModelDesign from '../custom/index'
import { updatePackingModel,} from '@/api/base/printModel.js';
import {
  deletePackingModel,
  getPackingModelPage,
	// exportPackingExcel,
} from '@/api/base/printModel';

const tableProps = [
  {
    prop: 'createTime',
    label: '创建时间',
    filter: parseTime
  },
	{
    prop: 'name',
    label: '模板名称'
	},
	{
    prop: 'typeName',
		label: '标签类型'
	},
	{
    prop: 'printModel',
    label: '打印方式',
    filter: (val) => val ==1 ? '自动打印' : '手动打印',
	},
	{
    prop: 'remark',
		label: '备注',
		// subcomponent: unitDict,
  },
];

export default {
	mixins: [basicPage],
	data() {
		return {
			urlOptions: {
        getDataListURL: getPackingModelPage,
        deleteURL: deletePackingModel,
				// exportURL: exportPackingExcel,
			},
      tableProps,
      modelShow:false,
      tableBtn: [
        {
          type: 'detail',
          btnName: '查看',
        },
        this.$auth.hasPermi(`base:packaging-print-model:update`)
					? {
							type: 'edit',
							btnName: '编辑',
					  }
          : undefined,
        this.$auth.hasPermi(`base:packaging-print-model:delete`)
					? {
							type: 'delete',
							btnName: '删除',
					  }
          : undefined,
			].filter((v) => v),
			tableData: [],
			formConfig: [
				// {
				// 	type: 'input',
        //   label: '工单',
        //   placeholder: '工单',
        //   param: 'workOrderId',
				// },
				// {
        //   // parent: 'dateFilterType',
        //   // 日期选择
        //   type: 'datePicker',
        //   label: '时间',
        //   dateType: 'date',
        //   placeholder: '选择日期',
        //   format: 'yyyy-MM-dd',
        //   valueFormat: 'yyyy-MM-dd',
        //   param: 'createTime',
				// },
				// {
				// 	type: 'button',
				// 	btnName: '搜索',
				// 	name: 'search',
				// 	color: 'primary',
				// },
				// {
				// 	type: 'separate',
				// },
				// {
				// 	type: 'button',
				// 	btnName: '重置',
				// 	name: 'reset',
				// },
				{
          type: 'label',
          label:'标签模板',
				},
				{
          type: this.$auth.hasPermi('base:packaging-print-model: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,
    printModelDesign
	},
	created() {},
  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;
      });
    },
		buttonClick(val) {
			switch (val.btnName) {
				case 'search':
					this.listQuery.pageNo = 1;
					this.listQuery.pageSize = 10;
          this.listQuery.packagingCode = val.packagingCode;
          this.listQuery.createTime = val.createTime;
					this.getDataList();
					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);
			}
    },
    getModelData(data) {
      // console.log(data)
      // this.content = JSON.stringify(data)
      // this.dataForm.content = JSON.stringify(data)
      console.log(data)
      // this.content = JSON.stringify(data)
      this.obj.content = JSON.stringify(data)
      updatePackingModel(this.obj).then((response) => {
        // this.$modal.msgSuccess('修改成功');
        // this.visible = false;
        // this.$emit('refreshDataList');
      });

    },
    otherMethods(val) {
      console.log(val)
      this.modelShow = true
      this.$nextTick(() => {
        this.obj = val.data
        this.$refs.printModelDesign.init(val.data.content)
      })
		},
	},
};
</script>
