1

lzhe

2024-05-12 2e2ca9a1c95285a2b836cc18dd85fed1f98c963a

1

 src/views/notification/notifyRecord.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,152 @@
<!--
 * @Author: lzhe lzhe@example.com
 * @Date: 2024-03-26 10:28:33
 * @LastEditors: lzhe lzhe@example.com
 * @LastEditTime: 2024-05-08 18:22:48
 * @FilePath: /smart-web/src/views/master/person/main/index.vue
 * @Description: è¿™æ˜¯é»˜è®¤è®¾ç½®,请设置`customMade`, æ‰“å¼€koroFileHeader查看配置 è¿›è¡Œè®¾ç½®: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
    <div class="user-main">
        <div class="user-top">
            <el-form :inline="true" :model="searchData" label-width="80px" style="width: 50%;">
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="通知状态">
                            <el-select v-model="searchData.status" multiple style="width: 100%" @change="statusChange">
                                <el-option v-for="item in statusList" multiple :key="item.id" :label="item.name" :value="item.id"/>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="时间范围">
                            <el-date-picker v-model="searchData.selectDate" type="datetimerange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" align="right" value-format="YYYY-MM-DD HH:mm:ss" @change="dateChange" style="vertical-align: middle;width: 100%;"></el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="">
                            <el-input v-model="searchData.keyWord" placeholder="请输入搜索内容" clearable style="width: 100%" @change="searchChange"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
        </div>
        <div class="user-table">
            <el-table ref="multipleTableRef" :data="tableData" border style="width: 100%" class="multipleTableRef">
                <el-table-column prop="notifierId" label="通知类型"></el-table-column>
                <el-table-column prop="notifierId" label="ID"></el-table-column>
                <el-table-column prop="businessName" label="所属业务"></el-table-column>
                <el-table-column prop="state" label="状态"></el-table-column>
                <el-table-column prop="notifyTime" label="时间"></el-table-column>
                <el-table-column prop="templateId" label="通知模版"></el-table-column>
            </el-table>
            <el-pagination
                style="margin-top: 12px;"
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="currentPage4"
                :page-sizes="[15, 50, 100]"
                :page-size="15"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total">
            </el-pagination>
        </div>
    </div>
</template>
<script>
    export default {
        name: "notifyRecord",
        data(){
            return {
                statusList: [{id:"success",name:"成功"},{id:"error",name:"失败"}],
                searchData: {
                    status: [],
                    selectDate: [],
                    keyword: "",
                    state: "",
                    beginTime: "",
                    endTime: "",
                    current: "1",
                    size: "15"
                },
                total: 0,
                dialog: {
                    save: false
                },
                tableData: []
            }
        },
        created(){
			
        },
        mounted(){
            this.getData();
        },
        components: {

        },
        methods: {
            statusChange(status) {
                this.searchData.state = status.join(",");
                this.getData();
            },
            searchChange() {
                this.getData();
            },
            dateChange(val) {
                this.searchData.beginTime = val[0];
                this.searchData.endTime = val[1];
                this.getData();
            },
            getData() {
                var obj = {};
                for(var key in this.searchData) {
                    if(this.searchData[key] != "" && key != "selectDate" && key != "status") {
                        obj[key] = this.searchData[key];
                    }
                }
                this.$HTTP.get("/api/blade-notify/notify/history/list?" + this.$TOOL.qsStringify(obj)).then(res=> {
                    if(res.code == 200) {
                        this.tableData = res.data.records;
                    }
                })
            },
            handleSizeChange(val) {
                console.log(`每页 ${val} æ¡`);
                this.searchData.current = "1";
                this.searchData.size = val;
                this.getData();
            },
            handleCurrentChange(val) {
                console.log(`当前页: ${val}`);
                this.searchData.current = val;
                this.getData();
            }
        }
    }
</script>

<style scoped>
    .user-main {
        background-color: #f9fafb;
        border: 1px solid #dcdfe6;
        box-shadow: 0 2px 4px 0 rgba(0,0,0,.12), 0 0 6px 0 rgba(0,0,0,.04);
        margin: 8px;
        padding: 8px;
        background-color: #fff;
    }
    .user-top {
        width: 100%;
        display: flex;
        justify-content: flex-end;
        margin-bottom: 8px;
    }
    .user-table {
        width: 100%;
        margin-bottom: 8px;
		
    }
    .multipleTableRef {
        margin-bottom: 8px;
    }
