feat:事件工单滚动条

张含笑

2025-08-05 c832bf2e80ac465e71b7a1c1f7a59d4252030989

 src/views/dataCenter/components/searchData.vue

@@ -37,6 +37,7 @@
            popper-class="custom-date-picker"
            v-model="dateRange"
            type="daterange"
            :clearable="true"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
@@ -67,15 +68,18 @@
              :key="item.value"
              :label="item.label"
              :value="item.value"
         :disabled="searchForm.photoType !== '' && item.value === '4'"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="文件类别:">
          <el-select
            :disabled="disabled"
            :teleported="false"
            v-model="searchForm.photoType"
            placeholder="请选择"
            clearable
            @clear="changePhotoType"
          >
            <el-option
              v-for="item in CategoryOption"
@@ -97,8 +101,12 @@
      </div>
      <div class="search-first">
        <div class="search-btn">
          <el-button type="primary" icon="el-icon-download" @click="allDownloadFun">全部下载</el-button>
          <el-button type="success" plain icon="el-icon-download" @click="downloadFun">下载</el-button>
          <el-button type="primary" icon="el-icon-download" @click="allDownloadFun"
            >全部下载</el-button
          >
          <el-button type="success" plain icon="el-icon-download" @click="downloadFun"
            >下载</el-button
          >
        </div>
      </div>
    </el-form>
@@ -111,17 +119,34 @@
import dayjs from 'dayjs';
import { useStore } from 'vuex';
import { getRegionTreeAll, getDeviceRegion, deptsByAreaCode } from '@/api/job/task';
import { watch } from 'vue';
const store = useStore();
const userAreaCode = computed(() => store.getters.userInfo.detail.areaCode);
const selectedAreaCode = computed(() => store.state.user.selectedAreaCode);
const emit = defineEmits(['search','downFun','allDownFun']);
const emit = defineEmits(['search', 'downFun', 'allDownFun']);
const startTime = dayjs().subtract(6, 'day').startOf('day');
const endTime = dayjs().endOf('day');
const timeRange = [startTime.format('YYYY-MM-DD HH:mm:ss'), endTime.format('YYYY-MM-DD HH:mm:ss')];
const dateRange = ref(timeRange);
const timeFormat = 'YYYY-MM-DD HH:mm:ss';
const searchForm = reactive({
  jobName: '', //任务名称
  name: '', //文件名称
  areaCode: userAreaCode.value, // 区域code
  endTime: endTime.format(timeFormat), // 结束时间
  startTime: startTime.format(timeFormat), // 开始时间
  deviceSn: '', // 所属机巢
  resultType: '', //文件格式
  photoType: '', //文件类别
});
const disabled = ref(false);
const treeProps = {
  label: 'name',
  value: 'id',
  children: 'childrens',
};
const fileFormatOption = [
{
  {
    value: '',
    label: '全部',
  },
@@ -140,10 +165,12 @@
  {
    value: '5',
    label: '全景',
    
  },
  {
    value: '4',
    label: '正射',

  },
];
const CategoryOption = [
@@ -156,22 +183,22 @@
    label: '红外',
  },
];
const startTime = dayjs().subtract(6, 'day').startOf('day')
const endTime = dayjs().endOf('day')
const timeRange = [startTime.format('YYYY-MM-DD HH:mm:ss'), endTime.format('YYYY-MM-DD HH:mm:ss')]
const dateRange = ref(timeRange);
const timeFormat = 'YYYY-MM-DD HH:mm:ss';
const searchForm = reactive({
  jobName: '', //任务名称
  name: '', //文件名称
  areaCode: userAreaCode.value, // 区域code
  endTime:  endTime.format(timeFormat), // 结束时间
  startTime: startTime.format(timeFormat), // 开始时间
  deviceSn: '', // 所属机巢
  resultType: '', //文件格式
  photoType: '', //文件类别
});

watch(
  () => searchForm.resultType,
  newVal => {
    if (newVal === '4') {
      disabled.value = true;
    } else {
      disabled.value = false;
    }
  },
  { deep: true }
);
const changePhotoType =(val)=>{
if(val === undefined){
  searchForm.photoType = ''
}
}
// 部门
let deptTreeData = ref([]);
// 机巢
@@ -185,9 +212,9 @@
    const start = dayjs(val[0]);
    const end = dayjs(val[1]);
    const diff = end.diff(start, 'day');

    if (diff > 31) {
      ElMessage.warning('日期范围不能超过31天');
 const maxDays = 365;
    if (diff > maxDays) {
      ElMessage.warning('日期范围不能超过一年');
      dateRange.value = [];
      // 重置为默认时间范围
      setTimeout(() => {
@@ -195,12 +222,12 @@
      }, 0);
      return;
    }
    

    // 更新搜索表单中的时间
    searchForm.startTime = start.format(timeFormat);
    searchForm.endTime = end.format(timeFormat);
  }
  handleSearch();

};
// 部门下得机巢
const requestDockInfo = () => {
@@ -223,7 +250,7 @@
    searchForm.deviceSn = signDevice_sn.value;
  }
  // 所属部门重新请求值
 

  deptData.value = [];
  getDeptsByAreaCode();
};
@@ -249,27 +276,31 @@
      ? dayjs(dateRange?.value[1]).endOf('day').format(timeFormat)
      : null,
  };
  console.log('searchForm', params);
  // 调用父组件方法
  emit('search', params);
};
// 清空
const handleReset = () => {
  dateRange.value = [];
  Object.keys(searchForm).forEach(key => {
    searchForm[key] = '';
  });
  dateRange.value = timeRange;
  searchForm.jobName = '';
  searchForm.name = '';
  searchForm.areaCode = userAreaCode.value;
  searchForm.endTime = endTime.format(timeFormat);
  searchForm.startTime = startTime.format(timeFormat);
  searchForm.deviceSn = '';
  searchForm.resultType = '';
  searchForm.photoType = '';
  handleNodeClick({ id: userAreaCode.value });
  handleSearch();
};
// 下载
const downloadFun =()=>{
const downloadFun = () => {
  emit('downFun');
}
};
// 全部下载
const allDownloadFun =()=>{ 
    emit('allDownFun');
}
const allDownloadFun = () => {
  emit('allDownFun');
};
onMounted(() => {
  requestDockInfo();
});