|
@@ -3,41 +3,126 @@
|
|
|
<div class="title-container">
|
|
|
<breadcrumb id="breadcrumb-container" class="breadcrumb-container"/>
|
|
|
</div>
|
|
|
- <div style="padding-top: 30px;">
|
|
|
- <el-tabs v-model="activeName">
|
|
|
- <el-tab-pane :label="itemName +'【排期】' " name="first" class="pane">
|
|
|
- <el-form ref="postForm" :model="postForm" class="form-container" style="padding-left: 100px">
|
|
|
- <div class="postInfo-container">
|
|
|
- <el-row>
|
|
|
- <el-col>
|
|
|
- <el-form-item
|
|
|
- label="阶段名称:"
|
|
|
- prop="name"
|
|
|
- label-width="180px"
|
|
|
- class="postInfo-container-item"
|
|
|
- >
|
|
|
- <el-input type="text" v-model="postForm.name" class="filter-item" />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
+ <y-detail-page-layout-back :edit-status="true" v-loading="vLoading" element-loading-text="处理中。。。" :list-query="listQuery">
|
|
|
+ <div style="padding-top: 30px;">
|
|
|
+ <el-tabs v-model="activeName">
|
|
|
+ <el-tab-pane :label="itemName +'【排期】' " name="first" class="pane">
|
|
|
+ <el-form ref="postForm" :model="postForm" class="form-container" style="padding-left: 100px">
|
|
|
<div class="postInfo-container">
|
|
|
<el-row>
|
|
|
<el-col>
|
|
|
- <el-form-item label="上个阶段:"
|
|
|
- prop="headerId"
|
|
|
+ <el-form-item
|
|
|
+ label="阶段名称:"
|
|
|
+ prop="name"
|
|
|
+ label-width="180px"
|
|
|
+ class="postInfo-container-item"
|
|
|
+ >
|
|
|
+ <el-input type="text" v-model="postForm.name" class="filter-item" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <div class="postInfo-container">
|
|
|
+ <el-row>
|
|
|
+ <el-col>
|
|
|
+ <el-form-item label="上个阶段:"
|
|
|
+ prop="headerId"
|
|
|
+ label-width="180px"
|
|
|
+ class="postInfo-container-item">
|
|
|
+ <el-select
|
|
|
+ v-model="postForm.headerId"
|
|
|
+ placeholder=""
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ class="filter-item"
|
|
|
+ >
|
|
|
+ <el-option v-for="item in stages"
|
|
|
+ :key="item.footerId"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.footerId"/>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ <div class="postInfo-container">
|
|
|
+ <el-row>
|
|
|
+ <el-col>
|
|
|
+ <el-form-item
|
|
|
+ label="阶段目标:"
|
|
|
+ prop="target"
|
|
|
+ label-width="180px"
|
|
|
+ class="postInfo-container-item"
|
|
|
+ >
|
|
|
+ <el-input type="text" v-model="postForm.target" class="filter-item"/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="postInfo-container">
|
|
|
+ <el-row>
|
|
|
+ <el-col >
|
|
|
+ <el-form-item
|
|
|
+ label="开始日期:"
|
|
|
+ prop="startDate"
|
|
|
+ :rules="{required: true, message: '请选择日志日期', trigger: 'blur'}"
|
|
|
+ label-width="180px"
|
|
|
+ class="postInfo-container-item"
|
|
|
+ >
|
|
|
+ <el-date-picker
|
|
|
+ v-model="postForm.startDate"
|
|
|
+ type="date"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ placeholder="选择日期"
|
|
|
+ class="filter-item"
|
|
|
+ style="width: 200px"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ <div class="postInfo-container">
|
|
|
+ <el-row>
|
|
|
+ <el-col>
|
|
|
+ <el-form-item
|
|
|
+ label="结束日期:"
|
|
|
+ prop="endDate"
|
|
|
+ :rules="{required: true, message: '请选择日志日期', trigger: 'blur'}"
|
|
|
+ label-width="180px"
|
|
|
+ class="postInfo-container-item"
|
|
|
+ >
|
|
|
+ <el-date-picker
|
|
|
+ v-model="postForm.endDate"
|
|
|
+ type="date"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ placeholder="选择日期"
|
|
|
+ class="filter-item"
|
|
|
+ style="width: 200px"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ <div class="postInfo-container">
|
|
|
+ <el-row>
|
|
|
+ <el-col>
|
|
|
+ <el-form-item label="负责人:"
|
|
|
+ prop="endDate"
|
|
|
label-width="180px"
|
|
|
class="postInfo-container-item">
|
|
|
<el-select
|
|
|
- v-model="postForm.headerId"
|
|
|
+ v-model="postForm.dutyerId"
|
|
|
placeholder=""
|
|
|
clearable
|
|
|
filterable
|
|
|
class="filter-item"
|
|
|
>
|
|
|
- <el-option v-for="item in stages"
|
|
|
- :key="item.footerId"
|
|
|
- :label="item.name"
|
|
|
- :value="item.footerId"/>
|
|
|
+ <el-option
|
|
|
+ v-for="item in users"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
@@ -47,229 +132,148 @@
|
|
|
<el-row>
|
|
|
<el-col>
|
|
|
<el-form-item
|
|
|
- label="阶段目标:"
|
|
|
- prop="target"
|
|
|
+ label="阶段权重:"
|
|
|
+ prop="weight"
|
|
|
+ :rules="{required: true, message: '请填写阶段权重(0-100)', trigger: 'blur'}"
|
|
|
label-width="180px"
|
|
|
class="postInfo-container-item"
|
|
|
>
|
|
|
- <el-input type="text" v-model="postForm.target" class="filter-item"/>
|
|
|
+ <el-input type="text" v-model="postForm.weight" class="filter-item" placeholder="计算参与人员提成">
|
|
|
+ <i slot="suffix" style="font-size:normal;margin-right: 10px;line-height: 30px">%</i>
|
|
|
+ </el-input>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div class="postInfo-container">
|
|
|
- <el-row>
|
|
|
- <el-col >
|
|
|
- <el-form-item
|
|
|
- label="开始日期:"
|
|
|
- prop="startDate"
|
|
|
- :rules="{required: true, message: '请选择日志日期', trigger: 'blur'}"
|
|
|
- label-width="180px"
|
|
|
- class="postInfo-container-item"
|
|
|
- >
|
|
|
- <el-date-picker
|
|
|
- v-model="postForm.startDate"
|
|
|
- type="date"
|
|
|
- value-format="yyyy-MM-dd"
|
|
|
- placeholder="选择日期"
|
|
|
- class="filter-item"
|
|
|
- style="width: 200px"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </div>
|
|
|
- <div class="postInfo-container">
|
|
|
- <el-row>
|
|
|
- <el-col>
|
|
|
- <el-form-item
|
|
|
- label="结束日期:"
|
|
|
- prop="endDate"
|
|
|
- :rules="{required: true, message: '请选择日志日期', trigger: 'blur'}"
|
|
|
- label-width="180px"
|
|
|
- class="postInfo-container-item"
|
|
|
- >
|
|
|
- <el-date-picker
|
|
|
- v-model="postForm.endDate"
|
|
|
- type="date"
|
|
|
- value-format="yyyy-MM-dd"
|
|
|
- placeholder="选择日期"
|
|
|
- class="filter-item"
|
|
|
- style="width: 200px"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </div>
|
|
|
- <div class="postInfo-container">
|
|
|
- <el-row>
|
|
|
- <el-col>
|
|
|
- <el-form-item label="负责人:"
|
|
|
- prop="endDate"
|
|
|
- label-width="180px"
|
|
|
- class="postInfo-container-item">
|
|
|
- <el-select
|
|
|
- v-model="postForm.dutyerId"
|
|
|
- placeholder=""
|
|
|
- clearable
|
|
|
- filterable
|
|
|
- class="filter-item"
|
|
|
+ <div class="postInfo-container">
|
|
|
+ <el-row>
|
|
|
+ <el-col>
|
|
|
+ <el-form-item
|
|
|
+ label="逾期提成系数:"
|
|
|
+ prop="coefficient"
|
|
|
+ :rules="{required: true, message: '请填写逾期提成系数(0-100)', trigger: 'blur'}"
|
|
|
+ label-width="180px"
|
|
|
+ class="postInfo-container-item"
|
|
|
>
|
|
|
- <el-option
|
|
|
- v-for="item in users"
|
|
|
- :key="item.id"
|
|
|
- :label="item.name"
|
|
|
- :value="item.id"
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </div>
|
|
|
- <div class="postInfo-container">
|
|
|
- <el-row>
|
|
|
- <el-col>
|
|
|
- <el-form-item
|
|
|
- label="阶段权重:"
|
|
|
- prop="weight"
|
|
|
- :rules="{required: true, message: '请填写阶段权重(0-100)', trigger: 'blur'}"
|
|
|
- label-width="180px"
|
|
|
- class="postInfo-container-item"
|
|
|
- >
|
|
|
- <el-input type="text" v-model="postForm.weight" class="filter-item" placeholder="计算参与人员提成">
|
|
|
- <i slot="suffix" style="font-size:normal;margin-right: 10px;line-height: 30px">%</i>
|
|
|
- </el-input>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </div>
|
|
|
- <div class="postInfo-container">
|
|
|
- <el-row>
|
|
|
- <el-col>
|
|
|
- <el-form-item
|
|
|
- label="逾期提成系数:"
|
|
|
- prop="coefficient"
|
|
|
- :rules="{required: true, message: '请填写逾期提成系数(0-100)', trigger: 'blur'}"
|
|
|
- label-width="180px"
|
|
|
- class="postInfo-container-item"
|
|
|
- >
|
|
|
- <el-input type="text" v-model="postForm.coefficient" class="filter-item" placeholder="计算参与人员提成">
|
|
|
- <i slot="suffix" style="font-size:normal;margin-right: 10px;line-height: 30px">%</i>
|
|
|
- </el-input>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </div>
|
|
|
- <div class="postInfo-container">
|
|
|
- <el-form-item
|
|
|
- label="参与人员:"
|
|
|
- prop="remark"
|
|
|
- label-width="180px"
|
|
|
- class="postInfo-container-item"
|
|
|
- >
|
|
|
- <el-button type="primary" icon="el-icon-edit" class="filter-item" @click="openJoiner" >设置</el-button>
|
|
|
- </el-form-item>
|
|
|
- <el-dialog
|
|
|
- width="600px"
|
|
|
- :title=" '['+title+']参与人员提成系数设置'"
|
|
|
- :visible.sync="dialogFormVisible"
|
|
|
- :close-on-click-modal="true"
|
|
|
- custom-class="customClass"
|
|
|
- >
|
|
|
- <el-alert
|
|
|
- title="打勾并设置提成系数有效,否则无效。"
|
|
|
- type="info"
|
|
|
- show-icon
|
|
|
- :closable="false">
|
|
|
- </el-alert>
|
|
|
- <y-page-list-layout :get-page-list="getJoinUsers" >
|
|
|
- <el-table
|
|
|
- slot="table"
|
|
|
- row-key="id"
|
|
|
- :data="joinUsers"
|
|
|
- ref="multipleTable"
|
|
|
- :header-row-style="{color: '#333333'}"
|
|
|
- @selection-change="handleSelectionChange"
|
|
|
- style="border-left: 1px solid #EBECED;border-right: 1px solid #EBECED;color: #333333;"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- type="selection"
|
|
|
- width="55">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="人员" width="100" align="center">
|
|
|
- <template slot-scope="{row}">
|
|
|
- <span>{{ row.userName }}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="提成系数" align="center">
|
|
|
- <template slot-scope="{row}">
|
|
|
- <el-input v-model="row.weight" placeholder="请输入数字">
|
|
|
- <i slot="suffix" style="font-size:normal;margin-right: 10px;line-height: 30px">%</i>
|
|
|
- </el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </y-page-list-layout>
|
|
|
- </el-dialog>
|
|
|
- </div>
|
|
|
- <div class="postInfo-container">
|
|
|
- <el-row>
|
|
|
- <el-col>
|
|
|
- <el-form-item
|
|
|
- label="备注信息:"
|
|
|
- prop="remark"
|
|
|
- label-width="180px"
|
|
|
- class="postInfo-container-item"
|
|
|
- >
|
|
|
- <el-input type="textarea" v-model="postForm.remark" class="filter-item" placeholder="200字符"/>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </div>
|
|
|
- <el-button type="success" id="addNode" @click="saveNode">保存</el-button>
|
|
|
- <el-button type="normal" @click="clean">清空</el-button>
|
|
|
- </el-form>
|
|
|
- <div class="nodeFlow">
|
|
|
- <div style="height: 300px;">
|
|
|
- <el-timeline v-if="stageFlow.length>0">
|
|
|
- <el-timeline-item v-for="(s,index) in stageFlow" :key="index" :timestamp="s.name" placement="top" color="green"
|
|
|
- @click.native="getDetail(s.id)">
|
|
|
- <el-card class="card">
|
|
|
- <div class="it">
|
|
|
- <icon class="el-icon-s-flag"/> <el-tag type="success">{{s.target}}</el-tag>
|
|
|
- </div>
|
|
|
- <div class="it">
|
|
|
- <icon class="el-icon-time"/> <el-tag>{{s.startDate}}</el-tag> 至 <el-tag>{{s.endDate}}</el-tag>
|
|
|
- </div>
|
|
|
- <div v-if="s.weight" class="it">
|
|
|
- <icon class="el-icon-coin"/> <el-tag type="danger">{{s.weight}}%</el-tag>
|
|
|
- </div>
|
|
|
- <div v-if="s.dutyer" class="it">
|
|
|
- <icon class="el-icon-user-solid"/> <el-tag>{{s.dutyer}}</el-tag>
|
|
|
- </div>
|
|
|
- <div v-if="s.participated" >
|
|
|
- <span v-for="(p,index) in s.participated" :key="index" class="it">
|
|
|
- <icon class="el-icon-user"/> <el-tag>{{p.userName}} : {{p.weight}}%</el-tag>
|
|
|
- </span>
|
|
|
- </div>
|
|
|
- <el-button class="del" type="danger" icon="el-icon-delete" @click="remove(s.id)"/>
|
|
|
- </el-card>
|
|
|
- </el-timeline-item>
|
|
|
- </el-timeline>
|
|
|
+ <el-input type="text" v-model="postForm.coefficient" class="filter-item" placeholder="计算参与人员提成">
|
|
|
+ <i slot="suffix" style="font-size:normal;margin-right: 10px;line-height: 30px">%</i>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ <div class="postInfo-container">
|
|
|
+ <el-form-item
|
|
|
+ label="参与人员:"
|
|
|
+ prop="remark"
|
|
|
+ label-width="180px"
|
|
|
+ class="postInfo-container-item"
|
|
|
+ >
|
|
|
+ <el-button type="primary" icon="el-icon-edit" class="filter-item" @click="openJoiner" >设置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ <el-dialog
|
|
|
+ width="600px"
|
|
|
+ :title=" '['+title+']参与人员提成系数设置'"
|
|
|
+ :visible.sync="dialogFormVisible"
|
|
|
+ :close-on-click-modal="true"
|
|
|
+ custom-class="customClass"
|
|
|
+ >
|
|
|
+ <el-alert
|
|
|
+ title="打勾并设置提成系数有效,否则无效。"
|
|
|
+ type="info"
|
|
|
+ show-icon
|
|
|
+ :closable="false">
|
|
|
+ </el-alert>
|
|
|
+ <y-page-list-layout :get-page-list="getJoinUsers" >
|
|
|
+ <el-table
|
|
|
+ slot="table"
|
|
|
+ row-key="id"
|
|
|
+ :data="joinUsers"
|
|
|
+ ref="multipleTable"
|
|
|
+ :header-row-style="{color: '#333333'}"
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
+ style="border-left: 1px solid #EBECED;border-right: 1px solid #EBECED;color: #333333;"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ type="selection"
|
|
|
+ width="55">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="人员" width="100" align="center">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span>{{ row.userName }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="提成系数" align="center">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <el-input v-model="row.weight" placeholder="请输入数字">
|
|
|
+ <i slot="suffix" style="font-size:normal;margin-right: 10px;line-height: 30px">%</i>
|
|
|
+ </el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </y-page-list-layout>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+ <div class="postInfo-container">
|
|
|
+ <el-row>
|
|
|
+ <el-col>
|
|
|
+ <el-form-item
|
|
|
+ label="备注信息:"
|
|
|
+ prop="remark"
|
|
|
+ label-width="180px"
|
|
|
+ class="postInfo-container-item"
|
|
|
+ >
|
|
|
+ <el-input type="textarea" v-model="postForm.remark" class="filter-item" placeholder="200字符"/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ <el-button type="success" id="addNode" @click="saveNode">保存</el-button>
|
|
|
+ <el-button type="normal" @click="clean">清空</el-button>
|
|
|
+ </el-form>
|
|
|
+ <div class="nodeFlow">
|
|
|
+ <div style="height: 300px;">
|
|
|
+ <el-timeline v-if="stageFlow.length>0">
|
|
|
+ <el-timeline-item v-for="(s,index) in stageFlow" :key="index" :timestamp="s.name" placement="top" color="green"
|
|
|
+ @click.native="getDetail(s.id)">
|
|
|
+ <el-card class="card">
|
|
|
+ <div class="it">
|
|
|
+ <icon class="el-icon-s-flag"/> <el-tag type="success">{{s.target}}</el-tag>
|
|
|
+ </div>
|
|
|
+ <div class="it">
|
|
|
+ <icon class="el-icon-time"/> <el-tag>{{s.startDate}}</el-tag> 至 <el-tag>{{s.endDate}}</el-tag>
|
|
|
+ </div>
|
|
|
+ <div v-if="s.weight" class="it">
|
|
|
+ <icon class="el-icon-coin"/> <el-tag type="danger">{{s.weight}}%</el-tag>
|
|
|
+ </div>
|
|
|
+ <div v-if="s.dutyer" class="it">
|
|
|
+ <icon class="el-icon-user-solid"/> <el-tag>{{s.dutyer}}</el-tag>
|
|
|
+ </div>
|
|
|
+ <div v-if="s.participated" >
|
|
|
+ <span v-for="(p,index) in s.participated" :key="index" class="it">
|
|
|
+ <icon class="el-icon-user"/> <el-tag>{{p.userName}} : {{p.weight}}%</el-tag>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <el-button class="del" type="danger" icon="el-icon-delete" @click="remove(s.id)"/>
|
|
|
+ </el-card>
|
|
|
+ </el-timeline-item>
|
|
|
+ </el-timeline>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
- </div>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ </div>
|
|
|
+ </y-detail-page-layout-back>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import Breadcrumb from '@/components/Breadcrumb'
|
|
|
+ import YDetailPageLayoutBack from '@/components/YDetailPageLayout/back'
|
|
|
export default {
|
|
|
name: 'itemDetail',
|
|
|
components: {
|
|
|
Breadcrumb,
|
|
|
+ YDetailPageLayoutBack
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
@@ -285,7 +289,7 @@
|
|
|
id:null,
|
|
|
activeName: 'first',
|
|
|
vLoading: false,
|
|
|
- listQuery:{},
|
|
|
+ listQuery:null,
|
|
|
filterMethod(query, item) {
|
|
|
return item.label.indexOf(query) > -1;
|
|
|
},
|
|
@@ -299,6 +303,7 @@
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
+ this.listQuery = this.$route.query.listQuery;
|
|
|
this.getFlow();
|
|
|
this.getSimpleAll();
|
|
|
this.$api.user.simpleAll().then(res => {
|