Merge branch 'master' of http://120.26.64.82:3000/BFFE/SZYGM1.0

src/components/TBtnGroup/index.vue

@@ -1,37 +1,30 @@
 <template>
   <div class="btnGroup">
-    <el-switch
-      v-model="flag"
-      size="default"
-      style="--el-switch-on-color: #ac014d; --el-switch-off-color: #b1b1b1"
-      @change="
+    <template v-if="groupSet.isUtc">
+      <el-switch v-model="flag" size="default" style="--el-switch-on-color: #ac014d; --el-switch-off-color: #b1b1b1" @change="
         val => {
           emit('update:flag', val)
         }
-      "
-    />
-    <span class="switch-label">开启UTC</span>
-    <el-button type="danger" :icon="Refresh" size="default" @click="emit('refresh',true)"/>
-    <el-button type="danger" :icon="Share" size="default" @click="emit('downLoad',true)"/>
-    <el-button type="danger" :icon="Tools" size="default" @click="emit('columnSet',true);"/>
+      " />
+    </template>
+    <span class="switch-label" v-if="groupSet.isUtc">开启UTC</span>
+    <el-button type="danger" v-if="groupSet.isRefresh" :icon="Refresh" size="default" @click="emit('refresh',true)" />
+    <el-button type="danger" v-if="groupSet.isDownLoad" :icon="Share" size="default" @click="emit('downLoad',true)" />
+    <el-button type="danger" v-if="groupSet.isColumnSet" :icon="Tools" size="default" @click="emit('columnSet',true);" />
   </div>
 </template>
 
 <script setup lang="ts">
 import { ref } from "vue";
