gaoshp
2024-11-03 3931e2728f618d0090f129b2665bc1285c4440c3
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
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
<!--
 * @Date: 2024-06-16 19:51:01
 * @LastEditors: Sneed
 * @LastEditTime: 2024-06-23 19:53:09
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/console/basic-data/tpm-data-header.vue
-->
<template>
    <div style="width: 100%;display: flex;">
        <el-button type="primary" @click="addNew">新建</el-button>
        <!-- <el-button type="primary">导入</el-button> -->
        <import-table style="margin:0 8px" :exportUrl="exportUrlTpl" :uploadUrl="uploadUrl"></import-table>
        <el-button type="primary" @click="exportData">导出</el-button>
        <el-popconfirm width="220" cancel-button-text="停用" confirm-button-text="删除"
            title="删除数据会影响已关联的业务 ,若您想在已关联的业务中依然显示这些数据, 您可以选择 停用 操作。停用后此数据将不能再被新业务使用。"
            @confirm="table_del(selection, '0')" @cancel="table_del(selection, '1')">
            <template #reference>
                <el-button :disabled="selection.length == 0" type="danger" plain icon="el-icon-delete"></el-button>
            </template>
        </el-popconfirm>
        <el-select v-model="params.status" placeholder="请选择" style="width: 240px;margin-left: auto;">
            <template #prefix><span style="margin-right: 6px;">状态</span></template>
            <el-option key="0" label="停用" :value="0" />
            <el-option key="1" label="启用" :value="1" />
        </el-select>
        <el-input style="width: 240px;margin-left: 8px;" v-model="params.keyWord" placeholder="请输入检索内容"></el-input>
        <el-button @click="search" style="margin-left: 8px;" type="primary" icon="el-icon-search"></el-button>
        <scDialog v-model="visible">
            <scForm v-if="visible" ref="form" :config="config" :rules="rules" v-model="form" @submit="submit">
            </scForm>
        </scDialog>
    </div>
</template>
 
<script>
import importTable from '@/layout/components/importTable.vue'
export default {
    components: {
        importTable,
    },
    props: {
        exportUrl: {
            type: String,
        },
        uploadUrl: {
            type: String,
        },
        exportUrlTpl: {
            type: String,
        },
        modelValue: {
            type: Object,
            default: () => {
                return {}
            }
        },
        rules: {
            type: Object,
            default: () => {
                return {}
            }
        },
        config: {
            type: Object,
            default() {
                return {}
            }
        },
        formData: {
            type: Object,
            default() {
                return {}
            }
        },
        selection: {
            type: Array,
            default() {
                return []
            }
        }
    },
    watch: {
        modelValue(val) {
            this.params = val || {}
        },
        params(val) {
            this.$emit('update:modelValue', val)
        },
        visible(val) {
            if (val) {
                // this.form = {
                //     ...this.formData
                // }
                this.$refs?.form?.resetFields()
            }
        },
        formData() {
            this.form = {
                ...this.formData
            }
        }
    },
    data() {
        return {
            visible: false,
            params: {
                status: 1,
                keyWord: ''
            },
            addCon: {
 
            },
            form: {
            },
        }
    },
    mounted() {
        this.params = this.modelValue
    },
    methods: {
        search() {
            this.$emit('search', this.params)
        },
        edit(row) {
            this.form = { ...row }
            console.log(row, '____')
            this.visible = true
        },
        addNew() {
            this.form = {}
            this.config.formItems.forEach(v => {
                v.disabled = false
            })
            this.visible = true
        },
        submit() {
            this.$emit('submit', this.form)
            this.visible = false
        },
        table_del(selection, type) {
            this.$emit('del', selection, type)
        },
        exportData() {
            this.$HTTP.post(this.exportUrl, this.params).then(res => {
                if (res.success) {
                    window.open(res.data.link)
                }
            })
        }
    },
}
</script>
 
<style lang="scss" scoped></style>