index.vue 72 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627
  1. <template>
  2. <section>
  3. <el-col :span="4" class="left" :style="'height:'+ (tableHeight + 113) + 'px'">
  4. <div class="department">
  5. <span><i class="iconfont firerock-iconzuzhijiegou" style="font-size:10px;" ></i>&nbsp;部门</span>
  6. <div v-on:click="createDepartment(-1)">
  7. <i class="fa fa-plus-circle"></i>
  8. 创建
  9. </div>
  10. </div>
  11. <el-divider style="margin: 0px 0px !important;height:0.5px;"></el-divider>
  12. <div class="tree" :style="'height:'+ (tableHeight + 83) + 'px'">
  13. <!-- <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" accordion></el-tree> -->
  14. <el-tree :data="data" :props="defaultProps" node-key="id" :expand-on-click-node="false" accordion @node-click="handleNodeClick" :default-expanded-keys="jDarr" @node-expand="jieDian" @node-collapse="shutDown" @current-change="chufa">
  15. <span class="custom-tree-node" slot-scope="{ node }" @mouseleave= mouseleave(data,$event) @mouseover= mouseover(data,$event)>
  16. <span style="width: 100%;line-height: 36px; display: inline-block;">{{ node.label }}</span>
  17. <span v-if="node.label != '全部人员'" class="node none">
  18. <el-button type="text" size="mini" @click="createDepartment(-2)" >
  19. <i class="el-icon-circle-plus-outline"></i> <!-- 新增 -->
  20. </el-button>
  21. <el-button type="text" size="mini" @click="deleteDep(null)">
  22. <i class="el-icon-delete"></i> <!-- 删除 -->
  23. </el-button>
  24. </span>
  25. </span>
  26. </el-tree>
  27. </div>
  28. </el-col>
  29. <el-col :span="20" class="right">
  30. <!--工具条-->
  31. <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
  32. <el-form :inline="true">
  33. <!-- <div style="width: 300px;display: inline-block;">
  34. <el-input v-model="keyword" class="input-with-select" placeholder="请输入人员名字搜索" clearable="true">
  35. <el-button slot="append" @click="searchList" icon="el-icon-search"></el-button>
  36. </el-input>
  37. </div> -->
  38. <el-form-item>
  39. <div v-if="depData == null || depData.id == -1" class="nowTime" style="cursor:unset">
  40. <i class="fa fa-home"></i>全部人员
  41. </div>
  42. <div v-else-if="depData.id == 0" class="nowTime" style="cursor:unset">
  43. <i class="fa fa-home"></i>未分配
  44. </div>
  45. <div v-else-if="depData != null && depData.id != -1 && depData.id != 0" class="nowTime" @click="createDepartment(0)">
  46. <i class="fa fa-pencil-square-o"></i>
  47. {{depData!=null?depData.label:''}}
  48. </div>
  49. </el-form-item>
  50. <el-form-item>
  51. <div style="color:#999;font-size:13px;">共{{total}}人</div>
  52. </el-form-item>
  53. <el-form-item style="float:right;">
  54. <el-link type="primary" :underline="false" @click="showExportDialog">导出人员</el-link>
  55. </el-form-item>
  56. <el-form-item style="float:right;">
  57. <el-link type="primary" :underline="false" @click="openInsertDialog(null)">添加人员</el-link>
  58. </el-form-item>
  59. <!-- 原来的 -->
  60. <!-- <el-form-item style="float:right;" v-if="depData != null && depData.id != -1 && depData.id != 0">
  61. <el-upload ref="upload" action="#" :limit="1" :http-request="importUser" :show-file-list="false">
  62. <el-link type="primary" :underline="false">批量导入</el-link>
  63. </el-upload>
  64. </el-form-item> -->
  65. <el-form-item style="float:right;">
  66. <el-upload ref="upload" action="#" :limit="1" :http-request="importUser" :show-file-list="false">
  67. <el-link type="primary" :underline="false">批量导入</el-link>
  68. </el-upload>
  69. </el-form-item>
  70. <el-form-item style="float:right;">
  71. <el-link type="primary" :underline="false" href="./upload/人员导入模板.xlsx" download="人员导入模板.xlsx">模板下载</el-link>
  72. </el-form-item>
  73. <!-- <el-form-item v-if="depData != null && depData.id != -1 && depData.id != 0" style="float:right;border: 0.5px solid #20a0ff;height: 27px;margin-top: 6px;">
  74. </el-form-item> -->
  75. <!-- <el-form-item style="float:right;">
  76. <el-link type="danger" v-if="depData != null && depData.id != -1 && depData.id != 0" :underline="false" @click="deleteDep(null)">删除部门</el-link>
  77. </el-form-item>
  78. <el-form-item style="float:right;">
  79. <el-link type="primary" v-if="depData != null && depData.id != -1 && depData.id != 0" :underline="false" @click="createDepartment(-2)">新增子部门</el-link>
  80. </el-form-item> -->
  81. <el-form-item style="float:right;">
  82. <span style="color: #666666">角色</span>
  83. <el-select v-model="role" placeholder="请选择" @change="getUser()" style="width: 120px">
  84. <el-option
  85. v-for="item in rolesa"
  86. :key="item.value"
  87. :label="item.label"
  88. :value="item.value">
  89. </el-option>
  90. </el-select>
  91. </el-form-item>
  92. <el-form-item style="float:right;">
  93. <span style="color: #666666">状态</span>
  94. <el-select v-model="status" placeholder="请选择" @change="getUser()" style="width: 120px">
  95. <el-option
  96. v-for="item in states"
  97. :key="item.value"
  98. :label="item.label"
  99. :value="item.value">
  100. </el-option>
  101. </el-select>
  102. </el-form-item>
  103. <el-form-item style="float:right;">
  104. <div style="width: 250px;display: inline-block;">
  105. <el-input v-model="keyword" class="input-with-select" placeholder="请输入人员名字搜索" clearable="true">
  106. <el-button slot="append" @click="searchList" icon="el-icon-search"></el-button>
  107. </el-input>
  108. </div>
  109. </el-form-item>
  110. </el-form>
  111. </el-col>
  112. <!--列表-->
  113. <el-table ref="handleSelectTable" :data="list" highlight-current-row v-loading="listLoading" :height="tableHeight" style="width: 100%;" @selection-change="handleSelectionZzjg">
  114. <el-table-column type="selection" width="50"></el-table-column>
  115. <el-table-column type="index" width="50">
  116. <template slot-scope="scope" >
  117. {{scope.$index+1+(page-1)*size}}
  118. </template>
  119. </el-table-column>
  120. <el-table-column prop="name" label="姓名" sortable></el-table-column>
  121. <el-table-column prop="phone" label="手机" width="120"></el-table-column>
  122. <el-table-column prop="departmentName" label="部门" sortable></el-table-column>
  123. <el-table-column label="角色" width="100">
  124. <template slot-scope="scope">{{roleArray[scope.row.role]}}</template>
  125. </el-table-column>
  126. <el-table-column prop="monthCost" label="月成本" sortable>
  127. <template slot-scope="scope">{{scope.row.monthCost==null?0:scope.row.monthCost}} 元</template>
  128. </el-table-column>
  129. <el-table-column prop="cost" label="时薪" sortable>
  130. <template slot-scope="scope">{{scope.row.cost==null?0:scope.row.cost}} 元
  131. <el-link @click.native="showSalaryList(scope.row)"><i class="iconfont firerock-iconrecord"></i></el-link>
  132. </template>
  133. </el-table-column>
  134. <el-table-column label="操作" width="330">
  135. <template slot-scope="scope">
  136. <!-- <el-button size="small" v-if="scope.row.role == 0 && user.role == 1" @click="switchRole(scope.$index)">切换为管理员</el-button>
  137. <el-button size="small" v-if="scope.row.role == 2 && user.role == 1" @click="switchRole(scope.$index)">切换为员工</el-button> -->
  138. <el-button size="mini" type="default" v-if="scope.row.role == 1 && user.role == 1" @click="transferRole(scope.row)">转让</el-button>
  139. <el-button size="mini" type="default" v-if="scope.row.role != 1" @click="resetPwd(scope.row)">重置</el-button>
  140. <el-button size="mini" type="primary" v-if="scope.row.role != 1" @click="openInsertDialog(scope.$index)">编辑</el-button>
  141. <el-button size="mini" type="primary" v-if="scope.row.role == 1" @click="openInsertDialog1(scope.$index)">编辑</el-button>
  142. <el-button size="mini" type="danger" v-if="scope.row.role != 1" @click="deleteUser(scope.row)">删除</el-button>
  143. <el-button size="mini" type="default" v-if="scope.row.role != 1 && scope.row.isActive==1" @click="showDeactiveDialog(scope.row)">停用</el-button>
  144. <el-button size="mini" type="success" v-if="scope.row.role != 1 && scope.row.isActive==0" @click="setActive(scope.row, 1)">启用</el-button>
  145. </template>
  146. </el-table-column>
  147. </el-table>
  148. <!--工具条-->
  149. <el-col :span="24" class="toolbar">
  150. <!-- 123 -->
  151. <el-button size="small" @click="handleSelectionZzjgbtn1">取消</el-button>
  152. <!-- <el-cascader v-model="handleSelectionZzjgwillchange" size="small" placeholder="请选择部门" style="width: 13%;margin-left: 1%;margin-right: 1%;font-size:12px"
  153. :options="option" :props="{ checkStrictly: false,expandTrigger: 'hover' }" :show-all-levels="false" clearable></el-cascader>
  154. <el-button size="small" type="primary" @click="handleSelectionZzjgbtn2">修改</el-button> -->
  155. <el-button size="small" type="primary" @click="handleSelectionZzjgbtn3">批量修改部门</el-button>
  156. <el-pagination
  157. @size-change="handleSizeChange"
  158. @current-change="handleCurrentChange"
  159. :page-sizes="[20 , 50 , 80 , 100]"
  160. :page-size="size"
  161. layout="total, sizes, prev, pager, next"
  162. :total="total"
  163. style="float:right;"
  164. ></el-pagination>
  165. </el-col>
  166. </el-col>
  167. <!-- 批量修改弹出框 -->
  168. <el-dialog title="批量修改" :visible.sync="handleSelectionZzjgshow" v-if="handleSelectionZzjgshow" width="30%">
  169. <el-form model="" label-width="20%">
  170. <el-form-item label="修改部门">
  171. <el-cascader v-model="handleSelectionZzjgwillchange" placeholder="请选择部门" style="width: 60%;"
  172. :options="option" :props="{ checkStrictly: false,expandTrigger: 'hover' }" :show-all-levels="false" clearable></el-cascader>
  173. </el-form-item>
  174. </el-form>
  175. <div slot="footer" class="dialog-footer">
  176. <el-button @click="handleSelectionZzjgshow = false">取消</el-button>
  177. <el-button type="primary" @click="handleSelectionZzjgbtn2">确定</el-button>
  178. </div>
  179. </el-dialog>
  180. <!-- 新增部门 -->
  181. <el-dialog :title="depTitle" :visible.sync="departmentVisible" width="400px" >
  182. <el-form ref="depForm" :model="depForm" :rules="depRules" label-width="80px">
  183. <el-form-item label="部门名称" prop="name">
  184. <el-input v-model="depForm.name" placeholder="请输入部门名称" clearable></el-input>
  185. </el-form-item>
  186. <el-form-item label="负责人" prop="managerId">
  187. <el-select v-model="depForm.managerId" filterable clearable placeholder="请选择部门负责人" >
  188. <el-option v-for="item in users" :key="item.id" :label="item.name" :value="item.id"></el-option>
  189. </el-select>
  190. </el-form-item>
  191. <!-- 直属领导 -->
  192. <el-form-item label="直属领导" prop="reportAuditUserid">
  193. <el-select v-model="depForm.reportAuditUserid" filterable clearable placeholder="请选择直属领导" >
  194. <el-option v-for="item in users" :key="item.id" :label="item.name" :value="item.id"></el-option>
  195. </el-select>
  196. </el-form-item>
  197. </el-form>
  198. <span slot="footer" class="dialog-footer">
  199. <el-button @click="departmentVisible = false">取消</el-button>
  200. <el-button type="primary" @click="submitDepartment" >提交</el-button>
  201. </span>
  202. </el-dialog>
  203. <!-- 新增单个人员的Dialog -->
  204. <el-dialog :title="title" :visible.sync="dialogVisible" width="550px" >
  205. <el-form ref="form1" :model="insertForm" :rules="rules" label-width="80px">
  206. <el-form-item label="名字" prop="name">
  207. <el-input v-model="insertForm.name" placeholder="请输入姓名" clearable></el-input>
  208. </el-form-item>
  209. <el-form-item label="电话" prop="phone">
  210. <el-input v-model="insertForm.phone" placeholder="请输入电话号码" clearable></el-input>
  211. </el-form-item>
  212. <el-form-item label="薪酬方式" prop="salaryType">
  213. <el-radio-group v-model="insertForm.salaryType" @change="onSalaryTypeChange">
  214. <el-radio :label="0" >固定月成本</el-radio>
  215. <el-radio :label="1">计时工资</el-radio>
  216. </el-radio-group>
  217. </el-form-item>
  218. <el-form-item label="月成本" prop="monthCost" v-if="insertForm.salaryType == 0">
  219. <el-input v-model="insertForm.monthCost" id="mc" @input="oninput" placeholder="请输入月成本,单位:元" clearable @keyup.native="restrictNumber('mc')"></el-input>
  220. <span style="color:orange;font-size:12px;">按照每个月工作{{timeType.monthDays}}天,每天{{timeType.allday}}小时预估时薪</span>
  221. <el-link :underline="false" style="color:blue;font-size:12px;margin-left:7px;" href="#/timetype">修改工作时长</el-link>
  222. </el-form-item>
  223. <el-form-item label="时薪" prop="cost">
  224. <el-input v-model="insertForm.cost" :disabled="insertForm.salaryType == 0" id="cc" style="width:120px;" @keyup.native="restrictNumber('cc')"
  225. placeholder="请输入成本 单位:元/小时" clearable></el-input>
  226. <span style="margin-left:25px;">生效日期</span>
  227. <el-date-picker v-model="insertForm.costApplyDate" value-format="yyyy-MM-dd"></el-date-picker>
  228. </el-form-item>
  229. <el-form-item label="部门" prop="departmentId">
  230. <el-cascader v-model="insertForm.departmentId" placeholder="请选择部门" style="width: 100%"
  231. :options="option" :props="{ checkStrictly: false,expandTrigger: 'hover' }" :show-all-levels="false" clearable></el-cascader>
  232. </el-form-item>
  233. <el-form-item label="角色" prop="role">
  234. <el-select v-model="insertForm.role" placeholder="请选择角色" style="width: 100%">
  235. <!-- <el-option label="普通员工" :value="0">
  236. <span style="float: left">普通员工</span>
  237. <span style="float: right; color: #8492a6; font-size: 13px">具有填报日报,参与项目协作基础功能</span>
  238. </el-option>
  239. <el-option label="系统管理员" :value="2" :disabled="user.role != 1">
  240. <span style="float: left">普通员工</span>
  241. <span style="float: right; color: #8492a6; font-size: 13px">具有填报日报,参与项目协作基础功能</span>
  242. </el-option>
  243. <el-option label="公司高层" :value="3"></el-option>
  244. <el-option label="财务管理员" :value="4"></el-option>
  245. <el-option label="项目管理员" :value="5"></el-option> -->
  246. <el-option v-for="item in roleDescArray" :label="item.label" :disabled="item.value==2&&user.role != 1" :value="item.value" :key="item.name">
  247. <span style="float: left">{{item.label}}</span>
  248. <span style="float: right; color: #8492a6; font-size: 13px">{{item.desc}}</span>
  249. </el-option>
  250. </el-select>
  251. </el-form-item>
  252. </el-form>
  253. <span slot="footer" class="dialog-footer">
  254. <el-button @click="dialogVisible=false">取消</el-button>
  255. <el-button type="primary" @click="submitInsert" :loading="submitLoading">提交</el-button>
  256. </span>
  257. </el-dialog>
  258. <el-dialog title="修改成本" :visible.sync="dialogVisible1" width="550px" >
  259. <el-form ref="form1" :model="insertForm" :rules="rules" label-width="80px">
  260. <el-form-item label="名字" prop="name">
  261. <el-input v-model="insertForm.name" placeholder="请输入姓名" clearable></el-input>
  262. </el-form-item>
  263. <el-form-item label="薪酬方式" prop="salaryType">
  264. <el-radio-group v-model="insertForm.salaryType" @change="onSalaryTypeChange">
  265. <el-radio :label="0" >固定月成本</el-radio>
  266. <el-radio :label="1">计时工资</el-radio>
  267. </el-radio-group>
  268. </el-form-item>
  269. <el-form-item label="月成本" prop="monthCost" v-if="insertForm.salaryType == 0">
  270. <el-input v-model="insertForm.monthCost" id="monthCost" @input="oninput" @keyup.native="restrictNumber('monthCost')" placeholder="请输入月成本,单位:元" clearable></el-input>
  271. <span style="color:orange;font-size:12px;">按照每个月工作{{timeType.monthDays}}天,每天{{timeType.allday}}小时预估时薪</span>
  272. <el-link :underline="false" style="color:blue;font-size:12px;margin-left:7px;" href="#/timetype">修改工作时长</el-link>
  273. </el-form-item>
  274. <el-form-item label="时薪" prop="cost">
  275. <el-input v-model="insertForm.cost" id="cost" :disabled="insertForm.salaryType == 0" @keyup.native="restrictNumber('cost')" style="width:120px;"
  276. placeholder="请输入成本 单位:元/小时" clearable></el-input>
  277. <span style="margin-left:25px;">生效日期</span>
  278. <el-date-picker v-model="insertForm.costApplyDate" value-format="yyyy-MM-dd"></el-date-picker>
  279. </el-form-item>
  280. <el-form-item label="部门" prop="departmentId">
  281. <el-cascader v-model="insertForm.departmentId"
  282. placeholder="请选择部门"
  283. style="width: 100%"
  284. :options="option"
  285. :props="{ checkStrictly: false,expandTrigger: 'hover' }" :show-all-levels="false"
  286. clearable></el-cascader>
  287. </el-form-item>
  288. </el-form>
  289. <span slot="footer" class="dialog-footer">
  290. <el-button @click="dialogVisible1=false">取消</el-button>
  291. <el-button type="primary" @click="submitInsert1" :loading="submitLoading">提交</el-button>
  292. </span>
  293. </el-dialog>
  294. <el-dialog title="人员历史成本" :visible.sync="userSalaryListDialog" width="550px" >
  295. <el-table :data="userSalaryList" highlight-current-row v-loading="listLoading" height="300px" style="width: 100%;">
  296. <el-table-column prop="userName" label="姓名" ></el-table-column>
  297. <el-table-column prop="indate" label="更新时间" width="150px">
  298. </el-table-column>
  299. <el-table-column prop="salaryType" label="薪酬方式" >
  300. <template slot-scope="scope" >
  301. {{scope.row.salaryType==0?"固定月薪":"计时工资"}}
  302. </template>
  303. </el-table-column>
  304. <el-table-column prop="monthCost" label="月薪" >
  305. <template slot-scope="scope" >
  306. {{scope.row.monthCost}}元
  307. </template>
  308. </el-table-column>
  309. <el-table-column prop="cost" label="时薪" >
  310. <template slot-scope="scope" >
  311. {{scope.row.cost}}元
  312. </template>
  313. </el-table-column>
  314. </el-table>
  315. </el-dialog>
  316. <!--导出人员 -->
  317. <el-dialog title="导出人员列表" :visible.sync="exportDialogVisible" width="550px" >
  318. <el-form label-width="100px">
  319. <el-form-item label="导出" >
  320. <el-radio-group v-model="containInvalid" >
  321. <el-radio :label="1" >全部人员</el-radio>
  322. <el-radio :label="0" >仅活跃人员</el-radio>
  323. </el-radio-group>
  324. </el-form-item>
  325. </el-form>
  326. <span slot="footer" class="dialog-footer">
  327. <el-button type="primary" @click="exportUsers">导出</el-button>
  328. </span>
  329. </el-dialog>
  330. <!-- 转让超级管理员权限 -->
  331. <el-dialog title="权限转让" :visible.sync="transferDialog" width="550px" >
  332. <el-form label-width="200px">
  333. <el-form-item label="转让超级管理员角色至" >
  334. <el-select v-model="toUserId" style="width:300px" filterable clearable>
  335. <el-option v-for="item in allActiveUsers" :key="item.id" :value="item.id" :label="item.name">
  336. </el-option>
  337. </el-select>
  338. </el-form-item>
  339. <el-form-item label="转让后自己的角色" >
  340. <el-select v-model="myRoleId" style="width:300px">
  341. <el-option v-for="item in roleDescArray" :label="item.label" :value="item.value" :key="item.name">
  342. <span style="float: left">{{item.label}}</span>
  343. <span style="float: right; color: #8492a6; font-size: 13px">{{item.desc}}</span>
  344. </el-option>
  345. </el-select>
  346. </el-form-item>
  347. </el-form>
  348. <span slot="footer" class="dialog-footer">
  349. <el-button type="default" @click="transferDialog = false">取消</el-button>
  350. <el-button type="primary" @click="showConfirmDialog">确定</el-button>
  351. </span>
  352. </el-dialog>
  353. <!--停用时选择日期 -->
  354. <el-dialog title="离职停用员工" :visible.sync="deactiveDialog" width="550px" >
  355. <el-form label-width="200px">
  356. <el-form-item label="员工离职日期" >
  357. <el-date-picker type="date" v-model="deactiveDate" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="请选择" />
  358. </el-form-item>
  359. </el-form>
  360. <span slot="footer" class="dialog-footer">
  361. <el-button type="default" @click="deactiveDialog = false">取消</el-button>
  362. <el-button type="primary" @click="confirmDeactive">确定</el-button>
  363. </span>
  364. </el-dialog>
  365. </section>
  366. </template>
  367. <script>
  368. import util from "../../common/js/util";
  369. export default {
  370. data() {
  371. return {
  372. handleSelectionZzjgshow: false,
  373. submitLoading:false,
  374. deactiveUser:null,
  375. deactiveDate:null,
  376. deactiveDialog:false,
  377. toUserId:null,
  378. myRoleId: 2,
  379. allActiveUsers:[],
  380. transferDialog: false,
  381. containInvalid:1,
  382. exportDialogVisible: false,
  383. roleArray:["普通员工","超级管理员", "系统管理员", "公司高层","财务管理员", "项目管理员","公司领导"],
  384. roleDescArray:[{label:"普通员工",value:0, desc:"填报日报,参与项目协作"},
  385. {label:"系统管理员",value:2, desc:"具有除了创建系统管理员之外的全部功能"},
  386. // {label:"公司高层",value:3, desc:"查阅项目信息,人员工时情况"},
  387. {label:"财务管理员",value:4, desc:"财务核算成本,费用报销审核,负责组织架构管理"},
  388. {label:"项目管理员",value:5, desc:"创建和管理项目"},
  389. {label:"公司领导",value:6, desc:"查看日报、工时成本统计、财务核算、项目和报表"},
  390. ],
  391. userSalaryList:[],
  392. userSalaryListDialog: false,
  393. value:{},
  394. user: JSON.parse(sessionStorage.getItem("user")),
  395. users:[],
  396. tableHeight: 0,
  397. listLoading: false,
  398. total: 0,
  399. page: 1,
  400. size: 20,
  401. list: [],
  402. data: [
  403. {
  404. id: -1,
  405. label: '全部人员',
  406. },
  407. {
  408. id: 0,
  409. label: '未分配',
  410. }
  411. ],
  412. option: [],
  413. depData: {
  414. id: -1,
  415. label: '全部人员',
  416. },
  417. defaultProps: {
  418. children: 'children',
  419. label: 'label'
  420. },
  421. dialogVisible: false,
  422. title: "",
  423. insertForm: {
  424. id: null,
  425. name: null,
  426. phone: null,
  427. role: null,
  428. monthCost:null,
  429. cost: null,
  430. departmentId: null,
  431. salaryType:0,
  432. costApplyDate: '2021-04-09'
  433. },
  434. rules: {
  435. name: [{ required: true, message: "请输入姓名", trigger: "blur" }],
  436. // phone: [{ required: true, message: "请输入电话", trigger: "blur" }],
  437. role: [{ required: true, message: "请选择角色", trigger: "blur" }],
  438. cost: [{ required: true, message: "请输入成本", trigger: "blur" }],
  439. monthCost:[{ required: true, message: "请输入月成本", trigger: "blur" }]
  440. },
  441. dialogVisible1: false,
  442. departmentVisible: false,
  443. depTitle: '',
  444. depForm: {
  445. id: null,
  446. name: null,
  447. parentId: null,
  448. managerId: null,
  449. },
  450. depRules: {
  451. name: [{ required: true, message: "请输入部门名称", trigger: "blur" }],
  452. },
  453. timeType:{},
  454. keyword: '',
  455. rolesa: [{
  456. value: '',
  457. label: '全部'
  458. }, {
  459. value: '6',
  460. label: '公司领导'
  461. }, {
  462. value: '2',
  463. label: '系统管理员'
  464. }, {
  465. value: '4',
  466. label: '财务管理员'
  467. }, {
  468. value: '5',
  469. label: '项目管理员'
  470. }, {
  471. value: '0',
  472. label: '普通员工'
  473. }],
  474. states: [{
  475. value: '',
  476. label: '全部'
  477. }, {
  478. value: '1',
  479. label: '活跃'
  480. }, {
  481. value: '0',
  482. label: '停用'
  483. }],
  484. status: '',
  485. role: '',
  486. jDarr: [],
  487. handleSelectionZzjgDate:[],
  488. handleSelectionZzjgwillchange : null
  489. };
  490. },
  491. methods: {
  492. // 批量修改部门
  493. handleSelectionZzjg(e){
  494. // if (e.length == 0) {
  495. // this.handleSelectionZzjgshow = false
  496. // }else{
  497. // this.handleSelectionZzjgshow = true
  498. // }
  499. this.handleSelectionZzjgDate = e
  500. },
  501. handleSelectionZzjgbtn1(){
  502. this.handleSelectionZzjgshow = false
  503. this.$refs.handleSelectTable.clearSelection()
  504. this.handleSelectionZzjgwillchange = null
  505. },
  506. handleSelectionZzjgbtn2(){
  507. if (this.handleSelectionZzjgwillchange == null) {
  508. this.$message('请选择部门');
  509. return
  510. }
  511. for (let index = 0; index < this.handleSelectionZzjgDate.length; index++) {
  512. this.handleSelectionZzjgDate[index].departmentId = this.handleSelectionZzjgwillchange[this.handleSelectionZzjgwillchange.length - 1]
  513. if (this.handleSelectionZzjgDate[index].role == 1) {
  514. this.submitInsert1(this.handleSelectionZzjgDate[index],1)
  515. }else{
  516. this.submitInsert(this.handleSelectionZzjgDate[index],1)
  517. }
  518. }
  519. this.handleSelectionZzjgwillchange = null
  520. this.handleSelectionZzjgshow = false
  521. },
  522. handleSelectionZzjgbtn3(){
  523. if(this.handleSelectionZzjgDate.length == 0){
  524. this.$message('请选择');
  525. return
  526. }
  527. this.handleSelectionZzjgshow = true
  528. },
  529. deleteUser(targetUser) {
  530. this.$confirm("确定要删除该员工吗?", "提示", {
  531. //type: 'warning'
  532. }).then(() => {
  533. this.http.post('/user/deleteUser', {
  534. userId: targetUser.id,
  535. },
  536. res => {
  537. if (res.code == "ok") {
  538. this.$message({
  539. message: '删除成功',
  540. type: "success"
  541. });
  542. this.getUser()
  543. } else {
  544. this.$message({
  545. message: res.msg,
  546. type: "error"
  547. });
  548. }
  549. },
  550. error => {
  551. this.$message({
  552. message: error,
  553. type: "error"
  554. });
  555. });
  556. })
  557. },
  558. chufa(data, b, c, e) {
  559. if(this.depData == null || data.id != this.depData.id) {
  560. // this.depData = data.id
  561. this.depData = data;
  562. this.page = 1;
  563. this.getUser();
  564. }
  565. },
  566. jieDian(a, b, c) {
  567. var ids = a.id
  568. var arrs = this.jDarr
  569. arrs.push(ids)
  570. this.jDarr = arrs
  571. },
  572. shutDown(a, b, c) {
  573. var ids = a.id
  574. var arrs = []
  575. for (var i in this.jDarr) {
  576. if(this.jDarr[i] != ids) {
  577. arrs.push(this.jDarr[i])
  578. }
  579. }
  580. this.jDarr = arrs
  581. },
  582. mouseleave(data,$event){
  583. $event.currentTarget.firstElementChild.nextElementSibling.setAttribute('class','node none')
  584. },
  585. mouseover(data,$event){
  586. $event.currentTarget.lastChild.setAttribute('class','node block');
  587. },
  588. confirmDeactive() {
  589. this.http.post('/user/deactiveUser', {
  590. id: this.deactiveUser.id,
  591. inactiveDate: this.deactiveDate
  592. },
  593. res => {
  594. if (res.code == "ok") {
  595. this.deactiveDialog = false;
  596. this.$message({
  597. message: '停用成功',
  598. type: "success"
  599. });
  600. // this.getUsers();
  601. this.getUser()
  602. } else {
  603. this.$message({
  604. message: res.msg,
  605. type: "error"
  606. });
  607. }
  608. },
  609. error => {
  610. this.$message({
  611. message: error,
  612. type: "error"
  613. });
  614. });
  615. },
  616. showDeactiveDialog(item) {
  617. this.deactiveDialog = true;
  618. this.deactiveUser = item;
  619. },
  620. restrictNumber(targetId) {
  621. let inpu = document.getElementById(targetId);
  622. inpu.value = inpu.value.replace(/[^\d.]/g, ""); //仅保留数字和"."
  623. inpu.value = inpu.value.replace(/\.{2,}/g, "."); //两个连续的"."仅保留第一个"."
  624. inpu.value = inpu.value.replace(".", "$#*").replace(/\./g,'').replace('$#*','.');//去除其他"."
  625. inpu.value = inpu.value.replace(/^(\d+)\.(\d\d).*$/, '$1.$2');;//限制只能输入两个小数
  626. if (inpu.value.indexOf(".") < 0 && inpu.value != "") { //首位是0的话去掉
  627. inpu.value = parseFloat(inpu.value);
  628. }
  629. },
  630. showConfirmDialog() {
  631. if (this.toUserId == null || this.toUserId == '') {
  632. this.$message({
  633. message: '请选择要转让的人员',
  634. type: "error"
  635. });
  636. return;
  637. }
  638. this.$confirm("您将失去超级管理员角色,需要重新登录。确定要转让吗?", "提示", {
  639. //type: 'warning'
  640. }).then(() => {
  641. this.http.post('/user/changeSysManager', {
  642. toUserId: this.toUserId,
  643. myRoleId: this.myRoleId
  644. },
  645. res => {
  646. if (res.code == "ok") {
  647. sessionStorage.removeItem("user");
  648. this.$router.push("/login");
  649. } else {
  650. this.$message({
  651. message: res.msg,
  652. type: "error"
  653. });
  654. }
  655. },
  656. error => {
  657. this.$message({
  658. message: error,
  659. type: "error"
  660. });
  661. });
  662. });
  663. },
  664. transferRole() {
  665. this.transferDialog = true;
  666. this.http.post(this.port.manage.list, {
  667. departmentId: -1,
  668. pageIndex: 1,
  669. pageSize: 99999,
  670. keyword: this.keyword
  671. },
  672. res => {
  673. if (res.code == "ok") {
  674. this.allActiveUsers = res.data.records.filter(u=>u.isActive == 1 && u.id != this.user.id);
  675. } else {
  676. this.$message({
  677. message: res.msg,
  678. type: "error"
  679. });
  680. }
  681. },
  682. error => {
  683. this.$message({
  684. message: error,
  685. type: "error"
  686. });
  687. });
  688. },
  689. showExportDialog() {
  690. this.exportDialogVisible = true;
  691. },
  692. exportUsers() {
  693. this.http.post('/user/exportUsers', {
  694. containInvalid: this.containInvalid
  695. },
  696. res => {
  697. if (res.code == "ok") {
  698. this.exportDialogVisible = false;
  699. var aTag = document.createElement('a');
  700. aTag.download = "全部员工列表.xls";
  701. aTag.href = res.data;
  702. aTag.click();
  703. } else {
  704. this.$message({
  705. message: res.msg,
  706. type: "error"
  707. });
  708. }
  709. },
  710. error => {
  711. this.$message({
  712. message: error,
  713. type: "error"
  714. });
  715. });
  716. },
  717. showSalaryList(item) {
  718. this.userSalaryListDialog = true;
  719. this.userSalaryList = [];
  720. this.http.post('/user/getUserSalaryList', {
  721. id: item.id
  722. },
  723. res => {
  724. if (res.code == "ok") {
  725. this.userSalaryList = res.data;
  726. } else {
  727. this.$message({
  728. message: res.msg,
  729. type: "error"
  730. });
  731. }
  732. },
  733. error => {
  734. this.$message({
  735. message: error,
  736. type: "error"
  737. });
  738. });
  739. },
  740. getUsers() {
  741. this.http.post(this.port.manage.list, {
  742. departmentId: -1,
  743. pageIndex: 1,
  744. pageSize: 99999,
  745. keyword: this.keyword
  746. },
  747. res => {
  748. if (res.code == "ok") {
  749. this.users = res.data.records;
  750. } else {
  751. this.$message({
  752. message: res.msg,
  753. type: "error"
  754. });
  755. }
  756. },
  757. error => {
  758. this.$message({
  759. message: error,
  760. type: "error"
  761. });
  762. });
  763. },
  764. onSalaryTypeChange(value) {
  765. if (value == 1) {
  766. this.insertForm.monthCost = null;
  767. }
  768. },
  769. //选中部门
  770. choseDept(value) {
  771. console.log(value);
  772. },
  773. //月成本输入变化
  774. oninput(e) {
  775. this.insertForm.cost = (this.insertForm.monthCost/this.timeType.monthDays/this.timeType.allday).toFixed(2);
  776. },
  777. // 获取本公司的工作时间设置
  778. getCompanyTimeSetting() {
  779. this.http.post('/time-type/getCompanyTimeSetting',{
  780. companyId: this.user.companyId
  781. },
  782. res => {
  783. if (res.code == "ok") {
  784. this.timeType = res.data;
  785. } else {
  786. this.$message({
  787. message: res.msg,
  788. type: "error"
  789. });
  790. }
  791. },
  792. error => {
  793. this.listLoading = false;
  794. this.$message({
  795. message: error,
  796. type: "error"
  797. });
  798. }
  799. );
  800. },
  801. // 批量导入人员
  802. importUser(item) {
  803. //首先判断文件类型
  804. let str = item.file.name.split(".");
  805. let format = str[str.length - 1];
  806. if (format != "xls" && format != "xlsx") {
  807. this.$message({
  808. message: "请选择.xls或.xlsx文件",
  809. type: "error"
  810. });
  811. } else {
  812. this.listLoading = true;
  813. let formData = new FormData();
  814. formData.append("file", item.file);
  815. this.http.uploadFile( this.port.manage.import, formData,
  816. res => {
  817. this.$refs.upload.clearFiles();
  818. this.listLoading = false;
  819. if (res.code == "ok") {
  820. this.$message({
  821. message: "导入成功",
  822. type: "success"
  823. });
  824. //重新读取列表
  825. this.getUser();
  826. } else {
  827. this.$message({
  828. message: res.msg,
  829. type: "error"
  830. });
  831. }
  832. },
  833. error => {
  834. this.$refs.upload.clearFiles();
  835. this.listLoading = false;
  836. this.$message({
  837. message: error,
  838. type: "error"
  839. });
  840. });
  841. }
  842. },
  843. //分页
  844. handleCurrentChange(val) {
  845. this.page = val;
  846. this.getUser();
  847. },
  848. handleSizeChange(val) {
  849. this.size = val;
  850. this.getUser();
  851. },
  852. //获取所有员工的列表
  853. getUser() {
  854. console.log(12345)
  855. this.listLoading = true;
  856. this.http.post( this.port.manage.list, {
  857. departmentId: this.depData.id,
  858. pageIndex: this.page,
  859. pageSize: this.size,
  860. keyword: this.keyword,
  861. status: this.status,
  862. role: this.role
  863. },
  864. res => {
  865. this.listLoading = false;
  866. if (res.code == "ok") {
  867. this.list = res.data.records;
  868. this.total = res.data.total;
  869. } else {
  870. this.$message({
  871. message: res.msg,
  872. type: "error"
  873. });
  874. }
  875. },
  876. error => {
  877. this.listLoading = false;
  878. this.$message({
  879. message: error,
  880. type: "error"
  881. });
  882. });
  883. },
  884. resetPwd(user) {
  885. this.$confirm( "确定要为" + user.name + "重置密码吗?", "重置密码", {
  886. confirmButtonText: "确定",
  887. cancelButtonText: "取消",
  888. type: "warning"
  889. })
  890. .then(() => {
  891. this.http.post('/user/resetPwd', { userId: user.id },
  892. res => {
  893. if (res.code == "ok") {
  894. this.$message({
  895. message: "密码已重置为000000,请通知员工及时修改",
  896. type: "success"
  897. });
  898. } else {
  899. this.$message({
  900. message: res.msg,
  901. type: "error"
  902. });
  903. }
  904. },
  905. error => {
  906. this.listLoading = false;
  907. this.$message({
  908. message: error,
  909. type: "error"
  910. });
  911. });
  912. })
  913. .catch(() => {});
  914. },
  915. // 新增、编辑人员
  916. openInsertDialog(i) {
  917. if (i != null) {
  918. var list = JSON.parse(JSON.stringify(this.list[i])) , arr = [] , array = [];
  919. if(list.departmentCascade!='0' && list.departmentCascade!=null) {
  920. if(list.departmentCascade.indexOf(",")>-1) {
  921. arr = list.departmentCascade.split(",");
  922. } else {
  923. arr = [].concat(list.departmentCascade)
  924. }
  925. }
  926. for(var i in arr) {
  927. array.push(parseInt(arr[i]))
  928. }
  929. this.insertForm = {
  930. id: list.id,
  931. name: list.name,
  932. phone: list.phone,
  933. role: list.role,
  934. monthCost:list.monthCost,
  935. cost: list.cost,
  936. departmentId: array.reverse(),
  937. salaryType: list.salaryType,
  938. costApplyDate: list.costApplyDate,
  939. };
  940. this.title = "编辑人员"
  941. } else {
  942. this.insertForm = {
  943. id: null,
  944. name: null,
  945. phone: null,
  946. role: null,
  947. monthCost:null,
  948. cost: null,
  949. departmentId: null,
  950. salaryType:0,
  951. costApplyDate: util.formatDate.format(new Date(), 'yyyy-MM-dd'),
  952. };
  953. this.title = "新增人员"
  954. }
  955. this.dialogVisible = true;
  956. },
  957. submitInsert(event,i) {
  958. var form = {}
  959. if (i == 1) {
  960. form = {
  961. name: event.name,
  962. phone: event.phone,
  963. role: event.role,
  964. monthCost: event.monthCost,
  965. cost: event.cost,
  966. salaryType: event.salaryType,
  967. };
  968. if (event.id != null) {
  969. form.id = event.id;
  970. }
  971. if (event.costApplyDate != null) {
  972. form.costApplyDate = event.costApplyDate;
  973. }
  974. if (event.departmentId != null) {
  975. form.departmentId = event.departmentId;
  976. }
  977. } else {
  978. this.$refs.form1.validate(valid => {
  979. if (valid) {
  980. this.submitLoading = true;
  981. form = {
  982. name: this.insertForm.name,
  983. phone: this.insertForm.phone,
  984. role: this.insertForm.role,
  985. monthCost: this.insertForm.monthCost,
  986. cost: this.insertForm.cost,
  987. salaryType: this.insertForm.salaryType,
  988. };
  989. if (this.insertForm.id != null) {
  990. form.id = this.insertForm.id;
  991. }
  992. if (this.insertForm.costApplyDate != null) {
  993. form.costApplyDate = this.insertForm.costApplyDate;
  994. }
  995. if (this.insertForm.departmentId != null) {
  996. form.departmentId = this.insertForm.departmentId[this.insertForm.departmentId.length-1];
  997. }
  998. }
  999. });
  1000. }
  1001. this.http.post( this.port.manage.insert, form,
  1002. res => {
  1003. this.submitLoading = false;
  1004. if (res.code == "ok") {
  1005. this.$message({
  1006. message: this.insertForm.id != null ? "修改" : "创建" + "成功",
  1007. type: "success"
  1008. });
  1009. this.dialogVisible = false;
  1010. this.getUser();
  1011. this.getUsers()
  1012. } else {
  1013. this.$message({
  1014. message: res.msg,
  1015. type: "error"
  1016. });
  1017. }
  1018. },
  1019. error => {
  1020. this.listLoading = false;
  1021. this.$message({
  1022. message: error,
  1023. type: "error"
  1024. });
  1025. });
  1026. },
  1027. // 切换角色
  1028. switchRole(index) {
  1029. this.listLoading = true;
  1030. this.http.post( this.port.manage.permission, { id: this.list[index].id },
  1031. res => {
  1032. this.listLoading = false;
  1033. if (res.code == "ok") {
  1034. this.$message({
  1035. message: "切换角色成功",
  1036. type: "success"
  1037. });
  1038. //重新读取列表
  1039. this.getUser();
  1040. } else {
  1041. this.$message({
  1042. message: res.msg,
  1043. type: "error"
  1044. });
  1045. }
  1046. },
  1047. error => {
  1048. this.listLoading = false;
  1049. this.$message({
  1050. message: error,
  1051. type: "error"
  1052. });
  1053. });
  1054. },
  1055. // 删除用户
  1056. setActive(item, isActive) {
  1057. var txt = isActive==1?"启用":"停用";
  1058. this.$confirm( "确定要"+txt +" " + item.name + " 吗?", "账号"+txt, {
  1059. confirmButtonText: "确定",
  1060. cancelButtonText: "取消",
  1061. type: "warning"
  1062. })
  1063. .then(() => {
  1064. this.listLoading = true;
  1065. this.http.post('/user/setActive', { id: item.id, isActive: isActive},
  1066. res => {
  1067. this.listLoading = false;
  1068. if (res.code == "ok") {
  1069. this.$message({
  1070. message: txt+"成功",
  1071. type: "success"
  1072. });
  1073. //重新读取列表
  1074. this.getUser();
  1075. } else {
  1076. this.$message({
  1077. message: res.msg,
  1078. type: "error"
  1079. });
  1080. }
  1081. },
  1082. error => {
  1083. this.listLoading = false;
  1084. this.$message({
  1085. message: error,
  1086. type: "error"
  1087. });
  1088. });
  1089. })
  1090. .catch(() => {});
  1091. },
  1092. // 修改老板的成本
  1093. openInsertDialog1(i) {
  1094. var list1 = JSON.parse(JSON.stringify(this.list[i])) , arr1 = [] , array1 = [];
  1095. if(list1.departmentCascade!='0' && list1.departmentCascade!=null) {
  1096. if(list1.departmentCascade.indexOf(",")>-1) {
  1097. arr1 = list1.departmentCascade.split(",");
  1098. } else {
  1099. arr1 = [].concat(list1.departmentCascade)
  1100. }
  1101. }
  1102. for(var i in arr1) {
  1103. array1.push(parseInt(arr1[i]))
  1104. }
  1105. console.log(list1)
  1106. this.insertForm = {
  1107. id: list1.id,
  1108. name: list1.name,
  1109. phone: list1.phone,
  1110. role: list1.role,
  1111. monthCost:list1.monthCost,
  1112. cost: list1.cost,
  1113. departmentId: array1.reverse(),
  1114. salaryType: list1.salaryType,
  1115. name: list1.name
  1116. };
  1117. this.dialogVisible1 = true;
  1118. },
  1119. submitInsert1(event,i) {
  1120. var form = {}
  1121. if (i == 1) {
  1122. this.submitLoading = true;
  1123. form = {
  1124. id: event.id,
  1125. name: event.name,
  1126. phone: event.phone,
  1127. role: event.role,
  1128. monthCost: event.monthCost,
  1129. cost: event.cost
  1130. };
  1131. if (event.departmentId != null) {
  1132. form.departmentId = event.departmentId;
  1133. }
  1134. if (event.costApplyDate != null) {
  1135. form.costApplyDate = event.costApplyDate;
  1136. }
  1137. } else {
  1138. this.$refs.form1.validate(valid => {
  1139. if (valid) {
  1140. this.submitLoading = true;
  1141. form = {
  1142. id: this.insertForm.id,
  1143. name: this.insertForm.name,
  1144. phone: this.insertForm.phone,
  1145. role: this.insertForm.role,
  1146. monthCost: this.insertForm.monthCost,
  1147. cost: this.insertForm.cost
  1148. };
  1149. if (this.insertForm.departmentId != null) {
  1150. form.departmentId = this.insertForm.departmentId[this.insertForm.departmentId.length-1];
  1151. }
  1152. if (this.insertForm.costApplyDate != null) {
  1153. form.costApplyDate = this.insertForm.costApplyDate;
  1154. }
  1155. }
  1156. });
  1157. }
  1158. this.http.post( this.port.manage.insert, form,
  1159. res => {
  1160. this.submitLoading = false;
  1161. if (res.code == "ok") {
  1162. this.$message({
  1163. message: "修改成功",
  1164. type: "success"
  1165. });
  1166. this.dialogVisible1 = false;
  1167. //重新读取列表
  1168. this.getUser();
  1169. this.getUsers()
  1170. } else {
  1171. this.$message({
  1172. message: res.msg,
  1173. type: "error"
  1174. });
  1175. }
  1176. },
  1177. error => {
  1178. this.listLoading = false;
  1179. this.$message({
  1180. message: error,
  1181. type: "error"
  1182. });
  1183. });
  1184. },
  1185. // 获取部门列表
  1186. getDepartment() {
  1187. this.http.post( this.port.manage.depList, {},
  1188. res => {
  1189. if (res.code == "ok") {
  1190. var list = res.data , list1 = JSON.parse(JSON.stringify(res.data));
  1191. list.splice(0,0,{
  1192. id: -1,
  1193. label: '全部人员',
  1194. })
  1195. list.push({
  1196. id: 0,
  1197. label: '未分配',
  1198. })
  1199. this.data = list;
  1200. console.log(list, "部门数据")
  1201. this.option = this.changeArr(list1);
  1202. } else {
  1203. this.$message({
  1204. message: res.msg,
  1205. type: "error"
  1206. });
  1207. }
  1208. },
  1209. error => {
  1210. this.$message({
  1211. message: error,
  1212. type: "error"
  1213. });
  1214. });
  1215. },
  1216. // 修改数组
  1217. changeArr(arr) {
  1218. for (var i = 0; i < arr.length; i++) {
  1219. if(arr[i].id != -1 && arr[i].id != 0) {
  1220. if (arr[i].children != null && arr[i].children.length>0) {
  1221. arr[i].children = this.changeArr(arr[i].children);
  1222. }
  1223. arr[i].id && (arr[i].value = arr[i].id);
  1224. delete arr[i].id;
  1225. }
  1226. }
  1227. for(var i in arr) {
  1228. if(arr[i].id == -1 || arr[i].id == 0) {
  1229. arr.splice(i,1)
  1230. }
  1231. }
  1232. return arr;
  1233. },
  1234. // 部门列表点击
  1235. handleNodeClick(data) {
  1236. console.log(data, 999)
  1237. if(this.depData == null || data.id != this.depData.id) {
  1238. this.depData = data;
  1239. this.page = 1;
  1240. this.getUser();
  1241. }
  1242. },
  1243. // 新增、修改部门
  1244. createDepartment(i) {
  1245. setTimeout(() => {
  1246. var that = this
  1247. if(i == -2) {//创建子部门
  1248. that.depForm = {
  1249. id: null,
  1250. name: null,
  1251. parentId: null,
  1252. managerId: null,
  1253. }
  1254. if(that.depData.id != -1 && that.depData.id != 0) {
  1255. that.depForm.parentId = that.depData.id;
  1256. }
  1257. that.depTitle = "新增子部门";
  1258. } else if(i == -1) {//创建一级部门
  1259. that.depForm = {
  1260. id: null,
  1261. name: null,
  1262. parentId: null,
  1263. managerId: null,
  1264. }
  1265. that.depTitle = "新增部门";
  1266. } else {
  1267. if(that.depData.managerId == "null") {
  1268. that.depData.managerId = ''
  1269. }
  1270. if(that.depData.reportAuditUserid == "null") {
  1271. that.depData.reportAuditUserid = ''
  1272. }
  1273. that.depForm = {
  1274. id: that.depData.id,
  1275. name: that.depData.label,
  1276. parentId: that.depData.parentId,
  1277. managerId: that.depData.managerId,
  1278. reportAuditUserid: that.depData.reportAuditUserid
  1279. }
  1280. // if(that.depData.reportAuditUserid != null && that.depData.reportAuditUserid != "null" && that.depData.reportAuditUserid.length > 0) {
  1281. // that.depForm.reportAuditUserid = that.depData.reportAuditUserid
  1282. // }
  1283. that.depTitle = "编辑部门";
  1284. }
  1285. that.departmentVisible = true;
  1286. })
  1287. // if(i == -2) {//创建子部门
  1288. // this.depForm = {
  1289. // id: null,
  1290. // name: null,
  1291. // parentId: null,
  1292. // managerId: null,
  1293. // }
  1294. // if(this.depData.id != -1 && this.depData.id != 0) {
  1295. // this.depForm.parentId = this.depData.id;
  1296. // }
  1297. // this.depTitle = "新增子部门";
  1298. // } else if(i == -1) {//创建一级部门
  1299. // this.depForm = {
  1300. // id: null,
  1301. // name: null,
  1302. // parentId: null,
  1303. // managerId: null,
  1304. // }
  1305. // this.depTitle = "新增部门";
  1306. // } else {
  1307. // if(this.depData.managerId == "null") {
  1308. // this.depData.managerId = ''
  1309. // }
  1310. // if(this.depData.reportAuditUserid == "null") {
  1311. // this.depData.reportAuditUserid = ''
  1312. // }
  1313. // this.depForm = {
  1314. // id: this.depData.id,
  1315. // name: this.depData.label,
  1316. // parentId: this.depData.parentId,
  1317. // managerId: this.depData.managerId,
  1318. // reportAuditUserid: this.depData.reportAuditUserid
  1319. // }
  1320. // // if(this.depData.reportAuditUserid != null && this.depData.reportAuditUserid != "null" && this.depData.reportAuditUserid.length > 0) {
  1321. // // this.depForm.reportAuditUserid = this.depData.reportAuditUserid
  1322. // // }
  1323. // this.depTitle = "编辑部门";
  1324. // }
  1325. // this.departmentVisible = true;
  1326. },
  1327. submitDepartment() {
  1328. this.$refs.depForm.validate(valid => {
  1329. if (valid) {
  1330. var form = {
  1331. name: this.depForm.name,
  1332. };
  1333. if(this.depForm.id != null) {
  1334. form.id = this.depForm.id
  1335. }
  1336. if(this.depForm.parentId != null) {
  1337. form.parentId = this.depForm.parentId
  1338. }
  1339. if (this.depForm.managerId) {
  1340. form.managerId = this.depForm.managerId
  1341. }
  1342. console.log(this.depForm)
  1343. if (this.depForm.reportAuditUserid) {
  1344. form.reportAuditUserid = this.depForm.reportAuditUserid
  1345. }
  1346. this.http.post( this.depForm.id==null?this.port.manage.add:this.port.manage.edit, form,
  1347. res => {
  1348. if (res.code == "ok") {
  1349. this.$message({
  1350. message: this.depForm.id==null?"新增成功":"修改成功",
  1351. type: "success"
  1352. });
  1353. this.departmentVisible = false;
  1354. if (this.depForm.id !=null) {
  1355. this.depData.label = form.name;
  1356. this.depData.managerId = form.managerId;
  1357. }
  1358. this.getDepartment();
  1359. } else {
  1360. this.$message({
  1361. message: res.msg,
  1362. type: "error"
  1363. });
  1364. }
  1365. },
  1366. error => {
  1367. this.listLoading = false;
  1368. this.$message({
  1369. message: error,
  1370. type: "error"
  1371. });
  1372. });
  1373. }
  1374. });
  1375. },
  1376. // 删除部门
  1377. deleteDep() {
  1378. var that = this
  1379. setTimeout(() =>{
  1380. that.$confirm( "确定要删除部门" + that.depData.label + "吗?", "删除部门", {
  1381. confirmButtonText: "确定",
  1382. cancelButtonText: "取消",
  1383. type: "warning"
  1384. })
  1385. .then(() => {
  1386. that.listLoading = true;
  1387. that.http.post( that.port.manage.del, { id: that.depData.id },
  1388. res => {
  1389. that.listLoading = false;
  1390. if (res.code == "ok") {
  1391. that.$message({
  1392. message: "删除成功",
  1393. type: "success"
  1394. });
  1395. that.depData = {
  1396. id: -1,
  1397. label: '全部人员',
  1398. }
  1399. that.getDepartment();
  1400. that.getUser();
  1401. } else {
  1402. that.$message({
  1403. message: res.msg,
  1404. type: "error"
  1405. });
  1406. }
  1407. },
  1408. error => {
  1409. that.listLoading = false;
  1410. that.$message({
  1411. message: error,
  1412. type: "error"
  1413. });
  1414. });
  1415. })
  1416. .catch(() => {});
  1417. },100);
  1418. // this.$confirm( "确定要删除部门" + this.depData.label + "吗?", "删除部门", {
  1419. // confirmButtonText: "确定",
  1420. // cancelButtonText: "取消",
  1421. // type: "warning"
  1422. // })
  1423. // .then(() => {
  1424. // this.listLoading = true;
  1425. // this.http.post( this.port.manage.del, { id: this.depData.id },
  1426. // res => {
  1427. // this.listLoading = false;
  1428. // if (res.code == "ok") {
  1429. // this.$message({
  1430. // message: "删除成功",
  1431. // type: "success"
  1432. // });
  1433. // this.depData = {
  1434. // id: -1,
  1435. // label: '全部人员',
  1436. // }
  1437. // this.getDepartment();
  1438. // this.getUser();
  1439. // } else {
  1440. // this.$message({
  1441. // message: res.msg,
  1442. // type: "error"
  1443. // });
  1444. // }
  1445. // },
  1446. // error => {
  1447. // this.listLoading = false;
  1448. // this.$message({
  1449. // message: error,
  1450. // type: "error"
  1451. // });
  1452. // });
  1453. // })
  1454. // .catch(() => {});
  1455. },
  1456. // 关键搜索
  1457. searchList() {
  1458. console.log(this.keyword)
  1459. this.listLoading = true;
  1460. this.http.post( this.port.manage.list, {
  1461. departmentId: this.depData.id,
  1462. pageIndex: this.page,
  1463. pageSize: this.size,
  1464. keyword: this.keyword
  1465. },
  1466. res => {
  1467. this.listLoading = false;
  1468. if (res.code == "ok") {
  1469. this.list = res.data.records;
  1470. this.total = res.data.total;
  1471. } else {
  1472. this.$message({
  1473. message: res.msg,
  1474. type: "error"
  1475. });
  1476. }
  1477. },
  1478. error => {
  1479. this.listLoading = false;
  1480. this.$message({
  1481. message: error,
  1482. type: "error"
  1483. });
  1484. });
  1485. }
  1486. },
  1487. created() {
  1488. let height = window.innerHeight;
  1489. this.tableHeight = height - 195;
  1490. const that = this;
  1491. window.onresize = function temp() {
  1492. that.tableHeight = window.innerHeight - 195;
  1493. };
  1494. },
  1495. mounted() {
  1496. this.deactiveDate = util.formatDate.format(new Date(), 'yyyy-MM-dd');
  1497. this.getDepartment();
  1498. this.getUser();
  1499. this.getCompanyTimeSetting();
  1500. this.getUsers();
  1501. }
  1502. };
  1503. </script>
  1504. <style lang="scss" scoped>
  1505. .custom-tree-node {
  1506. flex: 1;
  1507. display: flex;
  1508. align-items: center;
  1509. justify-content: space-between;
  1510. font-size: 14px;
  1511. padding-right: 8px;
  1512. }
  1513. .left {
  1514. border-right: 1px solid #f2f2f2;
  1515. overflow: hidden;
  1516. .department {
  1517. background:#f2f2f2;
  1518. line-height: 60px;
  1519. color:#666;
  1520. padding:0 10px;
  1521. height:60px;
  1522. font-size: 15px;
  1523. div {
  1524. float: right;
  1525. color: #20a0ff;
  1526. font-size: 14px;
  1527. cursor: pointer;
  1528. }
  1529. }
  1530. .tree {
  1531. overflow: auto;
  1532. }
  1533. }
  1534. .nowTime {
  1535. height: 40px;
  1536. line-height: 40px;
  1537. font-size: 16px;
  1538. color: #20a0ff;
  1539. margin-left: 10px;
  1540. cursor: pointer;
  1541. i {
  1542. margin-right: 10px;
  1543. }
  1544. }
  1545. .none {
  1546. display: none;
  1547. }
  1548. .block {
  1549. display: block;
  1550. }
  1551. </style>
  1552. <style lang="scss">
  1553. .tree {
  1554. .el-tree-node__label {
  1555. overflow-x: hidden;
  1556. white-space: nowrap;
  1557. text-overflow: ellipsis;
  1558. }
  1559. }
  1560. .el-divider--horizontal {
  1561. margin: 0px;
  1562. background:#f3f3f3;
  1563. }
  1564. //全局的作用范围
  1565. .el-tree-node__content {
  1566. height:36px;
  1567. }
  1568. </style>