1.巡检管理频次选择逻辑修改

gaoluyang

2025-07-01 6dfb5e44a7072d78ca6c04d21b7ed8ad126b874f

 src/views/inspectionManagement/components/formDia.vue

@@ -10,20 +10,79 @@
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="地点" prop="port">
              <el-input v-model="form.port" placeholder="请输入地点" maxlength="30" />
            <el-form-item label="地点" prop="inspectionLocation">
              <el-input v-model="form.inspectionLocation" placeholder="请输入地点" maxlength="30" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="巡检人" prop="inspector">
              <el-input v-model="form.inspector" placeholder="巡检人" maxlength="30" />
              <el-select v-model="form.inspector" placeholder="请选择" multiple clearable>
                <el-option v-for="item in userList" :label="item.nickName" :value="item.userId" :key="item.userId"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="备注" prop="remarks">
              <el-input v-model="form.remarks" placeholder="请输入备注" type="textarea" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="任务频率" prop="frequencyType">
              <el-select v-model="form.frequencyType" placeholder="请选择" clearable>
                <el-option label="每日" value="DAILY"/>
                <el-option label="每周" value="WEEKLY"/>
                <el-option label="每月" value="MONTHLY"/>
                <el-option label="季度" value="QUARTERLY"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12" v-if="form.frequencyType === 'DAILY' && form.frequencyType">
            <el-form-item label="日期" prop="frequencyDetail">
              <el-time-picker v-model="form.frequencyDetail" placeholder="选择时间" format="HH:mm"
                              value-format="HH:mm" />
            </el-form-item>
          </el-col>
          <el-col :span="12" v-if="form.frequencyType === 'WEEKLY' && form.frequencyType">
            <el-form-item label="日期" prop="frequencyDetail">
              <el-select v-model="form.week" placeholder="请选择" clearable style="width: 50%">
                <el-option label="周一" value="MON"/>
                <el-option label="周二" value="TUE"/>
                <el-option label="周三" value="WED"/>
                <el-option label="周四" value="THU"/>
                <el-option label="周五" value="FRI"/>
                <el-option label="周六" value="SAT"/>
                <el-option label="周日" value="SUN"/>
              </el-select>
              <el-time-picker v-model="form.frequencyDetail" placeholder="选择时间" format="HH:mm"
                              value-format="HH:mm"  style="width: 50%"/>
            </el-form-item>
          </el-col>
          <el-col :span="12" v-if="form.frequencyType === 'MONTHLY' && form.frequencyType">
            <el-form-item label="日期" prop="frequencyDetail">
              <el-date-picker
                  v-model="form.frequencyDetail"
                  type="datetime"
                  clearable
                  placeholder="选择开始日期"
                  format="DD,HH:mm"
                  value-format="DD,HH:mm"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12" v-if="form.frequencyType === 'QUARTERLY' && form.frequencyType">
            <el-form-item label="日期" prop="frequencyDetail">
              <el-date-picker
                  v-model="form.frequencyDetail"
                  type="datetime"
                  clearable
                  placeholder="选择开始日期"
                  format="MM,DD,HH:mm"
                  value-format="MM,DD,HH:mm"
              />
            </el-form-item>
          </el-col>
        </el-row>
@@ -39,9 +98,10 @@
</template>

<script setup>
import {reactive, ref} from "vue";
import {reactive, ref, computed} from "vue";
import useUserStore from '@/store/modules/user'
import {addOrEditInspectionTask} from "@/api/inspectionManagement/index.js";
import {addOrEditTimingTask} from "@/api/inspectionManagement/index.js";
import {userListAll} from "@/api/publicApi/index.js";

const { proxy } = getCurrentInstance()
const emit = defineEmits()
@@ -51,43 +111,66 @@
const data = reactive({
  form: {
    taskName: '',
    port: '',
    inspectionLocation: '',
    inspector: '',
    inspectorIds: '',
    remarks: '',
    frequencyType: '',
    frequencyDetail: '',
  },
  rules: {
    taskName: [{ required: true, message: "请输入任务名称", trigger: "blur" },],
    port: [{ required: true, message: "请输入地点", trigger: "blur" },],
    inspectionLocation: [{ required: true, message: "请输入地点", trigger: "blur" },],
    inspector: [{ required: true, message: "请输入巡检人", trigger: "blur" },],
  }
})

const { form, rules } = toRefs(data)
const userList = ref([])

// 打开弹框
const openDialog = async (type, row) => {
  dialogVisitable.value = true
  userListAll().then(res => {
    userList.value = res.data
  })
  if (type === 'edit') {
    form.value = {...row}
  }
}
// 提交合并表单
const submitForm = () => {
  proxy.$refs["formRef"].validate(valid => {
    if (valid) {
      addOrEditInspectionTask(form.value).then(() => {
        cancel()
        proxy.$modal.msgSuccess('提交成功')
      })
    }
  })
}

// 关闭合并表单
const cancel = () => {
  proxy.resetForm("formRef")
  dialogVisitable.value = false
  emit('closeDia')
}
const selectedDateTime = ref(null)

// 计算星期几
const dayOfWeek = computed(() => {
  if (!selectedDateTime.value) return ''
  
  const date = new Date(selectedDateTime.value)
  const dayIndex = date.getDay()
  
  const weekDays = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
  return weekDays[dayIndex]
})
// 提交合并表单
const submitForm = () => {
  proxy.$refs["formRef"].validate(valid => {
    if (valid) {
      form.value.inspectorIds = form.value.inspector.join(',')
      if (form.value.frequencyType === 'WEEKLY') {
        form.value.frequencyDetail = form.value.week + ',' + form.value.frequencyDetail
      }
      addOrEditTimingTask(form.value).then(() => {
        cancel()
        proxy.$modal.msgSuccess('提交成功')
      })
    }
  })
}
defineExpose({ openDialog })
</script>