hemall.terabimsoft.com.cn/plugins/material-center/views/material/SelectShop.blade.php

<template id="selectShop">
  <div >
  <el-dialog center title="选择商品" :visible.sync="selectMemberVisible"  width="50%" @close="close">
            <div style="display:flex;width: 95%;">
                <el-input placeholder="商品信息" v-model="search.keyword"></el-input>
                <el-button type="primary" style="margin-left:10px" @click="searchShop">搜索</el-button>
            </div>
            <el-table :data="tableData" style="width: 100%;height: 500px;overflow-y: auto;">
                <el-table-column align="center" prop="id" label="ID">
                </el-table-column>
                <el-table-column align="left" label="商品信息" width="700px">
                     <template slot-scope="scope">
                        <img :src="scope.row.thumb" alt="" style="width:50px;height:50px">
                        <span>[[scope.row.title]]</span>
                    </template>
                </el-table-column>
                <el-table-column align="center" label="操作">
                    <template slot-scope="scope">
                        <el-button plain @click="select(scope.row)">选择</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination layout="prev, pager, next" :total="total" :page-size="pageSize" :current-page="page" @current-change="getShopList">
            </el-pagination>
        </el-dialog>
  </div>
</template>
<link rel="stylesheet" type="text/css" href="{{static_url('yunshop/goods/vue-goods1.css')}}" />
<link rel="stylesheet" href="{{static_url('css/public-number.css')}}">
<script>
 Vue.component('selectShop',{
  template: '#selectShop',
  delimiters: ['[[', ']]'],
  props:{
    selectMemberVisible: {
      type: Boolean,
      default: false
    },
    selectCouponType: {
      type: String,
      default: ""
    }
  },
  components: {
  },
  data() {
    return {
      search:{
        keyword:""
      },
      tableData: [],
      oneShow:false,
      total:1,
      pageSize:15,
      page:1
    };
  },
  computed: {
    
  },
  created(){
  },
  mounted(){
  },
  methods: {
    select(item){
      this.$emit('select-good',item)
    },
    close(){
      this.$emit('close')
    },
    searchShop(){
      this.$http.post('{!! yzWebFullUrl("plugin.material-center.admin.material.getSearchGoods") !!}',{keyword:this.search.keyword,page:this.page,pageSize:this.pageSize}).then(({data}) =>{
          if(data.result) {
            this.$message.success(data.msg);
            this.tableData = data.data.goods.data
            this.page = data.data.goods.current_page
            this.total =data.data.goods.total
          }else {
            this.$message.error(data.msg);
          }
        }, (response) => {
          console.log(response);
        });
    },
    getShopList(page){
       this.page = page
     this.searchShop()
     },

  }
});
</script>

<style lang="scss" rel="stylesheet/scss" scoped>
/deep/.vue-page {
  margin-top: 20px;
}
</style>