jf-frock/src/views/leadMatch/weightMemo/list.vue

<template>
  <div>
    <Toptitle title="码单列表">
      <slot name="titleButton"> </slot>
    </Toptitle>
    <div class="weight_memo_content">
      <div>
        <Topsearch :list="list" @init="initData" @searchData="initData" />
      </div>
      <div
        style="
          text-align: right;
          margin: 10px;
          border-top: 1px solid #f4f4f4;
          padding-top: 10px;
        "
      >
        <Button type="primary" size="small" style="margin-right: 10px" @click="gotoPage(3)"
          >新增</Button
        >
      </div>
      <Table :columns="tableColumns" border :data="tableData">
        <template slot="make_data" slot-scope="{row}">
          <span>{{func.replaceDate(row.crt_time)}}</span>
        </template>
     </Table>
    </div>
      <div class="content_body_page">
          <Page :page-size-opts="[10, 20, 30, 40,100]"
                @on-page-size-change='changeSize'
                @on-change='changePage'
                :current='pageIndex'
                show-total
                show-elevator
                :total="total"
                show-sizer
                :page-size='pageSize' />
        </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      list: [
        {
          title: "项目编号",
          name: "Input",
          value: "",
          placeholder: "请输入项目编号",
          serverName: "project_number",
        },
        {
          title: "项目名称",
          name: "Input",
          value: "",
          placeholder: "请输入项目名称",
          serverName: "project_name",
        },
        {
          title: "项目简称",
          name: "Input",
          value: "",
          placeholder: "请输入项目简称",
          serverName: "abbreviation",
        },
        // {
        //   title: "匹配状态",
        //   name: "Select",
        //   value: "",
        //   placeholder: "请选择",
        //   serverName: "state",
        //   option: [
        //     { label: "匹配完成", value: 2 },
        //     { label: "未匹配", value: 0 },
        //      { label: "匹配中", value: 1 },
        //   ] 
        // },
      ],
      tableColumns: [
        { title: "项目编码", key: "project_number", align: "center" , resizable: true,
                        width: 350},
        { title: "项目名称", key: "project_name", align: "center",  resizable: true,
                        width: 350 },
        { title: "项目简称", key: "abbreviation", align: "center", resizable: true,
                        width: 350},
        // { title: "匹配状态", key: "state", align: "center", minWidth: 140,
        // render:(h,params)=>{
        //   return h('span',{},params.row.state===0?'未匹配':params.row.state===2?'匹配完成':'匹配中')
        // }},
        { title: "制单日期", key: "make_data", align: "center",  resizable: true,
                        width: 350,slot:"make_data"},
        { title: "操作", key:'',align: "center", minWidth:150,
         render: (h, params) => {
                            return h('div', [
                                h('a', { style: {
                                        marginRight: '5px'
                                    }, on: {
                                        click: () => {
                                            this.gotoPage(1,params.row)
                                        }
                                    }
                                    }, '编辑'),
                                h('a', { style: {
                                        marginRight: '5px'
                                    }, on: {
                                        click: () => {
                                            this.gotoPage(2,params.row)
                                        }
                                    }
                                    }, '查看'),
                                h('a',{ style: {
                                        marginRight: '5px'
                                    }, on: {
                                        click: () => {
                                            this.del(params.row)
                                        }
                                    }},'删除')
                            ]);
                        }},
      ],
      tableData: [],
      pageIndex: 1,
      pageSize: 10,
      total: 0,
    };
  },
  methods: {
    initData(row) {
      this.axios.get('/api/cut_order_list',{params:{
        page_index:this.pageIndex,page_size:this.pageSize,
        order_type:1,
        ...row}}).then(res=>{
        this.tableData = res.data.data;
        this.total = res.data.total
      })
    },
    del(row){
      this.confirmDelete({
                content:'是否删除？',
                title:'码单删除',
                type:'primary',
                then:()=>{
                       this.axios.post('/api/cut_order_delete',{cut_order_id:row.id,order_type:1}).then(()=>{
            this.initData()
          })
                },
                cancel:()=>{}
            })
       
    },
    gotoPage(type,row){
      //1 编辑 2 查看 3 新增
      switch(type){
        case 1:
          case 2:this.$router.push({ path: '/cms/leadMatch/weightMemo/edit', query: { type:type,cut_order_id:row.id} });
          break
          case 3:this.$router.push({ path: '/cms/leadMatch/weightMemo/edit', query: { type:type} });
          break
      }
    },
    changeSize (e) {
      this.pageSize = e;
      this.initData()
    },
     changePage (e) {
      this.pageIndex = e;
      this.initData()
    },
  },
};
</script>
<style scoped lang='scss'>
.weight_memo_content{
    height: 650px;
    overflow: auto;
}
.content_body_page{
    margin-top: 10px;
    text-align: center;
}
</style>