gaoluyang
4 天以前 d13487486a3c3c7cf93bd3bda65dcc0d6af51aa2
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
130
131
132
133
<template>
  <div>
    <el-dialog :title="operationType === 'add' ? '新增出库' : '编辑出库'"
               v-model="dialogVisitable" width="800px" @close="cancel">
      <el-form :model="form" :rules="rules" ref="userRef" label-width="100px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="销售日期" prop="userName">
              <el-date-picker
                  v-model="form.userName"
                  type="date"
                  value-format="YYYY-MM-DD"
                  format="YYYY-MM-DD"
                  clearable
                  style="width: 100%"
                  placeholder="请选择日期"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="客户" prop="nickName">
              <el-select v-model="form.nickName" placeholder="请选择客户">
                <el-option
                    v-for="item in customerOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="煤种" prop="type">
              <el-select v-model="form.nickName" placeholder="请选择煤种">
                <el-option
                    v-for="item in typeOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="单位" prop="nickName">
              <el-input v-model="form.nickName" placeholder="请输入单位" maxlength="30" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="销售数量" prop="userName">
              <el-input v-model="form.userName" placeholder="请输入销售数量" maxlength="30" type="number" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="销售单价" prop="userName">
              <el-input v-model="form.userName" placeholder="请输入销售单价(含税)" maxlength="30" type="number" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="销售总价" prop="userName">
              <el-input v-model="form.userName" placeholder="请输入销售总价(含税)" maxlength="30" type="number" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="热值" prop="userName">
              <el-input v-model="form.userName" placeholder="请输入热值" maxlength="30" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="cancel">取消</el-button>
          <el-button type="primary" @click="submitForm">保存</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>
 
<script setup>
import {ref, reactive} from "vue";
const { proxy } = getCurrentInstance()
const emit = defineEmits()
 
const dialogVisitable = ref(false);
const operationType = ref('add');
const customerOptions = ref([]) // 客户下拉框
const typeOptions = ref([]) // 煤种下拉框
const data = reactive({
  form: {},
  rules: {
    userName: [{ required: true, message: "登录账号不能为空", trigger: "blur" },],
    nickName: [{ required: true, message: "用户姓名不能为空", trigger: "blur" }],
    roleIds: [{ required: true, message: "角色不能为空", trigger: "change" }],
    deptId: [{ required: true, message: "部门不能为空", trigger: "change" }],
    password: [{ required: true, message: "用户密码不能为空", trigger: "blur" }, { min: 5, max: 20, message: "用户密码长度必须介于 5 和 20 之间", trigger: "blur" }, { pattern: /^[^<>"'|\\]+$/, message: "不能包含非法字符:< > \" ' \\\ |", trigger: "blur" }],
  }
})
 
const { form, rules } = toRefs(data)
 
// 打开弹框
const openDialog = (type, row) => {
  console.log('openDialog', type, row)
  dialogVisitable.value = true
}
// 提交合并表单
const submitForm = () => {
  proxy.$refs["userRef"].validate(valid => {
    if (valid) {
    
    }
  })
}
// 关闭合并表单
const cancel = () => {
  proxy.resetForm("userRef")
  dialogVisitable.value = false
  emit('closeDia')
}
defineExpose({ openDialog })
</script>
 
<style scoped>
 
</style>