<template>
  <div>
    名称<input type="text" v-model="shangpin.mingcheng" /> 
    价格<input type="text" v-model="shangpin.jiage" />
    分类<input type="text" v-model="shangpin.fenlei" /> 
    卖点<input type="text" v-model="shangpin.maidian" />
    <input type="button" value="提交" @click="tijiao" />

    <br><button @click="chaxun">查询</button>
    <el-table :data="tableData" style="width: 100%">
      <el-table-column prop="mingcheng" label="名称" width="180"> </el-table-column>
      <el-table-column prop="jiage" label="价格" width="180"> </el-table-column>
      <el-table-column prop="fenlei" label="分类" width="180"> </el-table-column>
      <el-table-column prop="maidian" label="卖点" width="180"> </el-table-column>
    </el-table>
    
    账号<input type="text" v-model="denglu.user">
    密码<input type="text" v-model="denglu.pwd">
    <button @click="login">登录</button><br>
    <button @click="cxsp">查询全部商品</button>
    <el-table :data="sp" style="width: 100%">
      <el-table-column prop="name" label="名称" width="180"> </el-table-column>
      <el-table-column prop="number" label="库存" width="180"> </el-table-column>
      <el-table-column prop="weight" label="重量" width="180"> </el-table-column>
    </el-table>
  </div>
</template>


<script>
export default {
  name: "AaaCom",
  data() {
    return {
      shangpin: {
        mingcheng: "",
        jiage: "",
        fenlei: "",
        maidian: "",
      },
      denglu: {
        user:'',
        pwd:''
      },
      tableData:[],
      sp:[]
    };
  },
  methods: {
    tijiao() {
      this.axios({
        url: "/addshop",
        data: this.shangpin,
        method: "POST",
      }).then((res) => {
        console.log(res);
      });
    },
    chaxun() {
      this.axios({
        url: "/findshop",
        method: "GET",
      }).then((res) => {
        console.log(res);
        this.tableData = res.data.data
      });
    },
    login() {
        console.log(this.denglu)
      this.axios({
        url: "https://tomcat.theluyuan.com/vegetables//user/login",
        method: "POST",
        data:{
            phone: this.denglu.user,
            password: this.denglu.pwd
        }
      }).then((res) => {
        console.log(res.data);
        // this.token = res.data.data.token;
        localStorage.setItem("token",res.data.data.token)
      });
    },
    cxsp() {
      this.axios({
        url: "https://tomcat.theluyuan.com/vegetables/product/selectall",
        method: "POST",
        headers: {
            // token: this.token
            token: localStorage.getItem("token")
        }
      }).then((res) => {
        console.log(res);
        this.sp = res.data.data
      });
    },
  },
};
</script>