wulin/management_UI
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

youhua

Browse Source
This commit is contained in:
熊成强 2020-10-22 18:47:07 +08:00
commit c486ebc5a0
3 changed files with 141 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/main.js
View File

@ -9,8 +9,13 @@ import './utils/permission'
import './style/index.less'
import {debounce, departGetForm, personlGetForm} from '@/utils/common'
import '@/icons'
import {
format
} from '@/utils/dateFormat'
console.log('store: ', store)
Vue.config.productionTip = false
Vue.prototype.$format = format
Vue.prototype.debounce = debounce
Vue.prototype.$personlGetForm = personlGetForm
Vue.prototype.$departGetForm = departGetForm
@ -20,6 +25,8 @@ new Vue({
el: '#app',
router,
store,
components: { App },
components: {
App
},
template: '<App/>'
})

27
src/utils/dateFormat.js Normal file
View File

@ -0,0 +1,27 @@
// 日期格式化
export const format = (now, fmt = 'yyyy-MM-dd') => {
if (typeof now === 'string') {
now = now.replace(/-/g, '/')
}
now = new Date(now)
const o = {
'M+': now.getMonth() + 1, // 月份
'd+': now.getDate(), // 日
'h+': now.getHours(), // 小时
'H+': now.getHours(), // 小时
'm+': now.getMinutes(), // 分
's+': now.getSeconds(), // 秒
'q+': Math.floor((now.getMonth() + 3) / 3), // 季度
'S': now.getMilliseconds() // 毫秒
}
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (now.getFullYear() + '').substr(4 - RegExp.$1.length))
}
for (let k in o) {
if (new RegExp('(' + k + ')').test(fmt)) {
fmt = fmt.replace(RegExp.$1, String(o[k]).padStart(RegExp.$1.length, 0))
}
}
return fmt
}

140
src/views/kpi/workbench/initiateAssessment/index.vue
View File

@ -1,36 +1,96 @@
<template>
<div class="initiate-assessment">
<el-form :v-model="formData" :rules="formRules" label-width="150px" label-position="left" label-suffix="：" size="mini">
<el-form
:v-model="formData"
:rules="formRules"
label-width="150px"
label-position="left"
label-suffix="："
size="mini"
>
<div class="title">基本信息</div>
<el-form-item label="周期类型" prop="cycleTimeType" >
<el-form-item
label="周期类型"
prop="cycleTimeType"
>
<el-radio-group v-model="formData.cycleTimeType">
<el-radio :label="1">月度</el-radio>
<el-radio :label="2">自定义</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="时间周期" required>
<!-- month':'daterange -->
<el-date-picker v-if="formData.cycleTimeType===1" v-model="formData.rangDate" type="month" key="month"> </el-date-picker>
<el-date-picker v-else v-model="formData.rangDate" type="daterange" key="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"> </el-date-picker>
<el-form-item
label="时间周期"
required
>
<el-date-picker
@change="handleChangeRangDate"
v-model="formData.rangDate"
:type="formData.cycleTimeType === 1 ? 'month' : 'monthrange'"
:key="formData.cycleTimeType === 1 ? 'month' : 'monthrange'"
value-format="yyyy-MM"
>
</el-date-picker>
</el-form-item>
<div class="choose-group">
<el-form-item
v-if="formData.rangDate"
label="考核合并"
required
>
<el-radio
v-model="formData.mergeType.type"
:label="1"
>新发起考核
<el-input
v-model="formData.mergeType.name"
:disabled="formData.cycleTimeType===1"
maxlength="30"
show-word-limit
></el-input>
</el-radio>
</el-form-item>
<div class="choose-group">
<div class="title">被考核对象</div>
<el-form-item label="参与考评组">
<div class="line-space"><el-button @click="handleChooseGroup">请选择</el-button></div>
<div>
<el-button @click="handleChooseGroup">请选择</el-button>
</div>
<div class="line-space">
<el-table :data="formData.assessmentList" :header-cell-style="{ 'background-color': '#f5f5f5'}">
<el-table-column label="考核组名称" prop="name"></el-table-column>
<el-table-column label="周期类型" prop="cycleType"></el-table-column>
<el-table-column label="参与人数" prop="personNumber"></el-table-column>
<el-table
v-if="formData.assessmentList.length>0"
:data="formData.assessmentList"
:header-cell-style="{ 'background-color': '#f5f5f5' }"
>
<el-table-column
label="考核组名称"
prop="name"
></el-table-column>
<el-table-column
label="周期类型"
prop="cycleType"
></el-table-column>
<el-table-column
label="参与人数"
prop="personNumber"
></el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button type="text" @click.native.prevent="handleGroupDelete(scope.$index, formData.assessmentList)" plain>删除</el-button>
<el-button
type="text"
@click.native.prevent="
handleGroupDelete(scope.$index, formData.assessmentList)
"
plain
>删除</el-button>
</template>
</el-table-column>
</el-table-column>
</el-table>
</div>
<div class="line-space">
<el-button type="primary" @click="handleSubmit">确定</el-button>
<el-button
type="primary"
@click="handleSubmit"
>确定</el-button>
</div>
</el-form-item>
</div>
@ -51,7 +111,11 @@ export default {
cycleType: '月度',
personNumber: '12人'
}
] // 考核对象
], // 考核对象
mergeType: { // 考核合并类型
type: 1,
name: '' // 合并 id 新发起无效
}
},
formRules: {
cycleTimeType: { required: true, message: '请选择周期类型', trigger: 'blur' },
@ -61,11 +125,20 @@ export default {
},
watch: {
'formData.cycleTimeType': function (newVal, oldVal) {
console.log(this.formData.cycleTimeType)
// console.log(this.formData.cycleTimeType)
this.formData.rangDate = ''
}
},
methods: {
handleChangeRangDate (chgVal) {
let nameStr = this.$format(chgVal, 'yyyy年MM月绩效考核')
if (this.formData.cycleTimeType === 2) {
// 自定义
nameStr = chgVal[0] + '至' + chgVal[1] + '绩效考核'
}
this.formData.mergeType.name = nameStr
// console.log(this.formData.rangDate)
},
handleChooseGroup () {
this.showChooseList = !this.showChooseList
},
@ -80,22 +153,21 @@ export default {
</script>
<style lang="less" scoped>
.initiate-assessment {
padding: 25px;
background-color: white;
min-height: 600px;
font-size: 14;
color: #333;
.title {
font-size: 22;
color:black;
margin-bottom: 15px;
}
.choose-group {
margin-top: 150px;
}
.line-space {
margin-top: 10px;
}
padding: 25px;
background-color: white;
min-height: 600px;
font-size: 14;
color: #333;
.title {
font-size: 22;
color: black;
margin-bottom: 25px;
}
.choose-group {
margin-top: 150px;
}
.line-space {
margin-top: 20px;
}
}
</style>