|
|
@@ -1,199 +0,0 @@
|
|
|
-<template>
|
|
|
- <div>
|
|
|
- <el-dialog :title="exData.id ? '编辑': '新增'"
|
|
|
- :visible.sync="dialog"
|
|
|
- width="800px"
|
|
|
- :close-on-click-modal="false"
|
|
|
- top="50px">
|
|
|
- <el-form ref="form"
|
|
|
- :model="form"
|
|
|
- :rules="formRules"
|
|
|
- label-width="120px">
|
|
|
- <el-form-item prop="bar_name"
|
|
|
- :rules="formRules.required"
|
|
|
- label="门店名称：">
|
|
|
- <el-input v-model="form.bar_name"
|
|
|
- placeholder="请输入门店名称"
|
|
|
- clearable></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="bar_address"
|
|
|
- :rules="formRules.required"
|
|
|
- label="门店地址：">
|
|
|
- <el-input v-model="form.bar_address"
|
|
|
- placeholder="请输入门店地址"
|
|
|
- clearable></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="bar_img_url"
|
|
|
- :rules="formRules.uploadImgs"
|
|
|
- label="门店图片：">
|
|
|
- <el-upload :on-remove="handleRemove"
|
|
|
- :on-success="handleAvatarSuccess"
|
|
|
- :before-upload="beforeAvatarUpload"
|
|
|
- :accept="'image/*'"
|
|
|
- :file-list="fileList"
|
|
|
- list-type="picture-card"
|
|
|
- action="/api/admin/v1/upload/file"
|
|
|
- multiple>
|
|
|
- <i class="el-icon-plus"></i>
|
|
|
- <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过5M</div>
|
|
|
- </el-upload>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="bar_status"
|
|
|
- :rules="formRules.required"
|
|
|
- label="门店状态：">
|
|
|
- <el-radio v-model="form.bar_status"
|
|
|
- label="1">有效
|
|
|
- </el-radio>
|
|
|
- <el-radio v-model="form.bar_status"
|
|
|
- label="0">无效
|
|
|
- </el-radio>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="bar_song_start_time"
|
|
|
- :rules="formRules.required"
|
|
|
- label="点歌时间：">
|
|
|
- <el-time-select style="width: 45%;"
|
|
|
- placeholder="起始时间"
|
|
|
- v-model="form.bar_song_start_time"
|
|
|
- :picker-options="{start: '00:00', step: '00:05', end: '23:59'}">
|
|
|
- </el-time-select>
|
|
|
- <span style="display:inline-block;width: 10%; text-align: center">至</span>
|
|
|
- <el-time-select style="width: 45%;"
|
|
|
- placeholder="结束时间"
|
|
|
- v-model="form.bar_song_end_time"
|
|
|
- :picker-options="{start: '00:00', step: '00:05', end: '23:59', minTime: form.bar_song_start_time}">
|
|
|
- </el-time-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="bar_place_reserve_start_time"
|
|
|
- :rules="formRules.required"
|
|
|
- label="座位预定时间：">
|
|
|
- <el-time-select style="width: 45%;"
|
|
|
- placeholder="起始时间"
|
|
|
- v-model="form.bar_place_reserve_start_time"
|
|
|
- :picker-options="{start: '00:00', step: '00:05', end: '23:59'}">
|
|
|
- </el-time-select>
|
|
|
- <span style="display:inline-block;width: 10%; text-align: center">至</span>
|
|
|
- <el-time-select style="width: 45%;"
|
|
|
- placeholder="结束时间"
|
|
|
- v-model="form.bar_place_reserve_end_time"
|
|
|
- :picker-options="{start: '00:00', step: '00:05', end: '23:59', minTime: form.bar_place_reserve_start_time}">
|
|
|
- </el-time-select>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- <div slot="footer" class="dialog-footer text-center">
|
|
|
- <el-button @click="dialog = false">取 消</el-button>
|
|
|
- <el-button type="primary" :disabled="booLock" @click="handleSubmit">确 定</el-button>
|
|
|
- </div>
|
|
|
- </el-dialog>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-export default {
|
|
|
- components: {},
|
|
|
- props: {
|
|
|
- value: {
|
|
|
- type: Boolean,
|
|
|
- default: true
|
|
|
- },
|
|
|
- exData: {
|
|
|
- type: Object,
|
|
|
- default: function () {
|
|
|
- return {}
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- data () {
|
|
|
- return {
|
|
|
- dialog: !!this.value,
|
|
|
- form: {
|
|
|
- bar_name: '', // 门店名称
|
|
|
- bar_address: '', // 门店地址
|
|
|
- bar_status: '1', // 门店状态(0无效1有效)
|
|
|
- bar_img_url: [], // 门店图片
|
|
|
- bar_song_start_time: '', // 点歌开始时间
|
|
|
- bar_song_end_time: '', // 点歌结束时间
|
|
|
- bar_place_reserve_start_time: '', // 座位预定开始时间
|
|
|
- bar_place_reserve_end_time: '' // 座位预定结束时间
|
|
|
- },
|
|
|
- fileList: [],
|
|
|
- booLock: false
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- beforeAvatarUpload (file) {
|
|
|
- const isLt2M = file.size / 1024 / 1024 < 5
|
|
|
- if (!isLt2M) {
|
|
|
- this.$message.error('上传图片大小不能超过 5MB!')
|
|
|
- }
|
|
|
- return isLt2M
|
|
|
- },
|
|
|
- handleRemove (file) {
|
|
|
- let path = file.url
|
|
|
- if (file.response && file.response.data) {
|
|
|
- path = file.response.data.path
|
|
|
- }
|
|
|
- this.form.bar_img_url = this.form.bar_img_url.filter(item => item !== path.replace(/^\/\//, ''))
|
|
|
- },
|
|
|
- handleAvatarSuccess (res) {
|
|
|
- if (res.code === 200) {
|
|
|
- const { path } = res.data
|
|
|
- this.form.bar_img_url.push(path)
|
|
|
- } else {
|
|
|
- this.$message.error('图片上传失败')
|
|
|
- }
|
|
|
- },
|
|
|
- handleSubmit () {
|
|
|
- const url = this.exData.id ? '/v1/bar/modify' : '/v1/bar/add'
|
|
|
- this.$refs.form.validate(async valid => {
|
|
|
- if (valid) {
|
|
|
- this.booLock = true
|
|
|
- const data = await this.$fetch(url, {
|
|
|
- ...this.form
|
|
|
- })
|
|
|
- this.booLock = false
|
|
|
- if (data.code === 200) {
|
|
|
- this.$message.success('提交成功')
|
|
|
- this.$emit('success')
|
|
|
- this.$store.dispatch('common/fetchOutletList')
|
|
|
- this.dialog = false
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- },
|
|
|
- mounted () {
|
|
|
- if (this.exData.id) {
|
|
|
- this.$set(this.form, 'id', this.exData.id)
|
|
|
- this.fileList = this.exData.bar_img_url.map(item => {
|
|
|
- return {
|
|
|
- name: '',
|
|
|
- url: item
|
|
|
- }
|
|
|
- })
|
|
|
- for (const key in this.exData) {
|
|
|
- if (this.form.hasOwnProperty(key)) {
|
|
|
- let value = this.exData[key]
|
|
|
- if ((Array.isArray(value) && value.length >= 1) || (Object.prototype.toString.call(value) === '[object Object]') || (typeof value === 'string' && value) || typeof value === 'number') {
|
|
|
- if (key === 'bar_status') {
|
|
|
- value = value.toString()
|
|
|
- }
|
|
|
- this.$set(this.form, key, value)
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- watch: {
|
|
|
- dialog (val) {
|
|
|
- if (!val) this.$emit('input', val)
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss" scoped>
|
|
|
-.top-tip {
|
|
|
- margin-top: -20px;
|
|
|
- margin-bottom: 20px;
|
|
|
-}
|
|
|
-</style>
|
panyong