index.vue 72 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619
  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. //接口调用样例代码如下
  512. var ids = [];
  513. for (let index = 0; index < this.handleSelectionZzjgDate.length; index++) {
  514. ids.push(this.handleSelectionZzjgDate[index].id)
  515. }
  516. var changeId = this.handleSelectionZzjgwillchange[this.handleSelectionZzjgwillchange.length - 1]
  517. this.http.post('/user/batchUpdateDept', {
  518. userIds: JSON.stringify(ids),
  519. deptId: changeId
  520. },
  521. res => {
  522. if (res.code == "ok") {
  523. this.$message({
  524. message: '修改成功',
  525. type: "success"
  526. });
  527. this.getUser()
  528. } else {
  529. this.$message({
  530. message: res.msg,
  531. type: "error"
  532. });
  533. }
  534. },
  535. error => {
  536. this.$message({
  537. message: error,
  538. type: "error"
  539. });
  540. });
  541. // for (let index = 0; index < this.handleSelectionZzjgDate.length; index++) {
  542. // this.handleSelectionZzjgDate[index].departmentId = this.handleSelectionZzjgwillchange[this.handleSelectionZzjgwillchange.length - 1]
  543. // if (this.handleSelectionZzjgDate[index].role == 1) {
  544. // this.submitInsert1(this.handleSelectionZzjgDate[index],1)
  545. // }else{
  546. // this.submitInsert(this.handleSelectionZzjgDate[index],1)
  547. // }
  548. // }
  549. // this.handleSelectionZzjgwillchange = null
  550. // this.handleSelectionZzjgshow = false
  551. },
  552. handleSelectionZzjgbtn3(){
  553. if(this.handleSelectionZzjgDate.length == 0){
  554. this.$message('请选择');
  555. return
  556. }
  557. this.handleSelectionZzjgshow = true
  558. },
  559. deleteUser(targetUser) {
  560. this.$confirm("确定要删除该员工吗?", "提示", {
  561. //type: 'warning'
  562. }).then(() => {
  563. this.http.post('/user/deleteUser', {
  564. userId: targetUser.id,
  565. },
  566. res => {
  567. if (res.code == "ok") {
  568. this.$message({
  569. message: '删除成功',
  570. type: "success"
  571. });
  572. this.getUser()
  573. } else {
  574. this.$message({
  575. message: res.msg,
  576. type: "error"
  577. });
  578. }
  579. },
  580. error => {
  581. this.$message({
  582. message: error,
  583. type: "error"
  584. });
  585. });
  586. })
  587. },
  588. chufa(data, b, c, e) {
  589. if(this.depData == null || data.id != this.depData.id) {
  590. // this.depData = data.id
  591. this.depData = data;
  592. this.page = 1;
  593. this.getUser();
  594. }
  595. },
  596. jieDian(a, b, c) {
  597. var ids = a.id
  598. var arrs = this.jDarr
  599. arrs.push(ids)
  600. this.jDarr = arrs
  601. },
  602. shutDown(a, b, c) {
  603. var ids = a.id
  604. var arrs = []
  605. for (var i in this.jDarr) {
  606. if(this.jDarr[i] != ids) {
  607. arrs.push(this.jDarr[i])
  608. }
  609. }
  610. this.jDarr = arrs
  611. },
  612. mouseleave(data,$event){
  613. $event.currentTarget.firstElementChild.nextElementSibling.setAttribute('class','node none')
  614. },
  615. mouseover(data,$event){
  616. $event.currentTarget.lastChild.setAttribute('class','node block');
  617. },
  618. confirmDeactive() {
  619. this.http.post('/user/deactiveUser', {
  620. id: this.deactiveUser.id,
  621. inactiveDate: this.deactiveDate
  622. },
  623. res => {
  624. if (res.code == "ok") {
  625. this.deactiveDialog = false;
  626. this.$message({
  627. message: '停用成功',
  628. type: "success"
  629. });
  630. // this.getUsers();
  631. this.getUser()
  632. } else {
  633. this.$message({
  634. message: res.msg,
  635. type: "error"
  636. });
  637. }
  638. },
  639. error => {
  640. this.$message({
  641. message: error,
  642. type: "error"
  643. });
  644. });
  645. },
  646. showDeactiveDialog(item) {
  647. this.deactiveDialog = true;
  648. this.deactiveUser = item;
  649. },
  650. restrictNumber(targetId) {
  651. let inpu = document.getElementById(targetId);
  652. inpu.value = inpu.value.replace(/[^\d.]/g, ""); //仅保留数字和"."
  653. inpu.value = inpu.value.replace(/\.{2,}/g, "."); //两个连续的"."仅保留第一个"."
  654. inpu.value = inpu.value.replace(".", "$#*").replace(/\./g,'').replace('$#*','.');//去除其他"."
  655. inpu.value = inpu.value.replace(/^(\d+)\.(\d\d).*$/, '$1.$2');;//限制只能输入两个小数
  656. if (inpu.value.indexOf(".") < 0 && inpu.value != "") { //首位是0的话去掉
  657. inpu.value = parseFloat(inpu.value);
  658. }
  659. },
  660. showConfirmDialog() {
  661. if (this.toUserId == null || this.toUserId == '') {
  662. this.$message({
  663. message: '请选择要转让的人员',
  664. type: "error"
  665. });
  666. return;
  667. }
  668. this.$confirm("您将失去超级管理员角色,需要重新登录。确定要转让吗?", "提示", {
  669. //type: 'warning'
  670. }).then(() => {
  671. this.http.post('/user/changeSysManager', {
  672. toUserId: this.toUserId,
  673. myRoleId: this.myRoleId
  674. },
  675. res => {
  676. if (res.code == "ok") {
  677. sessionStorage.removeItem("user");
  678. this.$router.push("/login");
  679. } else {
  680. this.$message({
  681. message: res.msg,
  682. type: "error"
  683. });
  684. }
  685. },
  686. error => {
  687. this.$message({
  688. message: error,
  689. type: "error"
  690. });
  691. });
  692. });
  693. },
  694. transferRole() {
  695. this.transferDialog = true;
  696. this.http.post(this.port.manage.list, {
  697. departmentId: -1,
  698. pageIndex: 1,
  699. pageSize: 99999,
  700. keyword: this.keyword
  701. },
  702. res => {
  703. if (res.code == "ok") {
  704. this.allActiveUsers = res.data.records.filter(u=>u.isActive == 1 && u.id != this.user.id);
  705. } else {
  706. this.$message({
  707. message: res.msg,
  708. type: "error"
  709. });
  710. }
  711. },
  712. error => {
  713. this.$message({
  714. message: error,
  715. type: "error"
  716. });
  717. });
  718. },
  719. showExportDialog() {
  720. this.exportDialogVisible = true;
  721. },
  722. exportUsers() {
  723. this.http.post('/user/exportUsers', {
  724. containInvalid: this.containInvalid
  725. },
  726. res => {
  727. if (res.code == "ok") {
  728. this.exportDialogVisible = false;
  729. var aTag = document.createElement('a');
  730. aTag.download = "全部员工列表.xls";
  731. aTag.href = res.data;
  732. aTag.click();
  733. } else {
  734. this.$message({
  735. message: res.msg,
  736. type: "error"
  737. });
  738. }
  739. },
  740. error => {
  741. this.$message({
  742. message: error,
  743. type: "error"
  744. });
  745. });
  746. },
  747. showSalaryList(item) {
  748. this.userSalaryListDialog = true;
  749. this.userSalaryList = [];
  750. this.http.post('/user/getUserSalaryList', {
  751. id: item.id
  752. },
  753. res => {
  754. if (res.code == "ok") {
  755. this.userSalaryList = res.data;
  756. } else {
  757. this.$message({
  758. message: res.msg,
  759. type: "error"
  760. });
  761. }
  762. },
  763. error => {
  764. this.$message({
  765. message: error,
  766. type: "error"
  767. });
  768. });
  769. },
  770. getUsers() {
  771. this.http.post(this.port.manage.list, {
  772. departmentId: -1,
  773. pageIndex: 1,
  774. pageSize: 99999,
  775. keyword: this.keyword
  776. },
  777. res => {
  778. if (res.code == "ok") {
  779. this.users = res.data.records;
  780. } else {
  781. this.$message({
  782. message: res.msg,
  783. type: "error"
  784. });
  785. }
  786. },
  787. error => {
  788. this.$message({
  789. message: error,
  790. type: "error"
  791. });
  792. });
  793. },
  794. onSalaryTypeChange(value) {
  795. if (value == 1) {
  796. this.insertForm.monthCost = null;
  797. }
  798. },
  799. //选中部门
  800. choseDept(value) {
  801. console.log(value);
  802. },
  803. //月成本输入变化
  804. oninput(e) {
  805. this.insertForm.cost = (this.insertForm.monthCost/this.timeType.monthDays/this.timeType.allday).toFixed(2);
  806. },
  807. // 获取本公司的工作时间设置
  808. getCompanyTimeSetting() {
  809. this.http.post('/time-type/getCompanyTimeSetting',{
  810. companyId: this.user.companyId
  811. },
  812. res => {
  813. if (res.code == "ok") {
  814. this.timeType = res.data;
  815. } else {
  816. this.$message({
  817. message: res.msg,
  818. type: "error"
  819. });
  820. }
  821. },
  822. error => {
  823. this.listLoading = false;
  824. this.$message({
  825. message: error,
  826. type: "error"
  827. });
  828. }
  829. );
  830. },
  831. // 批量导入人员
  832. importUser(item) {
  833. //首先判断文件类型
  834. let str = item.file.name.split(".");
  835. let format = str[str.length - 1];
  836. if (format != "xls" && format != "xlsx") {
  837. this.$message({
  838. message: "请选择.xls或.xlsx文件",
  839. type: "error"
  840. });
  841. } else {
  842. this.listLoading = true;
  843. let formData = new FormData();
  844. formData.append("file", item.file);
  845. this.http.uploadFile( this.port.manage.import, formData,
  846. res => {
  847. this.$refs.upload.clearFiles();
  848. this.listLoading = false;
  849. if (res.code == "ok") {
  850. this.$message({
  851. message: "导入成功",
  852. type: "success"
  853. });
  854. //重新读取列表
  855. this.getUser();
  856. } else {
  857. this.$message({
  858. message: res.msg,
  859. type: "error"
  860. });
  861. }
  862. },
  863. error => {
  864. this.$refs.upload.clearFiles();
  865. this.listLoading = false;
  866. this.$message({
  867. message: error,
  868. type: "error"
  869. });
  870. });
  871. }
  872. },
  873. //分页
  874. handleCurrentChange(val) {
  875. this.page = val;
  876. this.getUser();
  877. },
  878. handleSizeChange(val) {
  879. this.size = val;
  880. this.getUser();
  881. },
  882. //获取所有员工的列表
  883. getUser() {
  884. console.log(12345)
  885. this.listLoading = true;
  886. this.http.post( this.port.manage.list, {
  887. departmentId: this.depData.id,
  888. pageIndex: this.page,
  889. pageSize: this.size,
  890. keyword: this.keyword,
  891. status: this.status,
  892. role: this.role
  893. },
  894. res => {
  895. this.listLoading = false;
  896. if (res.code == "ok") {
  897. this.list = res.data.records;
  898. this.total = res.data.total;
  899. } else {
  900. this.$message({
  901. message: res.msg,
  902. type: "error"
  903. });
  904. }
  905. },
  906. error => {
  907. this.listLoading = false;
  908. this.$message({
  909. message: error,
  910. type: "error"
  911. });
  912. });
  913. },
  914. resetPwd(user) {
  915. this.$confirm( "确定要为" + user.name + "重置密码吗?", "重置密码", {
  916. confirmButtonText: "确定",
  917. cancelButtonText: "取消",
  918. type: "warning"
  919. })
  920. .then(() => {
  921. this.http.post('/user/resetPwd', { userId: user.id },
  922. res => {
  923. if (res.code == "ok") {
  924. this.$message({
  925. message: "密码已重置为000000,请通知员工及时修改",
  926. type: "success"
  927. });
  928. } else {
  929. this.$message({
  930. message: res.msg,
  931. type: "error"
  932. });
  933. }
  934. },
  935. error => {
  936. this.listLoading = false;
  937. this.$message({
  938. message: error,
  939. type: "error"
  940. });
  941. });
  942. })
  943. .catch(() => {});
  944. },
  945. // 新增、编辑人员
  946. openInsertDialog(i) {
  947. if (i != null) {
  948. var list = JSON.parse(JSON.stringify(this.list[i])) , arr = [] , array = [];
  949. if(list.departmentCascade!='0' && list.departmentCascade!=null) {
  950. if(list.departmentCascade.indexOf(",")>-1) {
  951. arr = list.departmentCascade.split(",");
  952. } else {
  953. arr = [].concat(list.departmentCascade)
  954. }
  955. }
  956. for(var i in arr) {
  957. array.push(parseInt(arr[i]))
  958. }
  959. this.insertForm = {
  960. id: list.id,
  961. name: list.name,
  962. phone: list.phone,
  963. role: list.role,
  964. monthCost:list.monthCost,
  965. cost: list.cost,
  966. departmentId: array.reverse(),
  967. salaryType: list.salaryType,
  968. costApplyDate: list.costApplyDate,
  969. };
  970. this.title = "编辑人员"
  971. } else {
  972. this.insertForm = {
  973. id: null,
  974. name: null,
  975. phone: null,
  976. role: null,
  977. monthCost:null,
  978. cost: null,
  979. departmentId: null,
  980. salaryType:0,
  981. costApplyDate: util.formatDate.format(new Date(), 'yyyy-MM-dd'),
  982. };
  983. this.title = "新增人员"
  984. }
  985. this.dialogVisible = true;
  986. },
  987. submitInsert() {
  988. var form = {}
  989. this.$refs.form1.validate(valid => {
  990. if (valid) {
  991. this.submitLoading = true;
  992. form = {
  993. name: this.insertForm.name,
  994. phone: this.insertForm.phone,
  995. role: this.insertForm.role,
  996. monthCost: this.insertForm.monthCost,
  997. cost: this.insertForm.cost,
  998. salaryType: this.insertForm.salaryType,
  999. };
  1000. if (this.insertForm.id != null) {
  1001. form.id = this.insertForm.id;
  1002. }
  1003. if (this.insertForm.costApplyDate != null) {
  1004. form.costApplyDate = this.insertForm.costApplyDate;
  1005. }
  1006. if (this.insertForm.departmentId != null) {
  1007. form.departmentId = this.insertForm.departmentId[this.insertForm.departmentId.length-1];
  1008. }
  1009. }
  1010. });
  1011. this.http.post( this.port.manage.insert, form,
  1012. res => {
  1013. this.submitLoading = false;
  1014. if (res.code == "ok") {
  1015. this.$message({
  1016. message: this.insertForm.id != null ? "修改" : "创建" + "成功",
  1017. type: "success"
  1018. });
  1019. this.dialogVisible = false;
  1020. this.getUser();
  1021. this.getUsers()
  1022. } else {
  1023. this.$message({
  1024. message: res.msg,
  1025. type: "error"
  1026. });
  1027. }
  1028. },
  1029. error => {
  1030. this.listLoading = false;
  1031. this.$message({
  1032. message: error,
  1033. type: "error"
  1034. });
  1035. });
  1036. },
  1037. // 切换角色
  1038. switchRole(index) {
  1039. this.listLoading = true;
  1040. this.http.post( this.port.manage.permission, { id: this.list[index].id },
  1041. res => {
  1042. this.listLoading = false;
  1043. if (res.code == "ok") {
  1044. this.$message({
  1045. message: "切换角色成功",
  1046. type: "success"
  1047. });
  1048. //重新读取列表
  1049. this.getUser();
  1050. } else {
  1051. this.$message({
  1052. message: res.msg,
  1053. type: "error"
  1054. });
  1055. }
  1056. },
  1057. error => {
  1058. this.listLoading = false;
  1059. this.$message({
  1060. message: error,
  1061. type: "error"
  1062. });
  1063. });
  1064. },
  1065. // 删除用户
  1066. setActive(item, isActive) {
  1067. var txt = isActive==1?"启用":"停用";
  1068. this.$confirm( "确定要"+txt +" " + item.name + " 吗?", "账号"+txt, {
  1069. confirmButtonText: "确定",
  1070. cancelButtonText: "取消",
  1071. type: "warning"
  1072. })
  1073. .then(() => {
  1074. this.listLoading = true;
  1075. this.http.post('/user/setActive', { id: item.id, isActive: isActive},
  1076. res => {
  1077. this.listLoading = false;
  1078. if (res.code == "ok") {
  1079. this.$message({
  1080. message: txt+"成功",
  1081. type: "success"
  1082. });
  1083. //重新读取列表
  1084. this.getUser();
  1085. } else {
  1086. this.$message({
  1087. message: res.msg,
  1088. type: "error"
  1089. });
  1090. }
  1091. },
  1092. error => {
  1093. this.listLoading = false;
  1094. this.$message({
  1095. message: error,
  1096. type: "error"
  1097. });
  1098. });
  1099. })
  1100. .catch(() => {});
  1101. },
  1102. // 修改老板的成本
  1103. openInsertDialog1(i) {
  1104. var list1 = JSON.parse(JSON.stringify(this.list[i])) , arr1 = [] , array1 = [];
  1105. if(list1.departmentCascade!='0' && list1.departmentCascade!=null) {
  1106. if(list1.departmentCascade.indexOf(",")>-1) {
  1107. arr1 = list1.departmentCascade.split(",");
  1108. } else {
  1109. arr1 = [].concat(list1.departmentCascade)
  1110. }
  1111. }
  1112. for(var i in arr1) {
  1113. array1.push(parseInt(arr1[i]))
  1114. }
  1115. console.log(list1)
  1116. this.insertForm = {
  1117. id: list1.id,
  1118. name: list1.name,
  1119. phone: list1.phone,
  1120. role: list1.role,
  1121. monthCost:list1.monthCost,
  1122. cost: list1.cost,
  1123. departmentId: array1.reverse(),
  1124. salaryType: list1.salaryType,
  1125. name: list1.name
  1126. };
  1127. this.dialogVisible1 = true;
  1128. },
  1129. submitInsert1() {
  1130. var form = {}
  1131. this.$refs.form1.validate(valid => {
  1132. if (valid) {
  1133. this.submitLoading = true;
  1134. form = {
  1135. id: this.insertForm.id,
  1136. name: this.insertForm.name,
  1137. phone: this.insertForm.phone,
  1138. role: this.insertForm.role,
  1139. monthCost: this.insertForm.monthCost,
  1140. cost: this.insertForm.cost
  1141. };
  1142. if (this.insertForm.departmentId != null) {
  1143. form.departmentId = this.insertForm.departmentId[this.insertForm.departmentId.length-1];
  1144. }
  1145. if (this.insertForm.costApplyDate != null) {
  1146. form.costApplyDate = this.insertForm.costApplyDate;
  1147. }
  1148. }
  1149. });
  1150. this.http.post( this.port.manage.insert, form,
  1151. res => {
  1152. this.submitLoading = false;
  1153. if (res.code == "ok") {
  1154. this.$message({
  1155. message: "修改成功",
  1156. type: "success"
  1157. });
  1158. this.dialogVisible1 = false;
  1159. //重新读取列表
  1160. this.getUser();
  1161. this.getUsers()
  1162. } else {
  1163. this.$message({
  1164. message: res.msg,
  1165. type: "error"
  1166. });
  1167. }
  1168. },
  1169. error => {
  1170. this.listLoading = false;
  1171. this.$message({
  1172. message: error,
  1173. type: "error"
  1174. });
  1175. });
  1176. },
  1177. // 获取部门列表
  1178. getDepartment() {
  1179. this.http.post( this.port.manage.depList, {},
  1180. res => {
  1181. if (res.code == "ok") {
  1182. var list = res.data , list1 = JSON.parse(JSON.stringify(res.data));
  1183. list.splice(0,0,{
  1184. id: -1,
  1185. label: '全部人员',
  1186. })
  1187. list.push({
  1188. id: 0,
  1189. label: '未分配',
  1190. })
  1191. this.data = list;
  1192. console.log(list, "部门数据")
  1193. this.option = this.changeArr(list1);
  1194. } else {
  1195. this.$message({
  1196. message: res.msg,
  1197. type: "error"
  1198. });
  1199. }
  1200. },
  1201. error => {
  1202. this.$message({
  1203. message: error,
  1204. type: "error"
  1205. });
  1206. });
  1207. },
  1208. // 修改数组
  1209. changeArr(arr) {
  1210. for (var i = 0; i < arr.length; i++) {
  1211. if(arr[i].id != -1 && arr[i].id != 0) {
  1212. if (arr[i].children != null && arr[i].children.length>0) {
  1213. arr[i].children = this.changeArr(arr[i].children);
  1214. }
  1215. arr[i].id && (arr[i].value = arr[i].id);
  1216. delete arr[i].id;
  1217. }
  1218. }
  1219. for(var i in arr) {
  1220. if(arr[i].id == -1 || arr[i].id == 0) {
  1221. arr.splice(i,1)
  1222. }
  1223. }
  1224. return arr;
  1225. },
  1226. // 部门列表点击
  1227. handleNodeClick(data) {
  1228. console.log(data, 999)
  1229. if(this.depData == null || data.id != this.depData.id) {
  1230. this.depData = data;
  1231. this.page = 1;
  1232. this.getUser();
  1233. }
  1234. },
  1235. // 新增、修改部门
  1236. createDepartment(i) {
  1237. setTimeout(() => {
  1238. var that = this
  1239. if(i == -2) {//创建子部门
  1240. that.depForm = {
  1241. id: null,
  1242. name: null,
  1243. parentId: null,
  1244. managerId: null,
  1245. }
  1246. if(that.depData.id != -1 && that.depData.id != 0) {
  1247. that.depForm.parentId = that.depData.id;
  1248. }
  1249. that.depTitle = "新增子部门";
  1250. } else if(i == -1) {//创建一级部门
  1251. that.depForm = {
  1252. id: null,
  1253. name: null,
  1254. parentId: null,
  1255. managerId: null,
  1256. }
  1257. that.depTitle = "新增部门";
  1258. } else {
  1259. if(that.depData.managerId == "null") {
  1260. that.depData.managerId = ''
  1261. }
  1262. if(that.depData.reportAuditUserid == "null") {
  1263. that.depData.reportAuditUserid = ''
  1264. }
  1265. that.depForm = {
  1266. id: that.depData.id,
  1267. name: that.depData.label,
  1268. parentId: that.depData.parentId,
  1269. managerId: that.depData.managerId,
  1270. reportAuditUserid: that.depData.reportAuditUserid
  1271. }
  1272. // if(that.depData.reportAuditUserid != null && that.depData.reportAuditUserid != "null" && that.depData.reportAuditUserid.length > 0) {
  1273. // that.depForm.reportAuditUserid = that.depData.reportAuditUserid
  1274. // }
  1275. that.depTitle = "编辑部门";
  1276. }
  1277. that.departmentVisible = true;
  1278. })
  1279. // if(i == -2) {//创建子部门
  1280. // this.depForm = {
  1281. // id: null,
  1282. // name: null,
  1283. // parentId: null,
  1284. // managerId: null,
  1285. // }
  1286. // if(this.depData.id != -1 && this.depData.id != 0) {
  1287. // this.depForm.parentId = this.depData.id;
  1288. // }
  1289. // this.depTitle = "新增子部门";
  1290. // } else if(i == -1) {//创建一级部门
  1291. // this.depForm = {
  1292. // id: null,
  1293. // name: null,
  1294. // parentId: null,
  1295. // managerId: null,
  1296. // }
  1297. // this.depTitle = "新增部门";
  1298. // } else {
  1299. // if(this.depData.managerId == "null") {
  1300. // this.depData.managerId = ''
  1301. // }
  1302. // if(this.depData.reportAuditUserid == "null") {
  1303. // this.depData.reportAuditUserid = ''
  1304. // }
  1305. // this.depForm = {
  1306. // id: this.depData.id,
  1307. // name: this.depData.label,
  1308. // parentId: this.depData.parentId,
  1309. // managerId: this.depData.managerId,
  1310. // reportAuditUserid: this.depData.reportAuditUserid
  1311. // }
  1312. // // if(this.depData.reportAuditUserid != null && this.depData.reportAuditUserid != "null" && this.depData.reportAuditUserid.length > 0) {
  1313. // // this.depForm.reportAuditUserid = this.depData.reportAuditUserid
  1314. // // }
  1315. // this.depTitle = "编辑部门";
  1316. // }
  1317. // this.departmentVisible = true;
  1318. },
  1319. submitDepartment() {
  1320. this.$refs.depForm.validate(valid => {
  1321. if (valid) {
  1322. var form = {
  1323. name: this.depForm.name,
  1324. };
  1325. if(this.depForm.id != null) {
  1326. form.id = this.depForm.id
  1327. }
  1328. if(this.depForm.parentId != null) {
  1329. form.parentId = this.depForm.parentId
  1330. }
  1331. if (this.depForm.managerId) {
  1332. form.managerId = this.depForm.managerId
  1333. }
  1334. console.log(this.depForm)
  1335. if (this.depForm.reportAuditUserid) {
  1336. form.reportAuditUserid = this.depForm.reportAuditUserid
  1337. }
  1338. this.http.post( this.depForm.id==null?this.port.manage.add:this.port.manage.edit, form,
  1339. res => {
  1340. if (res.code == "ok") {
  1341. this.$message({
  1342. message: this.depForm.id==null?"新增成功":"修改成功",
  1343. type: "success"
  1344. });
  1345. this.departmentVisible = false;
  1346. if (this.depForm.id !=null) {
  1347. this.depData.label = form.name;
  1348. this.depData.managerId = form.managerId;
  1349. }
  1350. this.getDepartment();
  1351. } else {
  1352. this.$message({
  1353. message: res.msg,
  1354. type: "error"
  1355. });
  1356. }
  1357. },
  1358. error => {
  1359. this.listLoading = false;
  1360. this.$message({
  1361. message: error,
  1362. type: "error"
  1363. });
  1364. });
  1365. }
  1366. });
  1367. },
  1368. // 删除部门
  1369. deleteDep() {
  1370. var that = this
  1371. setTimeout(() =>{
  1372. that.$confirm( "确定要删除部门" + that.depData.label + "吗?", "删除部门", {
  1373. confirmButtonText: "确定",
  1374. cancelButtonText: "取消",
  1375. type: "warning"
  1376. })
  1377. .then(() => {
  1378. that.listLoading = true;
  1379. that.http.post( that.port.manage.del, { id: that.depData.id },
  1380. res => {
  1381. that.listLoading = false;
  1382. if (res.code == "ok") {
  1383. that.$message({
  1384. message: "删除成功",
  1385. type: "success"
  1386. });
  1387. that.depData = {
  1388. id: -1,
  1389. label: '全部人员',
  1390. }
  1391. that.getDepartment();
  1392. that.getUser();
  1393. } else {
  1394. that.$message({
  1395. message: res.msg,
  1396. type: "error"
  1397. });
  1398. }
  1399. },
  1400. error => {
  1401. that.listLoading = false;
  1402. that.$message({
  1403. message: error,
  1404. type: "error"
  1405. });
  1406. });
  1407. })
  1408. .catch(() => {});
  1409. },100);
  1410. // this.$confirm( "确定要删除部门" + this.depData.label + "吗?", "删除部门", {
  1411. // confirmButtonText: "确定",
  1412. // cancelButtonText: "取消",
  1413. // type: "warning"
  1414. // })
  1415. // .then(() => {
  1416. // this.listLoading = true;
  1417. // this.http.post( this.port.manage.del, { id: this.depData.id },
  1418. // res => {
  1419. // this.listLoading = false;
  1420. // if (res.code == "ok") {
  1421. // this.$message({
  1422. // message: "删除成功",
  1423. // type: "success"
  1424. // });
  1425. // this.depData = {
  1426. // id: -1,
  1427. // label: '全部人员',
  1428. // }
  1429. // this.getDepartment();
  1430. // this.getUser();
  1431. // } else {
  1432. // this.$message({
  1433. // message: res.msg,
  1434. // type: "error"
  1435. // });
  1436. // }
  1437. // },
  1438. // error => {
  1439. // this.listLoading = false;
  1440. // this.$message({
  1441. // message: error,
  1442. // type: "error"
  1443. // });
  1444. // });
  1445. // })
  1446. // .catch(() => {});
  1447. },
  1448. // 关键搜索
  1449. searchList() {
  1450. console.log(this.keyword)
  1451. this.listLoading = true;
  1452. this.http.post( this.port.manage.list, {
  1453. departmentId: this.depData.id,
  1454. pageIndex: this.page,
  1455. pageSize: this.size,
  1456. keyword: this.keyword
  1457. },
  1458. res => {
  1459. this.listLoading = false;
  1460. if (res.code == "ok") {
  1461. this.list = res.data.records;
  1462. this.total = res.data.total;
  1463. } else {
  1464. this.$message({
  1465. message: res.msg,
  1466. type: "error"
  1467. });
  1468. }
  1469. },
  1470. error => {
  1471. this.listLoading = false;
  1472. this.$message({
  1473. message: error,
  1474. type: "error"
  1475. });
  1476. });
  1477. }
  1478. },
  1479. created() {
  1480. let height = window.innerHeight;
  1481. this.tableHeight = height - 195;
  1482. const that = this;
  1483. window.onresize = function temp() {
  1484. that.tableHeight = window.innerHeight - 195;
  1485. };
  1486. },
  1487. mounted() {
  1488. this.deactiveDate = util.formatDate.format(new Date(), 'yyyy-MM-dd');
  1489. this.getDepartment();
  1490. this.getUser();
  1491. this.getCompanyTimeSetting();
  1492. this.getUsers();
  1493. }
  1494. };
  1495. </script>
  1496. <style lang="scss" scoped>
  1497. .custom-tree-node {
  1498. flex: 1;
  1499. display: flex;
  1500. align-items: center;
  1501. justify-content: space-between;
  1502. font-size: 14px;
  1503. padding-right: 8px;
  1504. }
  1505. .left {
  1506. border-right: 1px solid #f2f2f2;
  1507. overflow: hidden;
  1508. .department {
  1509. background:#f2f2f2;
  1510. line-height: 60px;
  1511. color:#666;
  1512. padding:0 10px;
  1513. height:60px;
  1514. font-size: 15px;
  1515. div {
  1516. float: right;
  1517. color: #20a0ff;
  1518. font-size: 14px;
  1519. cursor: pointer;
  1520. }
  1521. }
  1522. .tree {
  1523. overflow: auto;
  1524. }
  1525. }
  1526. .nowTime {
  1527. height: 40px;
  1528. line-height: 40px;
  1529. font-size: 16px;
  1530. color: #20a0ff;
  1531. margin-left: 10px;
  1532. cursor: pointer;
  1533. i {
  1534. margin-right: 10px;
  1535. }
  1536. }
  1537. .none {
  1538. display: none;
  1539. }
  1540. .block {
  1541. display: block;
  1542. }
  1543. </style>
  1544. <style lang="scss">
  1545. .tree {
  1546. .el-tree-node__label {
  1547. overflow-x: hidden;
  1548. white-space: nowrap;
  1549. text-overflow: ellipsis;
  1550. }
  1551. }
  1552. .el-divider--horizontal {
  1553. margin: 0px;
  1554. background:#f3f3f3;
  1555. }
  1556. //全局的作用范围
  1557. .el-tree-node__content {
  1558. height:36px;
  1559. }
  1560. </style>