-import {
-  Refresh,
-  Share,
-  Tools
-} from '@element-plus/icons-vue'
+import { Refresh, Share, Tools } from "@element-plus/icons-vue";
 const props = defineProps({
-  groupSet:{
+  groupSet: {
     type: Object,
     default: {
       isUtc: true,
-      isRefresh:true,
-      isDownLoad:true,
-      isColumnSet:true
+      isRefresh: true,
+      isDownLoad: true,
+      isColumnSet: true,
     },
   },
   flag: {
@@ -39,11 +32,8 @@ const props = defineProps({
     required: true,
   },
 });
-
-const emit = defineEmits(['update:flag','refresh','downLoad','columnSet'])
-
-
-
+const { groupSet } = props;
+const emit = defineEmits(["update:flag", "refresh", "downLoad", "columnSet"]);
 </script>
 
 <style lang="scss" scoped>
@@ -52,7 +42,7 @@ const emit = defineEmits(['update:flag','refresh','downLoad','columnSet'])
   .switch-label {
     padding-left: 4px;
   }
-  :deep .el-button{
+  :deep .el-button {
     height: 30px;
     padding: 7px 6px;
     font-size: 16px;

src/views/baggageManagement/departure/waybill/index.vue

@@ -11,7 +11,8 @@
         <div class="manageTitle">运单跟踪信息</div>
         <div class="status">正常</div>
       </div>
-      <div class="station-status-search">
+      <div class="station-status-search flex-wrap">
+        <TBtnGroup @columnSet="columnSet" :groupSet="groupSet" />
         <Search @clear="clear" @search="search" />
       </div>
     </div>
@@ -50,15 +51,19 @@
       </div>
     </div>
     <div class="station-table">
-      <Table height="calc(100vh - 700px)" :tableHeader="tableHeader" :tableData="tableData" />
+      <Table height="calc(100vh - 700px)" :tableHeader="state.waybillTableHeader" :tableData="tableData" />
     </div>
+    <tableColumnSet :dialogVisible="state.dialogVisible" :columnList="state.waybillTableHeader" @setColumn="setColumn" @closeDialog="closeDialog"></tableColumnSet>
   </div>
 </template>
 
 <script setup lang="ts">
+import { reactive } from "vue";
 import Search from "@/components/search/index.vue";
 import Steps from "@/components/steps/index.vue";
 import Table from "@/components/tableTemp/index.vue";
+import TBtnGroup from "@/components/TBtnGroup/index.vue";
+import tableColumnSet from "@/components/tableColumnSet/index.vue";
 import { ElMessage } from "element-plus";
 const dataInfo = [
   {
@@ -175,6 +180,12 @@ const datas1 = [
     children: ["A32", "534件", "通过", "10:25"],
   },
 ];
+const groupSet = {
+  isUtc: false,
+  isRefresh: false,
+  isDownLoad: true,
+  isColumnSet: true,
+};
 const tableHeader = [
   { label: "航班号", key: "fightNo" },
   { label: "集装器编号", key: "containerNo" },
@@ -336,12 +347,119 @@ const tableData = [
     extract: "A203-未通过-15:40",
   },
 ];
+const state = reactive({
+  dialogVisible: false,
+  waybillTableHeader: [
+    { label: "航班号", key: "fightNo", isShow: true },
+    { label: "集装器编号", key: "containerNo", isShow: true },
+    { label: "货物编码", key: "goodsNo", isShow: true },
+    { label: "拉下", key: "dwon1", isShow: true },
+    { label: "退运", key: "return", isShow: true },
+    {
+      label: "收货核单",
+      key: "receipt",
+      lableClass: "scoreColumn",
+      columnClassName: "scoreColumn",
+      isShow: true,
+    },
+    {
+      label: "安检",
+      key: "securityCheck",
+      lableClass: "scoreColumn",
+      columnClassName: "scoreColumn",
+      isShow: true,
+    },
+    {
+      label: "理货",
+      key: "tally",
+      lableClass: "scoreColumn",
+      columnClassName: "scoreColumn",
+      isShow: true,
+    },
+    {
+      label: "拉下",
+      key: "dwon2",
+      lableClass: "scoreColumn",
+      columnClassName: "scoreColumn",
+      isShow: true,
+    },
+    {
+      label: "待运区",
+      key: "waitingArea",
+      lableClass: "scoreColumn",
+      columnClassName: "scoreColumn",
+      isShow: true,
+    },
+    {
+      label: "货站交接",
+      key: "goodSstation1",
+      lableClass: "scoreColumn",
+      columnClassName: "scoreColumn",
+      isShow: true,
+    },
+    {
+      label: "机下交接",
+      key: "offBoard1",
+      lableClass: "scoreColumn",
+      columnClassName: "scoreColumn",
+      isShow: true,
+    },
+    {
+      label: "装机",
+      key: "installEquipment",
+      lableClass: "scoreColumn",
+      columnClassName: "scoreColumn",
+      isShow: true,
+    },
+    {
+      label: "卸机",
+      key: "unloading",
+      lableClass: "scoreColumn2",
+      columnClassName: "scoreColumn2",
+      isShow: true,
+    },
+    {
+      label: "机下交接",
+      key: "offBoard2",
+      lableClass: "scoreColumn2",
+      columnClassName: "scoreColumn2",
+      isShow: true,
+    },
+    {
+      label: "货站交接",
+      key: "goodSstation2",
+      lableClass: "scoreColumn2",
+      columnClassName: "scoreColumn2",
+      isShow: true,
+    },
+    {
+      label: "提取",
+      key: "extract",
+      lableClass: "scoreColumn2",
+      columnClassName: "scoreColumn2",
+      isShow: true,
+    },
+  ],
+});
 const search = (val) => {
   ElMessage.success(`搜索成功：${val}`);
 };
 const clear = () => {
   ElMessage.success(`清除`);
 };
+const setColumn = (data) => {
+  state.waybillTableHeader = data;
+  state.dialogVisible = false;
+};
+
+const closeDialog = (data) => {
+  state.dialogVisible = false;
+};
+
+//点击列设置按钮
+const columnSet = (data) => {
+  state.dialogVisible = true;
+};
 </script>
 
 <style lang="scss" scoped>