|
@@ -0,0 +1,338 @@
|
|
|
+<template>
|
|
|
+ <div class="card-search">
|
|
|
+ <a-form
|
|
|
+ ref="formRef"
|
|
|
+ name="advanced_search"
|
|
|
+ class="ant-advanced-search-form"
|
|
|
+ :model="searchParamsState"
|
|
|
+ >
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :span="6">
|
|
|
+ <a-form-item label="姓名" :label-col="{ span: 8 }" name="name">
|
|
|
+ <a-input v-model:value="searchParamsState.name" placeholder="" :allow-clear="true" />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="6">
|
|
|
+ <a-form-item label="所属县区" :label-col="{span:8}" name="regionCode">
|
|
|
+ <a-select
|
|
|
+ ref="select"
|
|
|
+ v-model:value="searchParamsState.regionCode"
|
|
|
+ :options="regionList"
|
|
|
+ :field-names="{ label: 'name', value: 'code' }"
|
|
|
+ :allow-clear="true"
|
|
|
+ @change="loadData"
|
|
|
+ >
|
|
|
+ </a-select>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="6">
|
|
|
+ <a-form-item label="所属驿站" :label-col="{ span: 8 }" name="siteID">
|
|
|
+ <a-select
|
|
|
+ ref="select"
|
|
|
+ v-model:value="searchParamsState.siteID"
|
|
|
+ :options="siteList"
|
|
|
+ :field-names="{ label: 'siteName', value: 'siteID' }"
|
|
|
+ :allow-clear="true"
|
|
|
+ @change="loadData"
|
|
|
+ >
|
|
|
+ </a-select>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="6" style="text-align: center;">
|
|
|
+ <a-button type="primary" html-type="submit" @click="onFinish">查询</a-button>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row :gutter="24" >
|
|
|
+ <a-col :span="6">
|
|
|
+ <a-form-item label="外出类型" :label-col="{ span: 8 }" name="signinType">
|
|
|
+ <a-select
|
|
|
+ ref="select"
|
|
|
+ v-model:value="searchParamsState.signinType"
|
|
|
+ :options="signinTypeList"
|
|
|
+ :field-names="{ label: 'name', value: 'value' }"
|
|
|
+ :allow-clear="true"
|
|
|
+ @change="loadData"
|
|
|
+ >
|
|
|
+ </a-select>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="6">
|
|
|
+ <a-form-item label="外出时间" :label-col="{ span: 8 }" name="signinDate">
|
|
|
+ <a-range-picker v-model:value="signinDate" :placeholder="['开始日期', '结束日期']" format="YYYY-MM-DD"
|
|
|
+ @change="onCreateTimeChange"/>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ <a-col :span="6">
|
|
|
+
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ <a-col :span="6" style="text-align: center;">
|
|
|
+ <BExportExcel :title="'导出'" :filename="'企业信息'"
|
|
|
+ :url="'jobusermgr/signinMgt/export'"
|
|
|
+ :params="{...exportSearchParams, isExport: true, rows:10000,signinIDList:formState.selectedRowKeys.join(',')}"></BExportExcel>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+
|
|
|
+ </a-form>
|
|
|
+ <div class="search-result-list">
|
|
|
+ <a-table
|
|
|
+ :columns="columns"
|
|
|
+ :data-source="dataList"
|
|
|
+ :scroll="{ x: '100%', y: 500 }"
|
|
|
+ :pagination="pagination"
|
|
|
+ :loading="formState.loading"
|
|
|
+ :row-selection="{ selectedRowKeys: formState.selectedRowKeys, onChange: onSelectChange }"
|
|
|
+ :row-key="(record) => record.signinId"
|
|
|
+ bordered
|
|
|
+ @change="handleTableChange"
|
|
|
+ >
|
|
|
+ <template #bodyCell="{ column, text, record }">
|
|
|
+ <template v-if="column.key === 'operation'">
|
|
|
+ <div class="table-operation">
|
|
|
+ <a-button type="link" size="small" functioncode="T01030502"
|
|
|
+ @click='onEdit(record)'>修改
|
|
|
+ </a-button>
|
|
|
+ <a-button type="link" size="small" functioncode="T01030503"
|
|
|
+ @click='onDel(record)'>删除
|
|
|
+ </a-button>
|
|
|
+ <a-button type="link" size="small" functioncode="T01030504"
|
|
|
+ @click='onForward(record)'>跟进
|
|
|
+ </a-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </a-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script lang="ts">
|
|
|
+import {reactive, ref, computed, defineComponent, createVNode} from 'vue';
|
|
|
+import type {FormInstance, TableProps, SelectProps} from 'ant-design-vue';
|
|
|
+import {getList,del} from "@/api/jobUserManager/signinMgt";
|
|
|
+import {getSysDictionaryList} from '@/api/system/dictionary';
|
|
|
+import {getPaginationTotalTitle} from '@/utils/common';
|
|
|
+import dayjs from "dayjs";
|
|
|
+import {getSiteList} from "@/api/baseSettings/siteInfo";
|
|
|
+import {get} from "@/api/common";
|
|
|
+import BExportExcel from "@/components/basic/excel/exportExcel/exportExcel.vue";
|
|
|
+import ColumnsSetting from "@/components/common/ColumnsSetting.vue";
|
|
|
+import {message, Modal} from "ant-design-vue";
|
|
|
+import {ExclamationCircleOutlined} from "@ant-design/icons-vue";
|
|
|
+import {useTabsViewStore} from "@/store/modules/tabsView";
|
|
|
+
|
|
|
+export default defineComponent({
|
|
|
+ name: 'recommendMgtList',
|
|
|
+ components: {ColumnsSetting, BExportExcel},
|
|
|
+ setup() {
|
|
|
+ const expand = ref(false);
|
|
|
+ const modalRoleUserRef = ref();
|
|
|
+ const modalRoleEditRef = ref();
|
|
|
+ const modalAddRemarkRef = ref();
|
|
|
+ const formRef = ref<FormInstance>();
|
|
|
+ const searchParamsState = reactive({
|
|
|
+ pageIndex: 1,
|
|
|
+ pageSize: 20,
|
|
|
+ name: '',
|
|
|
+ siteID: null,
|
|
|
+ regionCode: null,
|
|
|
+ signinType: null,
|
|
|
+ startDate: null,
|
|
|
+ endDate: null
|
|
|
+ });
|
|
|
+ const exportSearchParams = computed(() => {
|
|
|
+ let data = JSON.parse(JSON.stringify(searchParamsState));
|
|
|
+ data.pageSize = formState.total;
|
|
|
+ return data;
|
|
|
+ })
|
|
|
+ const formState = reactive({
|
|
|
+ total: 0,
|
|
|
+ selectedRowKeys: [],
|
|
|
+ loading: false,
|
|
|
+ });
|
|
|
+ // 原始表格定义数据
|
|
|
+ const originalColumns = [
|
|
|
+ {
|
|
|
+ title: '序号',
|
|
|
+ align: 'center',
|
|
|
+ width: 80,
|
|
|
+ key: 'recommendMgtID',
|
|
|
+ customRender: (item) =>
|
|
|
+ `${searchParamsState.pageSize * (searchParamsState.pageIndex - 1) + item.index + 1}`, isDisabled: true
|
|
|
+ },
|
|
|
+ {title: '外出人员', dataIndex: 'signinerName', key: 'signinerName', align: "center"},
|
|
|
+ {
|
|
|
+ title: '外出时间', dataIndex: 'signinTime', key: 'signinTime', align: "center",
|
|
|
+ customRender: ({record}) => dayjs(record.signinTime).format('YYYY-MM-DD')
|
|
|
+ },
|
|
|
+ {title: '所属县区', dataIndex: 'regionName', key: 'regionName', align: "center"},
|
|
|
+ {title: '所属驿站', dataIndex: 'siteName', key: 'siteName', align: "center"},
|
|
|
+ {title: '外出类型', dataIndex: 'signinTypeName', key: 'signinTypeName', align: "center"},
|
|
|
+ {title: '走访企业', dataIndex: 'companyName', key: 'companyName', align: "center"},
|
|
|
+ {title: '走访人员', dataIndex: 'jobUserName', key: 'jobUserName', align: "center"},
|
|
|
+ {title: '走访内容', dataIndex: 'content', key: 'content', align: "center", isDefaultClose: false},
|
|
|
+ {title: '操作', key: 'operation', width: 150, align: 'center', isDisabled: true, isDefaultClose: true},
|
|
|
+ ];
|
|
|
+ // 响应式表格定义
|
|
|
+ const columns = ref<Array<any>>(originalColumns.filter(item => !item.isDefaultClose));
|
|
|
+ const siteList = ref<Array<any>>([]);
|
|
|
+ const regionList = ref<SelectProps['options']>();
|
|
|
+ const signinDate = ref([]);
|
|
|
+ const pagination = computed(() => ({
|
|
|
+ total: formState.total,
|
|
|
+ current: searchParamsState.pageIndex,
|
|
|
+ pageSize: searchParamsState.pageSize,
|
|
|
+ showSizeChanger: true,
|
|
|
+ showTotal: (total) => getPaginationTotalTitle(total),
|
|
|
+ }));
|
|
|
+
|
|
|
+ const dataList = ref([]);
|
|
|
+ const signinTypeList = ref<SelectProps['options']>();
|
|
|
+
|
|
|
+ const onSelectChange = (selectedRowKeys: any) => {
|
|
|
+ formState.selectedRowKeys = selectedRowKeys;
|
|
|
+ };
|
|
|
+
|
|
|
+ const handleTableChange: TableProps['onChange'] = (pag: {
|
|
|
+ pageSize: number;
|
|
|
+ current: number;
|
|
|
+ }) => {
|
|
|
+ searchParamsState.pageIndex = pag.current;
|
|
|
+ searchParamsState.pageSize = pag.pageSize;
|
|
|
+ loadData();
|
|
|
+ };
|
|
|
+
|
|
|
+ const onFinish = () => {
|
|
|
+ loadData();
|
|
|
+ };
|
|
|
+
|
|
|
+ const tabsViewStore = useTabsViewStore();
|
|
|
+ const onEdit = (item: any) => {
|
|
|
+ tabsViewStore.addTabByPath('/jobusermgr/signinMgt/edit', {id: item.signinId});
|
|
|
+ };
|
|
|
+
|
|
|
+ const onDel = (item: any) => {
|
|
|
+ formState.selectedRowKeys = [];
|
|
|
+ if (item) {
|
|
|
+ formState.selectedRowKeys.push(item.signinId as never)
|
|
|
+ }
|
|
|
+
|
|
|
+ if (formState.selectedRowKeys.length <= 0) {
|
|
|
+ message.warning('请选择需要删除的数据!');
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ Modal.confirm({
|
|
|
+ title: '确认删除选择的外出服务信息?',
|
|
|
+ icon: createVNode(ExclamationCircleOutlined),
|
|
|
+ content: '',
|
|
|
+ okText: '确认删除',
|
|
|
+ okType: 'danger',
|
|
|
+ okButtonProps: {},
|
|
|
+ cancelText: '取消',
|
|
|
+ onOk() {
|
|
|
+ del(formState.selectedRowKeys).then(() => {
|
|
|
+ loadData();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ onCancel() {
|
|
|
+ formState.selectedRowKeys = [];
|
|
|
+ },
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ const onForward = (item:any) =>{
|
|
|
+ console.log(item)
|
|
|
+ }
|
|
|
+
|
|
|
+ function getAllSites() {
|
|
|
+ getSiteList({pageIndex: 1, pageSize: 9999}).then((result: any) => {
|
|
|
+ siteList.value = result.list;
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ function getAllRegion() {
|
|
|
+ get('system/area/getCityList', {}).then(data => {
|
|
|
+ regionList.value = data;
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ const loadData = async function () {
|
|
|
+ formState.loading = true;
|
|
|
+ const result: any = await getList(searchParamsState);
|
|
|
+
|
|
|
+ dataList.value = result.list;
|
|
|
+ console.log(dataList.value);
|
|
|
+ formState.total = result.total;
|
|
|
+ formState.loading = false;
|
|
|
+ };
|
|
|
+
|
|
|
+
|
|
|
+ const theModalClosed = (d) => {
|
|
|
+ if (d) {
|
|
|
+ loadData();
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ const getSigninTypeList = () => {
|
|
|
+ getSysDictionaryList('SigninType').then((data) => {
|
|
|
+ signinTypeList.value = data;
|
|
|
+ });
|
|
|
+ };
|
|
|
+
|
|
|
+ const onCreateTimeChange = (dateString) => {
|
|
|
+ signinDate.value = dateString;
|
|
|
+ searchParamsState.startDate = dateString ? dateString[0].format("YYYY-MM-DD") : '';
|
|
|
+ searchParamsState.endDate = dateString ? dateString[1].format("YYYY-MM-DD") : '';
|
|
|
+ loadData();
|
|
|
+ }
|
|
|
+
|
|
|
+ function columnsCheckSub(columnsKeys: Array<string>) {
|
|
|
+ columns.value = originalColumns.filter((item: any) => columnsKeys.includes(item.key));
|
|
|
+ }
|
|
|
+
|
|
|
+ return {
|
|
|
+ modalRoleUserRef,
|
|
|
+ modalRoleEditRef,
|
|
|
+ modalAddRemarkRef,
|
|
|
+ formRef,
|
|
|
+ loadData,
|
|
|
+ searchParamsState,
|
|
|
+ exportSearchParams,
|
|
|
+ formState,
|
|
|
+ columns,
|
|
|
+ originalColumns,
|
|
|
+ columnsCheckSub,
|
|
|
+ pagination,
|
|
|
+ dataList,
|
|
|
+ signinTypeList,
|
|
|
+ theModalClosed,
|
|
|
+ onSelectChange,
|
|
|
+ handleTableChange,
|
|
|
+ onFinish,
|
|
|
+ getSigninTypeList,
|
|
|
+ expand,
|
|
|
+ siteList,
|
|
|
+ regionList,
|
|
|
+ getAllSites,
|
|
|
+ getAllRegion,
|
|
|
+ signinDate,
|
|
|
+ onCreateTimeChange,
|
|
|
+ onEdit,
|
|
|
+ onDel,
|
|
|
+ onForward
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.loadData();
|
|
|
+ this.getSigninTypeList();
|
|
|
+ this.getAllSites();
|
|
|
+ this.getAllRegion();
|
|
|
+ },
|
|
|
+ activated() {
|
|
|
+ if (history.state.params?.reload) this.loadData();
|
|
|
+ },
|
|
|
+});
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped></style>
|