|
@@ -1,12 +1,126 @@
|
|
<template>
|
|
<template>
|
|
<div>
|
|
<div>
|
|
-
|
|
|
|
|
|
+ <m-search :items="searchItems" v-model="searchValues" class="mb-3" @search="onSearch"></m-search>
|
|
|
|
+ <m-table
|
|
|
|
+ :items="items"
|
|
|
|
+ :headers="headers"
|
|
|
|
+ :loading="loading"
|
|
|
|
+ :total="total"
|
|
|
|
+ :page-size="pageInfo.size"
|
|
|
|
+ :page-current="pageInfo.current"
|
|
|
|
+ @page-change="onPageChange"
|
|
|
|
+ ></m-table>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
|
+import { dateFormat } from '@/utils/date'
|
|
|
|
+import {
|
|
|
|
+ getComparisonSchemeList,
|
|
|
|
+ getComparisonSchemeDict
|
|
|
|
+} from '@/api/salary'
|
|
export default {
|
|
export default {
|
|
- name: 'salary-option-comparison'
|
|
|
|
|
|
+ name: 'salary-option-comparison',
|
|
|
|
+ data () {
|
|
|
|
+ return {
|
|
|
|
+ searchValues: {
|
|
|
|
+ month: dateFormat('YYYY-mm', new Date()),
|
|
|
|
+ organizationName: null,
|
|
|
|
+ employeeName: null
|
|
|
|
+ },
|
|
|
|
+ headers: [
|
|
|
|
+ { type: 'expand', prop: 'expand' },
|
|
|
|
+ { label: '机构', prop: 'organizationName' },
|
|
|
|
+ { label: '姓名', prop: 'employeeName' },
|
|
|
|
+ { label: '统一认证号', prop: 'unifiedCertificationNumber' },
|
|
|
|
+ { label: '月份', prop: 'month' }
|
|
|
|
+ // { label: '操作', prop: 'action', align: 'center', width: 100 }
|
|
|
|
+ ],
|
|
|
|
+ items: [
|
|
|
|
+ ],
|
|
|
|
+ loading: false,
|
|
|
|
+ total: 0,
|
|
|
|
+ pageInfo: {
|
|
|
|
+ current: 1,
|
|
|
|
+ size: 10
|
|
|
|
+ },
|
|
|
|
+ selectLoading: false,
|
|
|
|
+ selectItems: []
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ computed: {
|
|
|
|
+ searchItems () {
|
|
|
|
+ return [
|
|
|
|
+ {
|
|
|
|
+ label: '月份',
|
|
|
|
+ prop: 'month',
|
|
|
|
+ type: 'datePicker',
|
|
|
|
+ option: {
|
|
|
|
+ editable: false,
|
|
|
|
+ clearable: false,
|
|
|
|
+ placeholder: '请选择月份',
|
|
|
|
+ type: 'month',
|
|
|
|
+ valueFormat: 'yyyy-MM',
|
|
|
|
+ format: 'yyyy 年 MM 月'
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label: '方案',
|
|
|
|
+ prop: 'versions',
|
|
|
|
+ type: 'autocomplete',
|
|
|
|
+ option: {
|
|
|
|
+ placeholder: '请选择方案',
|
|
|
|
+ multiple: true,
|
|
|
|
+ filterable: true,
|
|
|
|
+ remote: true,
|
|
|
|
+ labelText: 'employeeName',
|
|
|
|
+ labelValue: 'personnelCode',
|
|
|
|
+ remoteMethod: this.remoteMethod,
|
|
|
|
+ valueKey: 'personnelCode',
|
|
|
|
+ defaultFirstOption: true,
|
|
|
|
+ loading: this.selectLoading,
|
|
|
|
+ items: this.selectItems
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ ]
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ async onInit () {
|
|
|
|
+ try {
|
|
|
|
+ const { data } = await getComparisonSchemeList({
|
|
|
|
+ month: this.searchValues.month
|
|
|
|
+
|
|
|
|
+ })
|
|
|
|
+ console.log(data)
|
|
|
|
+ } catch (error) {
|
|
|
|
+ this.$message.error(error)
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ onSearch () {
|
|
|
|
+ this.pageInfo.current = 1
|
|
|
|
+ this.onInit()
|
|
|
|
+ },
|
|
|
|
+ onPageChange (index) {
|
|
|
|
+ this.pageInfo.current = index
|
|
|
|
+ this.onInit()
|
|
|
|
+ },
|
|
|
|
+ async remoteMethod (version) {
|
|
|
|
+ this.selectLoading = true
|
|
|
|
+ try {
|
|
|
|
+ const { data } = await getComparisonSchemeDict({
|
|
|
|
+ version,
|
|
|
|
+ month: this.searchValues.month
|
|
|
|
+ })
|
|
|
|
+ this.selectItems = data.records
|
|
|
|
+ } catch (error) {
|
|
|
|
+ this.selectItems = []
|
|
|
|
+ this.$message.error(error)
|
|
|
|
+ } finally {
|
|
|
|
+ this.selectLoading = false
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|
|
|
|
|