index.vue 72 KB

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