feat(芯导): 仓储库存管理/协同审批会议提醒/采购付款查询导出/营销回款流水导出/生产设备补字段

tuqin

9 天以前 7ab50761e7b6649fc30930cfd604d663b2ea4e00

 src/views/personnelManagement/contractManagement/index.vue

@@ -3,221 +3,227 @@
    <div class="search_form">
      <div>
        <span class="search_title">姓名：</span>
        <el-input
            v-model="searchForm.staffName"
            style="width: 240px"
            placeholder="请输入姓名搜索"
            @change="handleQuery"
            clearable
            :prefix-icon="Search"
        />
        <el-button type="primary" @click="handleQuery" style="margin-left: 10px"
        >搜索</el-button
        >
        <el-input v-model="searchForm.staffName" style="width: 200px" placeholder="请输入姓名搜索" @change="handleQuery" clearable :prefix-icon="Search" />
        <span style="margin-left: 10px" class="search_title">状态：</span>
        <el-select v-model="searchForm.status" placeholder="全部" clearable style="width: 140px" @change="handleQuery">
          <el-option label="有效" :value="0" />
          <el-option label="已续签" :value="1" />
          <el-option label="已解除" :value="2" />
        </el-select>
        <el-button type="primary" @click="handleQuery" style="margin-left: 10px">搜索</el-button>
      </div>
      <div>
        <!--        <el-button type="primary" @click="openForm('add')">新增入职</el-button>-->
        <el-button type="primary" @click="openForm('add')">新增合同</el-button>
        <el-button @click="handleOut">导出</el-button>
        <!--        <el-button type="danger" plain @click="handleDelete">删除</el-button>-->
        <el-button type="danger" plain @click="handleDelete">删除</el-button>
      </div>
    </div>
    <div class="table_list">
      <PIMTable
          rowKey="id"
          :column="tableColumn"
          :tableData="tableData"
          :page="page"
          :isSelection="true"
          @selection-change="handleSelectionChange"
          :tableLoading="tableLoading"
          @pagination="pagination"
          :total="page.total"
      ></PIMTable>
      <PIMTable rowKey="id" :column="tableColumn" :tableData="tableData" :page="page" :isSelection="true"
        @selection-change="handleSelectionChange" :tableLoading="tableLoading" @pagination="pagination"
        :total="page.total"></PIMTable>
    </div>

    <!-- 新增/编辑合同 -->
    <el-dialog v-model="dialogFormVisible" :title="operationType === 'add' ? '新增合同' : '编辑合同'" width="60%" @close="closeDia">
      <el-form :model="form" label-width="120px" label-position="top" :rules="rules" ref="formRef">
        <el-row :gutter="30">
          <el-col :span="12"><el-form-item label="员工姓名：" prop="staffName"><el-input v-model="form.staffName" placeholder="请输入" /></el-form-item></el-col>
          <el-col :span="12"><el-form-item label="员工编号：" prop="staffNo"><el-input v-model="form.staffNo" placeholder="请输入" /></el-form-item></el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12"><el-form-item label="岗位：" prop="postJob"><el-input v-model="form.postJob" placeholder="请输入" /></el-form-item></el-col>
          <el-col :span="12"><el-form-item label="合同年限：" prop="contractTerm"><el-input-number v-model="form.contractTerm" :min="0" :step="1" :precision="0" style="width:100%" /></el-form-item></el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12"><el-form-item label="签订日期：" prop="signDate"><el-date-picker v-model="form.signDate" type="date" value-format="YYYY-MM-DD" format="YYYY-MM-DD" placeholder="请选择" style="width:100%" /></el-form-item></el-col>
          <el-col :span="12"><el-form-item label="合同开始日期：" prop="startDate"><el-date-picker v-model="form.startDate" type="date" value-format="YYYY-MM-DD" format="YYYY-MM-DD" placeholder="请选择" style="width:100%" /></el-form-item></el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12"><el-form-item label="合同结束日期：" prop="endDate"><el-date-picker v-model="form.endDate" type="date" value-format="YYYY-MM-DD" format="YYYY-MM-DD" placeholder="请选择" style="width:100%" /></el-form-item></el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="24"><el-form-item label="合同内容：" prop="contractContent"><el-input v-model="form.contractContent" type="textarea" :rows="4" placeholder="请输入合同内容" /></el-form-item></el-col>
        </el-row>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="submitForm">确认</el-button>
          <el-button @click="closeDia">取消</el-button>
        </div>
      </template>
    </el-dialog>

    <!-- 续签 -->
    <el-dialog v-model="renewVisible" title="续签合同" width="40%">
      <el-form :model="renewForm" label-width="140px" label-position="top">
        <el-form-item label="续签日期："><el-date-picker v-model="renewForm.renewDate" type="date" value-format="YYYY-MM-DD" format="YYYY-MM-DD" placeholder="请选择" style="width:100%" /></el-form-item>
        <el-form-item label="续签后到期日期："><el-date-picker v-model="renewForm.renewEndDate" type="date" value-format="YYYY-MM-DD" format="YYYY-MM-DD" placeholder="请选择" style="width:100%" /></el-form-item>
        <el-form-item label="合同年限："><el-input-number v-model="renewForm.contractTerm" :min="0" :step="1" :precision="0" style="width:100%" /></el-form-item>
      </el-form>
      <template #footer>
        <el-button type="primary" @click="submitRenew">确认续签</el-button>
        <el-button @click="renewVisible = false">取消</el-button>
      </template>
    </el-dialog>

    <!-- 解除 -->
    <el-dialog v-model="terminateVisible" title="解除合同" width="40%">
      <el-form :model="terminateForm" label-width="140px" label-position="top">
        <el-form-item label="解除日期："><el-date-picker v-model="terminateForm.terminateDate" type="date" value-format="YYYY-MM-DD" format="YYYY-MM-DD" placeholder="请选择" style="width:100%" /></el-form-item>
        <el-form-item label="解除原因："><el-input v-model="terminateForm.terminateReason" type="textarea" :rows="3" placeholder="请输入解除原因" /></el-form-item>
      </el-form>
      <template #footer>
        <el-button type="primary" @click="submitTerminate">确认解除</el-button>
        <el-button @click="terminateVisible = false">取消</el-button>
      </template>
    </el-dialog>

    <form-dia ref="formDia" @close="handleQuery"></form-dia>
  </div>