</style>

 src/views/notification/sendDebug.vue

@@ -4,28 +4,32 @@
            <el-row>
                <el-col :span="24">
                    <el-form-item label="通知方式">
                        <el-select style="width: 100%"  v-model="sendForm.provider">
                            <el-option v-for="item in providerList" :key="item.id" :label="item.name" :value="item.id"/>
                        <el-select style="width: 100%"  v-model="sendForm.provider" @change="changeProvider">
                            <el-option v-for="item in providerList" :key="item.configEntity.provider" :label="item.name" :value="item.configEntity.provider"/>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="服务商">
                        <el-select style="width: 100%"  v-model="sendForm.type">
                            <el-option v-for="item in providerInfos" :key="item.id" :label="item.name" :value="item.id"/>
                        <el-select style="width: 100%"  v-model="sendForm.type" disabled>
                            <el-option v-for="item in providerInfos" :key="item.type" :label="item.name" :value="item.type"/>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="接收人">
                        <el-input v-model="sendForm.pname" placeholder="接收人" clearable></el-input>
                    <el-form-item label="接收人" prop="notifiedParty">
                        <el-input v-model="sendForm.notifiedParty" placeholder="接收人" clearable></el-input>
                    </el-form-item>
                </el-col>
                <!-- <el-col :span="24" v-for="(item,index) in sendForm.configuration">
                    <el-form-item :label="item.pname" v-if="item.name != 'properties'">
                <el-col :span="24" v-for="(item,index) in sendContentForm.properties">
                    <el-form-item :label="item.name" v-if="item.property != 'content' && item.property != 'attachments'">
                        <el-input v-model="item.value" :placeholder="item.name" clearable></el-input>
                    </el-form-item>
                    <el-form-item :label="item.pname" v-if="item.name == 'properties'">
                    <!-- å†…容-富文本 -->
                    <el-form-item :label="item.name" v-if="item.property == 'content'">
                        <avue-ueditor v-model="item.value" v-bind="options"></avue-ueditor>
                    </el-form-item>
                    <!-- <el-form-item :label="item.name" v-if="item.property == 'content'">
                        <div class="array-content">
                            <el-row v-for="(item1,index1) in item.value">
                                <el-col v-for="(item2,index2) in item1" :span="7">
@@ -38,8 +42,8 @@
                                </el-col>
                            </el-row>
                        </div>
                    </el-form-item>
                </el-col> -->
                    </el-form-item> -->
                </el-col>
            </el-row>
        </el-form>
        <template #footer>
