<template>
  <div class="app-container" ref="main">
    <div ref="search">
      <el-button
        style="margin-bottom: 15px"
        type="primary"
        size="small"
        @click="handleAdd"
        >新增</el-button
      >
    </div>

    <el-table v-loading="loading" :data="tableData">
      <el-table-column label="用户名称" align="center" prop="certificateId" />
      <el-table-column label="手机号码" align="center" prop="uid" />
      <el-table-column label="用户邮箱" align="center" prop="uid" />
      <el-table-column label="收货地址" align="center" prop="uid" />
      <el-table-column
        label="操作"
        align="center"
        class-name="small-padding fixed-width"
      >
        <template slot-scope="scope">
          <el-button size="mini" type="text" @click="handleFabu(scope.row)"
            >编辑</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <!-- 发布对话框 -->
    <el-dialog :visible.sync="open" width="500px" append-to-body>
      <div slot="title" class="dialog-title">
        <span class="title-line"></span>
        {{ title }}
      </div>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="用户名称" prop="name">
          <el-input v-model="form.name" placeholder="请输入用户名称" />
        </el-form-item>
        <el-form-item label="手机号码" prop="serviceDuration">
          <el-input
            v-model="form.serviceDuration"
            placeholder="请输入手机号码"
          />
        </el-form-item>
        <el-form-item label="用户邮箱" prop="cover">
          <el-input v-model="form.name" placeholder="请输入用户邮箱" />
        </el-form-item>
        <el-form-item label="收货地址" prop="cover">
          <el-input
            v-model="form.name"
            type="textarea"
            placeholder="请输入收货地址"
          />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="handleSub">提 交</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      total: 0,
      queryParams: {},
      loading: false,
      tableData: [{}],
      tableHeigth: 0,

      form: {},
      rules: {},
      open: false,
      title: "",
    };
  },
  created() {},
  methods: {
    handleAdd() {
      this.title = "新增";
      this.open = true;
    },
    getList() {},
    handleFabu() {
      this.title = "编辑";
      this.open = true;
    },
    handleSub() {},
  },
};
</script>
<style lang="scss" scoped>
@import "@/assets/styles/myTable.scss";

// ::v-deep .search-container {
//   .el-form-item__content {
//     width: 550px;
//   }
//   .el-input-group__append {
//     padding-left: 15px !important;
//     padding-right: 15px !important;
//     background: #f8414d !important;
//     border-color: #f8414d !important;
//     .search-btn {
//       color: #fff !important;
//     }
//   }
// }
</style>