</template>

<script setup>
import { Search } from "@element-plus/icons-vue";
import {onMounted, ref} from "vue";
import { onMounted, ref, reactive, toRefs, getCurrentInstance, nextTick } from "vue";
import { ElMessageBox } from "element-plus";
import FormDia from "@/views/personnelManagement/contractManagement/components/formDia.vue";
import {ElMessageBox} from "element-plus";
import {staffOnJobListPage} from "@/api/personnelManagement/employeeRecord.js";
import {
  contractListPage, contractAdd, contractUpdate, contractDel, contractRenew, contractTerminate,
} from "@/api/personnelManagement/contract.js";
import dayjs from "dayjs";

const data = reactive({
  searchForm: {
    staffName: "",
  },
});
const { proxy } = getCurrentInstance();
const data = reactive({ searchForm: { staffName: "", status: undefined } });
const { searchForm } = toRefs(data);

const statusText = (s) => (s == 0 ? "有效" : s == 1 ? "已续签" : s == 2 ? "已解除" : "");
const statusType = (s) => (s == 0 ? "primary" : s == 1 ? "warning" : s == 2 ? "danger" : "");

const tableColumn = ref([
  { label: "员工编号", prop: "staffNo" },
  { label: "员工姓名", prop: "staffName" },
  { label: "岗位", prop: "postJob" },
  { label: "签订日期", prop: "signDate", width: 120 },
  { label: "合同开始日期", prop: "startDate", width: 120 },
  { label: "合同结束日期", prop: "endDate", width: 120 },
  { label: "合同年限", prop: "contractTerm", width: 90 },
  { label: "合同内容", prop: "contractContent", showOverflowTooltip: true },
  {
    label: "状态",
    prop: "staffState",
    dataType: "tag",
    formatData: (params) => {
      if (params == 0) {
        return "离职";
      } else if (params == 1) {
        return "在职";
      } else {
        return null;
      }
    },
    formatType: (params) => {
      if (params == 0) {
        return "danger";
      } else if (params == 1) {
        return "primary";
      } else {
        return null;
      }
    },
    label: "状态", prop: "status", dataType: "tag",
    formatData: (p) => statusText(p), formatType: (p) => statusType(p),
  },
  { label: "续签日期", prop: "renewDate", width: 120 },
  { label: "解除日期", prop: "terminateDate", width: 120 },
  {
    label: "员工编号",
    prop: "staffNo",
  },
  {
    label: "姓名",
    prop: "staffName",
  },
  {
    label: "性别",
    prop: "sex",
  },
  {
    label: "籍贯",
    prop: "nativePlace",
  },
  {
    label: "岗位",
    prop: "postJob",
  },
  {
    label: "家庭住址",
    prop: "adress",
  },
  {
    label: "第一学历",
    prop: "firstStudy",
  },
  {
    label: "专业",
    prop: "profession",
  },
  {
    label: "身份证号",
    prop: "identityCard",
  },
  {
    label: "年龄",
    prop: "age",
  },
  {
    label: "联系电话",
    prop: "phone",
  },
  {
    label: "紧急联系人",
    prop: "emergencyContact",
    width: 120
  },
  {
    label: "联系电话",
    prop: "emergencyContactPhone",
  },
  {
    label: "合同年限",
    prop: "contractTerm",
  },
  // {
  //   label: "合同开始日期",
  //   prop: "contractStartTime",
  //   width: 120
  // },
  {
    label: "合同结束日期",
    prop: "contractExpireTime",
    width: 120
  },
  {
    dataType: "action",
    label: "操作",
    align: "center",
    fixed: 'right',
    dataType: "action", label: "操作", align: "center", fixed: "right", width: 200,
    operation: [
      {
        name: "详情",
        type: "text",
        clickFun: (row) => {
          openForm("edit", row);
        },
      },
      { name: "编辑", type: "text", clickFun: (row) => openForm("edit", row) },
      { name: "续签", type: "text", clickFun: (row) => openRenew(row) },
      { name: "解除", type: "text", clickFun: (row) => openTerminate(row) },
    ],
  },
]);

