tjshop/shop/static/manager/src.b/components/page/BindPackage.vue

<template>
    <div>
        <el-row>
            <el-col :span="3">
                <el-input v-model="search" placeholder="请输入套餐名称"></el-input>
            </el-col>
            <el-col :span="1">
                &nbsp;
            </el-col>
            <el-col :span="1">
                <el-button type="primary" @click="getItems">查询</el-button>
            </el-col>
            <el-col :span="1">
                &nbsp;
            </el-col>
            <el-col :span="1">
                <el-button type="primary" @click="save">绑定</el-button>
            </el-col>
            <el-col :span="1">
                &nbsp;
            </el-col>
            <el-col :span="1">
                <el-button @click="goBack">取消</el-button>
            </el-col>
        </el-row>
        <el-table :data="items">
            <el-table-column label="选择" width="80px">
                <template slot-scope="scope">
                    <el-radio v-model="package" :label="scope.row">&nbsp;</el-radio>
                </template>
            </el-table-column>
            <el-table-column label="套餐名称" prop="package_name"></el-table-column>
            <el-table-column label="套餐描述" prop="describe"></el-table-column>
            <el-table-column label="套餐价格" prop="price"></el-table-column>
            <el-table-column label="项目总价" prop="total"></el-table-column>
            <el-table-column label="套餐备注" prop="remarks"></el-table-column>
        </el-table>
    </div>
</template>
<script>
export default {
  data() {
    return {
      search: '',
      gid: 0,
      items: [],
      package: 0
    }
  },
  methods: {
    getItems: function() {
      var param = {
        search: this.search
      }
      this.$http.getPackages(param, this).then(res => {
        if (res.code === 0) {
          this.items = res.obj
        }
      })
    },
    goBack: function() {
      this.$router.back()
    },
    save: function() {
      if (this.package === 0) {
        this.$message({
          message: '请选择套餐',
          type: 'warning'
        })
        return
      }
      var param = {
        gid: this.gid,
        packageid: this.package.id,
        packagename: this.package.package_name
      }
      var that = this
      this.$http.bindPackage(param, this).then(res => {
        if (res.code === 0) {
          this.$message({
            message: '操作成功',
            type: 'success',
            duration: 1000,
            onClose: function() {
              that.goBack()
            }
          })
        }
      })
    }
  },
  mounted: function() {
    var gid = this.$route.query.gid
    this.gid = gid
    this.getItems()
  }
}
</script>