zouyu
2023-11-17 d8ac6057eaad648687699e25a575f3b7b8c1b102
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<template>
  <el-dialog
    :title="!dataForm.id ? '新增' : '修改'"
    width="500px"
    :visible.sync="visible"
  >
    <el-form
      :model="dataForm"
      :rules="dataRule"
      ref="dataForm"
      label-width="100px"
      class="l-mes"
    >
      <el-form-item
        v-if="dataForm.id"
        label="标签身份码"
        prop="labelUniqueCode"
      >
        <el-input v-model="dataForm.labelUniqueCode" disabled />
      </el-form-item>
      <el-form-item label="标签类别描述" prop="labelTypeDesc">
        <el-select
          v-model="dataForm.labelTypeDesc"
          filterable
          clearable
          style="width: 100%"
        >
          <el-option
            v-for="item in labelTypeOptions"
            :key="item.id"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="标签描述" prop="labelDesc">
        <el-input v-model="dataForm.labelDesc" />
      </el-form-item>
      <el-form-item label="标签尺寸" prop="labelSize">
        <el-input v-model="dataForm.labelSize" />
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button
        type="primary"
        :disabled="isSubmit"
        v-thinclick="`dataFormSubmit`"
      >
        确定
      </el-button>
    </span>
  </el-dialog>
</template>
<script>
import { getObj, addObj, putObj } from '@/api/print/config'
import { remote } from '@/api/admin/dict'
const dataFormDefault = () => {
  return {
    id: null,
    labelUniqueCode: null,
    labelTypeDesc: null,
    labelDesc: null,
    labelSize: null
  }
}
export default {
  data() {
    return {
      visible: false,
      dataForm: dataFormDefault(),
      dataRule: {
        labelTypeDesc: [
          { required: true, message: '标签类别描述', trigger: 'blur' }
        ],
        labelDesc: [{ required: true, message: '标签描述', trigger: 'blur' }]
      },
      isSubmit: false,
      labelTypeOptions: []
    }
  },
  created() {
    remote('label_type').then((response) => {
      if (response.data.code === 0) {
        this.labelTypeOptions = response.data.data
      }
    })
  },
  methods: {
    init(id) {
      this.dataForm.id = id || 0
      this.visible = true
      this.$nextTick(() => {
        this.$refs.dataForm.resetFields()
        if (this.dataForm.id) {
          getObj(this.dataForm.id).then((response) => {
            this.dataForm = response.data.data
          })
        }
      })
    },
    // 表单提交
    dataFormSubmit() {
      this.isSubmit = true
      this.$refs.dataForm.validate((valid) => {
        if (valid) {
          if (this.dataForm.id) {
            putObj(this.dataForm).then((data) => {
              this.$message.success('修改成功')
              this.visible = false
              this.isSubmit = false
              this.$emit('refreshDataList')
            })
          } else {
            addObj(this.dataForm).then((data) => {
              this.$message.success('添加成功')
              this.visible = false
              this.isSubmit = false
              this.$emit('refreshDataList')
            })
          }
        } else {
          this.isSubmit = false
        }
      })
    }
  }
}
</script>