const tableData = ref([]);
const selectedRows = ref([]);
const tableLoading = ref(false);
const page = reactive({
  current: 1,
  size: 100,
  total: 0,
});
const formDia = ref()
const { proxy } = getCurrentInstance()
const page = reactive({ current: 1, size: 100, total: 0 });
const formDia = ref();

// 查询列表
/** 搜索按钮操作 */
const handleQuery = () => {
  page.current = 1;
  getList();
const dialogFormVisible = ref(false);
const operationType = ref("");
const formRef = ref();
const form = ref({});
const rules = {
  staffName: [{ required: true, message: "请输入员工姓名", trigger: "blur" }],
  signDate: [{ required: true, message: "请选择签订日期", trigger: "change" }],
};
const pagination = (obj) => {
  page.current = obj.page;
  page.size = obj.limit;
  getList();

const openForm = (type, row) => {
  operationType.value = type;
  if (type === "add") {
    form.value = { status: 0, contractTerm: 1 };
  } else {
    form.value = { ...row };
  }
  dialogFormVisible.value = true;
};
const closeDia = () => { proxy.resetForm("formRef"); dialogFormVisible.value = false; };
const submitForm = () => {
  formRef.value.validate((valid) => {
    if (!valid) return;
    const payload = { ...form.value };
    const p = operationType.value === "add" ? contractAdd(payload) : contractUpdate(payload);
    p.then(() => {
      proxy.$modal.msgSuccess("提交成功");
      closeDia();
      getList();
    });
  });
};

const renewVisible = ref(false);
const renewForm = ref({});
const currentId = ref(null);
const openRenew = (row) => {
  currentId.value = row.id;
  renewForm.value = { renewDate: dayjs().format("YYYY-MM-DD"), renewEndDate: row.endDate, contractTerm: row.contractTerm };
  renewVisible.value = true;
};
const submitRenew = () => {
  contractRenew(currentId.value, renewForm.value).then(() => {
    proxy.$modal.msgSuccess("续签成功");
    renewVisible.value = false;
    getList();
  });
};

const terminateVisible = ref(false);
const terminateForm = ref({});
const openTerminate = (row) => {
  currentId.value = row.id;
  terminateForm.value = { terminateDate: dayjs().format("YYYY-MM-DD"), terminateReason: "" };
  terminateVisible.value = true;
};
const submitTerminate = () => {
  contractTerminate(currentId.value, terminateForm.value).then(() => {
    proxy.$modal.msgSuccess("解除成功");
    terminateVisible.value = false;
    getList();
  });
};

const handleQuery = () => { page.current = 1; getList(); };
const pagination = (obj) => { page.current = obj.page; page.size = obj.limit; getList(); };
const getList = () => {
  tableLoading.value = true;
  staffOnJobListPage({...page, ...searchForm.value,}).then(res => {
  contractListPage({ ...searchForm.value, ...page }).then((res) => {
    tableLoading.value = false;
    tableData.value = res.data.records
    tableData.value = res.data.records;
    page.total = res.data.total;
  }).catch(err => {
    tableLoading.value = false;
  })
  }).catch(() => { tableLoading.value = false; });
};
// 表格选择数据
const handleSelectionChange = (selection) => {
  selectedRows.value = selection;
};
const handleSelectionChange = (selection) => { selectedRows.value = selection; };

// 打开弹框
const openForm = (type, row) => {
  nextTick(() => {
    formDia.value?.openDialog(type, row)
  })
const handleDelete = () => {
  if (!selectedRows.value.length) { proxy.$modal.msgWarning("请选择数据"); return; }
  const ids = selectedRows.value.map((i) => i.id);
  ElMessageBox.confirm("选中的内容将被删除，是否确认删除？", "删除", {
    confirmButtonText: "确认", cancelButtonText: "取消", type: "warning",
  }).then(() => {
    contractDel(ids).then(() => { proxy.$modal.msgSuccess("删除成功"); getList(); });
  }).catch(() => { proxy.$modal.msg("已取消"); });
};
// 导出
const handleOut = () => {
  ElMessageBox.confirm("选中的内容将被导出，是否确认导出？", "导出", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
  })
      .then(() => {
        proxy.download("/staff/staffOnJob/export", {}, "合同管理.xlsx");
      })
      .catch(() => {
        proxy.$modal.msg("已取消");
      });
    confirmButtonText: "确认", cancelButtonText: "取消", type: "warning",
  }).then(() => {
    proxy.download("/staff/contract/export", { ...searchForm.value }, "合同管理.xlsx");
  }).catch(() => { proxy.$modal.msg("已取消"); });
};
onMounted(() => {
  getList();
});

onMounted(() => { getList(); });
</script>

<style scoped></style>