事件处置信息发布

ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/ReleaseInformation/index.vue

@@ -31,7 +31,7 @@
     <div class="bottom">
       <Button
         v-if="detailData.eventState != 2"
-        @click.native="handleSubmit"
+        @click.native="openDialog"
         :loading="submitting"
         class="title-button special-button"
       >
@@ -41,11 +41,66 @@
         发布预案
       </ButtonGradient> -->
     </div>
+
+    <Dialog
+      title="接收人"
+      v-model="dialogVisible"
+      width="1000px"
+      >
+      <div class="StatsDetail">
+        <el-form ref="dialogForm" :model="dialogForm">
+          <el-table :data="tableData">
+            <el-table-column
+              prop="organizationName"
+              label="路管驻点"
+              width="180"
+              align="center"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="difference"
+              label="距离"
+              width="180"
+              align="center"
+            >
+              <template slot-scope="scope">
+                <span>{{ scope.row.difference }}公里</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="人员" align="center">
+              <template slot-scope="scope">
+                <div style="max-height: 100px;overflow-y: auto;">
+                  <el-checkbox-group v-model="dialogForm.employees">
+                    <el-checkbox
+                      v-for="item in scope.row.employeesList"
+                      :key="item.id"
+                      :label="item.id"
+                    >{{ item.name }}</el-checkbox
+                    >
+                  </el-checkbox-group>
+                </div>
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-form>
+      </div>
+
+      <template #footer>
+        <Button
+          style="background-color: rgba(0, 179, 204, 0.3)"
+          @click.native="(dialogVisible = false), (submitting = false)"
+        >
+          关闭
+        </Button>
+        <Button  @click.native="handleSubmit" :loading="submitting"> 确定</Button>
+      </template>
+    </Dialog>
   </Card>
 </template>
 
 <script>
-import Card from "@screen/components/Card2/Card.vue";
+  import Dialog from "@screen/components/Dialog/index.vue";
+  import Card from "@screen/components/Card2/Card.vue";
 import ButtonGradient from "@screen/components/Buttons/ButtonGradient.vue";
 import Button from "@screen/components/Buttons/Button.vue";
 import Form from "@screen/components/FormConfig";
@@ -58,6 +113,7 @@ export default {
   name: "ReleaseInformation",
   mixins: [provideMixin],
   components: {
+    Dialog,
     Card,
     ButtonGradient,
     CheckboxGroup,
@@ -67,18 +123,18 @@ export default {
   },
   inject: ["provideData","reload"],
   watch: {
-   
+
     async "provideData.detail"(newValue, oldValue) {
-      
+
       this.eventId = newValue.id;
       this.bindChannels();
+      this.bindEmployees(newValue.stakeMark);
 
       // console.log("建亭侯", this.provideDetail);
     },
   },
   data() {
     return {
-      
       list: [
         {
           label: "情报板",
@@ -116,11 +172,17 @@ export default {
         //   default: [],
         // },
       ],
+
+      dialogVisible:false,
+      dialogForm:{
+        employees:[]
+      },
+      tableData:[],
     };
   },
   mounted() {
     //公众服务统计分析
-    
+
   },
   methods: {
     bindChannels(){
@@ -137,9 +199,23 @@ export default {
             }
         })
       }, 1000);
-      
+
     },
-    async handleSubmit() {
+    bindEmployees(stakeMark){
+      setTimeout(() => {
+        request({
+          url: `/business/employees/getAllEmployees`,
+          method: "get",
+          params: {stakeMark: stakeMark }
+        }).then((result) => {
+          if(result && result.length > 0){
+            this.tableData = result
+          }
+        })
+      }, 1000);
+
+    },
+    async openDialog(){
       await this.$refs.FormMsgRef.validate()
         .then(async (res) => {
           let data = _.cloneDeep(res);
@@ -158,29 +234,39 @@ export default {
           }
           data.eventId = this.detailData.id;
           data.stakeMark = this.detailData.stakeMark
-          console.log(this.detailData)
-          this.submitting = true;
-          await request({
-            url: `/business/sms/pushAll`,
-            method: "post",
-            data: data,
-          })
-            .then((result) => {
-              if (result.code != 200) return this.$message.error(result?.msg);
-              this.$message.success("提交成功");
-              this.reload();
-            })
-            .catch(() => {
-              this.$message.error("提交失败");
-            })
-            .finally(() => {
-              this.submitting = false;
-            });
+          for (let key in data) {
+            if (data.hasOwnProperty(key)) {
+              this.dialogForm[key] = data[key];
+            }
+          }
+          this.dialogVisible = true
+
         })
         .catch((err) => {
           console.log("catch" + err);
         });
     },
+    async handleSubmit() {
+
+      this.submitting = true;
+
+      await request({
+        url: `/business/sms/pushAll`,
+        method: "post",
+        data: this.dialogForm,
+      }).then((result) => {
+          if (result.code != 200) return this.$message.error(result?.msg);
+          this.$message.success("提交成功");
+          this.reload();
+        })
+        .catch(() => {
+          this.$message.error("提交失败");
+        })
+        .finally(() => {
+          this.submitting = false;
+          this.dialogVisible = false;
+        });
+    },
   },
 };
 </script>
@@ -243,4 +329,87 @@ export default {
     }
   }
 }
+::v-deep .el-table__empty-text {
+  color: #3ae0f8;
+}
+
+.StatsDetail {
+  // height: 770px;
+  margin: 20px 0;
+  width: 100%;
+  display: flex;
+  gap: 5px;
+}
+
+.el-table {
+  border: 1px solid #07aec6;
+  background: #0b6581;
+}
+
+@media (min-width: 3000px) {
+  ::v-deep .el-table .el-table__header-wrapper th,
+  .el-table .el-table__fixed-header-wrapper th {
+    height: 55px !important;
+    background: #0b6581;
+    border: 1px solid #07aec6;
+    font-size: 22px;
+  }
+  ::v-deep .el-table td.el-table__cell div{
+    font-size: 22px;
+  }
+}
+::v-deep .el-table .el-table__header-wrapper th,
+.el-table .el-table__fixed-header-wrapper th {
+  background: #0b6581;
+  border: 1px solid #07aec6;
+}
+
+::v-deep .el-table th.el-table__cell > .cell {
+  color: #3de8ff;
+}
+
+::v-deep .el-table thead.is-group th.el-table__cell {
+  background: #0b6581;
+  border: 1px solid #07aec6;
+}
+
+// ::v-deep .el-table th.el-table__cell.is-leaf,
+::v-deep .el-table td.el-table__cell {
+  border: 1px solid #07aec6;
+  background: #1b586d;
+  color: #fff;
+}
+::v-deep .el-table td.el-table__cell div {
+  line-height: 30px;
+}
+::v-deep .el-checkbox-group {
+  text-align: left;
+  .el-checkbox {
+    min-width: 70px;
+  }
+}
+
+::v-deep .el-table tr {
+  border: 1px solid #07aec6;
+  background-color: #0b6581;
+}
+
+::v-deep
+.el-table--enable-row-hover
+.el-table__body
+tr:hover
+> td.el-table__cell {
+  background: #1b586d;
+  border: 1px solid #07aec6;
+}
+
+::v-deep .el-table::before,
+.el-table--group::after,
+.el-table--border::after {
+  background: none;
+}
+.footer {
+  margin-top: 20px;
+  display: flex;
+}
 </style>