@@ -54,6 +58,20 @@
        emits: ['success', 'closed'],
        data() {
            return {
                options: {
                    //普通上传地址
                    action: "/api/blade-resource/oss/endpoint/put-file",
                    customConfig: {},//wangEditor编辑的配置
                    headers:{Authorization: "Basic c2FiZXI6c2FiZXJfc2VjcmV0"},
                    data:{},
                    propsHttp: {
                      home:'',
                      url:'url',
                      res: 'data'
                    },
                },
                tableData: {},
                sendContentForm: {},
                providerInfos: [],
                providerList: [],
                serviceproviders: "",
@@ -67,17 +85,29 @@
                isSaveing: false,
                //表单数据
                sendForm: {
                    provider: ""
                    provider: "",
                    notifiedParty: "",
                    template: "",
                    type: ""
                },
                //验证规则
                sendRules: {
                    pname:[{required: true, message: '请输入接收人'}]
                    notifiedParty:[{required: true, message: '请输入接收人'}]
                },
            }
        },
        mounted() {
        },
        methods: {
            changeProvider(val) {
                var id = "";
                this.providerList.forEach(item=> {
                    if(item.configEntity.provider == val) {
                        id = item.id;
                    }
                })
                this.getServiceProviders(id);
            },
            addpro(index,index1) {
                this.sendForm.configuration[index].value.push([
                    {name: 'name', value: ''},
@@ -90,29 +120,47 @@
            },
            //显示
            open(tableData,mode='add'){
                this.providerInfos = tableData[0].providerInfos;  //服务商
                this.getMetadata();  //内容
                this.tableData = tableData;
                var providerList = [];
                tableData.forEach(item=> {
                    if(item.isBindBusiness) {
                        providerList.push(item);
                    }
                })
                this.providerList = providerList;
                this.$nextTick(()=> {
                    this.sendForm.provider = this.providerList[0].id;
                    this.sendForm.type = this.providerInfos[0].id;

                    console.log(this.providerList,this.sendForm.provider)
                })
                this.providerList = providerList;  //通知方式list
                this.getServiceProviders(this.providerList[0].id); //获取供应商
                this.mode = mode;
                this.visible = true;
                return this
            },
            getMetadata() {
                this.$HTTP.get(`/api/blade-notify/notifier/template/dingTalk/dingTalkMessage/config/metadata`).then(res=> {
            getServiceProviders(id) {
                console.log(id,this.tableData)
                this.tableData.forEach(item=> {
                    if(item.id == id) {
                        this.providerInfos = item.providerInfos;  //服务商
                        this.sendForm.provider = item.configEntity.provider;
                        this.sendForm.type = item.id;
                    }
                })
                this.$nextTick(()=> {
                    this.getMetadata(this.sendForm.provider);  //内容
                })
            },
            getMetadata(val) {
                var url = "";
                if(val == "dingTalkMessage") {
                    url = `/api/blade-notify/notifier/template/dingTalk/dingTalkMessage/config/metadata`;
                }else if(val == "qyTextMessage") {
                    url = `/api/blade-notify/notifier/template/weiXinQY/qyTextMessage/config/metadata`;
                }else if(val == "systemDefault") {
                    url = `/api/blade-notify/notifier/template/internalMessage/systemDefault/config/metadata`;
                }else if(val == "embedded") {
                    url = `/api/blade-notify/notifier/template/email/embedded/config/metadata`;
                }
                this.$HTTP.get(url).then(res=> {
                    if(res.code == 200) {
						
                        this.sendContentForm = res.data;
                        console.log(this.sendContentForm,8)
                    }else {
                        this.$message.error(res.msg);
                    }
@@ -120,44 +168,31 @@
            },
            //表单提交方法
            sendSubmit(){
                var configuration = {};
                this.sendForm.configuration.forEach(item=> {
                    configuration[item.name] = item.value;
                var template = {};
                this.sendContentForm.properties.forEach(item=> {
                    template[item['property']] = item.value;
                })
                var obj = {
                    configuration: configuration,
                    notifiedParty: this.sendForm.notifiedParty,
                    provider: this.sendForm.provider,
                    template: JSON.stringify(template),
                    type: this.sendForm.type
                }
                if(this.mode == 'edit') {
                    obj.id = this.sendForm.configEntity.id;
                    obj.name = this.sendForm.configEntity.name;
                    obj.provider = this.sendForm.configEntity.provider;
                    obj.type = this.sendForm.configEntity.type;
                    if(this.sendForm.configEntity.type == "email") {  //邮件
                        var newArr = [];
                        configuration.properties.forEach(item=> {
                            var formattedObject = {};
                            item.forEach(item => {  
                              formattedObject[item.name] = item.value;  
                            });
                            newArr.push(formattedObject);
                var id = "";
                this.providerList.forEach(item=> {
                    if(item.id == this.sendForm.type){
                        id = item.configEntity.id;
                    }
                        })
                        configuration.properties = newArr;
                    }
                }
                if(this.mode == 'add') {  //新增
                    obj.name = this.sendForm.pname;
                    obj.provider = this.serviceproviders;
                    obj.type = this.sendForm.id;
                }
                this.$refs.dialogForm.validate(async (valid) => {
                    if (valid) {
                        this.isSaveing = true;
                        this.$HTTP.put("/api/blade-notify/notifier/config",obj).then(res=> {
                        this.$HTTP.post(`/api/blade-notify/notifier/${id}/send`,obj).then(res=> {
                            this.isSaveing = false;
                            if(res.code == 200) {
                                this.$emit('success', this.sendForm, this.mode);
                                this.visible = false;
                                this.$message.success("编辑成功");
                                this.$message.success("发送成功");
                            }else {
                                this.$alert(res.message, "提示", {type: 'error'});
                            }