【vue】写新页面必备的内容模板

<template>
    <div class="app-container">

        <el-dialog
        :visible.sync="xxxx"
        title="xxxx"
        width="25%">
        <el-form ref="xxx" label-width="100px">

          <el-form-item label="xxx：">

          </el-form-item>

        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="('')">确 认</el-button>
        </span>
      </el-dialog>

  </div>
</template>


<script>
import XEUtils from 'xe-utils'

export default {
    data() {
        return {

        }
    },
created() {
    this.userName = localStorage.getItem('name').replace('"', '').replace('"', '')
    this.userId = localStorage.getItem('name').replace('"', '').replace('"', '')
  },
methods: {
handleClose(done) {
      this.$refs["form"].resetFields();
      this.$confirm('确认关闭？')
        .then((_) => {
          done()
        })
        .catch((_) => {})
        },
    success(message) {
      
        this.$message({
          message: message,
          type: 'success'
        })
      },
      fail(message) {
        this.$message.error(message)
        },
        formatterDate(row, column, cellValue, index) {
        return XEUtils.toDateString(cellValue, 'yyyy-MM-dd HH:mm:ss')
      }
}

</script>

<style>
  .manual-table2-oper {
    margin-bottom: 18px;
    margin-left: 5%;
  }
  .manual-table2-pagination {
    margin-top: 18px;
    text-align: right;
    margin-right: 45%;
  }
  .manual-table2.editable .editable-row.new-insert,
  .manual-table2.editable .editable-row.new-insert:hover>td {
    background-color: #f0f9eb;
  }
</style>