updateServe.vue 38 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125
  1. <template>
  2. <div class="updateServer_container">
  3. <div class="card_cont">
  4. <div class="btn_top">
  5. <span style="fontSize:14px;color:#409EFF;cursor:pointer" @click="previewHistory">历史签约</span>
  6. </div>
  7. <div class="info">
  8. <h3 class="tit">客户信息</h3>
  9. <ul class="info_list">
  10. <li>
  11. 客户名称:{{companyInfo.CompanyName}}
  12. </li>
  13. <li>
  14. 社会信用码:{{companyInfo.CreditCode}}
  15. </li>
  16. <li>
  17. 地址:{{companyInfo.Address||''}}
  18. </li>
  19. <li>
  20. 客户类型:{{companyInfo.CompanyType}}
  21. </li>
  22. <li>
  23. 客户状态:{{companyInfo.Status}}
  24. </li>
  25. <li>
  26. 客户来源:{{companyInfo.Source}}
  27. </li>
  28. <li>
  29. 行业:{{companyInfo.IndustryName}}
  30. </li>
  31. <li>
  32. 所属销售:{{companyInfo.SellerName}}
  33. </li>
  34. <li>
  35. 备注:{{companyInfo.Reasons}}
  36. </li>
  37. </ul>
  38. </div>
  39. </div>
  40. <div class="card_cont">
  41. <div class="apply_info">
  42. <h3 style="fontSize:16px;">{{$route.path=='/updateCustom'?'续约申请':'补充协议'}}</h3>
  43. <div class="info_cont">
  44. <el-form
  45. @submit.native.prevent
  46. inline
  47. :model="dataForm"
  48. :rules="formRule"
  49. hide-required-asterisk
  50. ref="dataForm"
  51. label-width="100px"
  52. class="demo-ruleForm">
  53. <el-form-item label="选择合同类型" prop="contract_type" style="width:70%;padding-left:25px;" v-if="!isRaiSellerShow">
  54. <!-- <i style="color:#f00;fontSize:20px;position:absolute;left:-114px;top:10%;">*</i> -->
  55. <el-radio label="续约合同" v-model="dataForm.contract_type" v-if="$route.path=='/updateCustom'">续约合同</el-radio>
  56. <el-radio label="补充协议" v-model="dataForm.contract_type" v-else>补充协议</el-radio>
  57. </el-form-item>
  58. <el-form-item label-width="140px" label="请输入合同编号" style="width:100%" prop="CreditCode" v-if="isRaiSellerShow"
  59. :rules="{required: true, message: '请输入合同编号', trigger: 'blur'}">
  60. <i style="color:#f00;fontSize:20px;position:absolute;left:-128px;top:10%;">*</i>
  61. <el-autocomplete
  62. style="width:360px;"
  63. v-model="dataForm.CreditCode"
  64. :fetch-suggestions="querySearchCreditCode"
  65. placeholder="请复制申请用印时生成的合同编号"
  66. @select="handleSelectCreditCode"
  67. ></el-autocomplete>
  68. </el-form-item>
  69. <el-form-item label="合同期限" prop="term" style="marginRight:60px;">
  70. <i style="color:#f00;fontSize:20px;position:absolute;left:-90px;top:10%;">*</i>
  71. <el-date-picker
  72. :disabled="timeDisable || isRaiSellerShow"
  73. v-model="dataForm.term"
  74. type="daterange"
  75. range-separator="至"
  76. start-placeholder="开始日期"
  77. end-placeholder="结束日期"
  78. @change="dateChange"
  79. value-format="yyyy-MM-dd"
  80. :picker-options="pickerOptions"
  81. style="width:400px;">
  82. </el-date-picker>
  83. </el-form-item>
  84. <el-form-item label="合同金额" prop="amount" style="marginRight:60px;">
  85. <i style="color:#f00;fontSize:20px;position:absolute;left:-90px;top:10%;">*</i>
  86. <el-input
  87. v-model.number="dataForm.amount"
  88. :disabled="isRaiSellerShow"
  89. placeholder="请输入金额"
  90. style="width:400px"
  91. clearable></el-input>
  92. <span style="color:#666;">元</span>
  93. </el-form-item>
  94. <el-form-item label="付款方式" prop="payway" style="marginRight:60px;">
  95. <i style="color:#f00;fontSize:20px;position:absolute;left:-90px;top:10%;">*</i>
  96. <el-select v-model="dataForm.payway" placeholder="请选择付款方式" style="width:400px;" clearable>
  97. <el-option
  98. v-for="item in ['月付','季付','半年付','年付','两年付','三年付']"
  99. :key="item"
  100. :label="item"
  101. :value="item">
  102. </el-option>
  103. </el-select>
  104. </el-form-item>
  105. <el-form-item label="付款渠道" prop="payfrom">
  106. <i style="color:#f00;fontSize:20px;position:absolute;left:-90px;top:10%;">*</i>
  107. <el-input
  108. v-model="dataForm.payfrom"
  109. placeholder="填写代支付的渠道名称,没有可以填无"
  110. style="width:400px"
  111. clearable></el-input>
  112. </el-form-item>
  113. <el-form-item label="套餐类型" prop="setmeal" style="display:block;" :rules="{ required: true, message: '请选择套餐',trigger: 'change' }" v-if="companyInfo.CompanyType=='ficc' || isRoleType== 'ficc'">
  114. <i style="color:#f00;fontSize:20px;position:absolute;left:-90px;top:10%;">*</i>
  115. <el-radio-group v-model="dataForm.setmeal" @change="setmealChange">
  116. <el-radio :label="1">大套餐</el-radio>
  117. <el-radio :label="2">小套餐</el-radio>
  118. </el-radio-group>
  119. </el-form-item>
  120. <el-form-item class="textarea_item" style="width:97%;paddingLeft:26px;" prop="CheckList">
  121. <label style="display:block;marginBottom:10px;fontSize:16px;position:relative;color:#666;">
  122. <i style="color:#f00;fontSize:20px;position:absolute;left:-15px;top:10%;">*</i>
  123. 权限设置
  124. </label>
  125. <template v-if="companyInfo.CompanyType=='权益' || isRoleType== '权益'">
  126. <raiPermissionbox ref="raiPermissionboxRef" v-for="item in authList" :key="item.ClassifyName" :data="item" :formData="dataForm"
  127. :hasNoChild="hasNoChild"></raiPermissionbox>
  128. </template>
  129. <ul v-else class="menu_lists" style="width:100%">
  130. <li v-for="item in authList" :key="item.ClassifyName" class="menu_item">
  131. <el-checkbox :indeterminate="item.isIndeterminate" v-model="item.checkAll" :disabled="setSelectPerDisabled(item)" @change="handleCheckAll(item,'auth')" style="marginRight:30px;fontWeight:bold;minWidth:90px;">{{item.ClassifyName+':'}}</el-checkbox>
  132. <el-checkbox-group v-model="item.CheckList" @change="handleChecked(item)">
  133. <el-checkbox v-for="list in item.Items" :label="list.ChartPermissionId" :key="list.ChartPermissionId" class="list_item" :disabled="list.disabled||($route.path=='/updateCustom'&&list.IsPublic==1)">{{list.PermissionName}}</el-checkbox>
  134. </el-checkbox-group>
  135. </li>
  136. </ul>
  137. </el-form-item>
  138. <el-form-item prop="imglist" style="width:97%;paddingLeft:26px;" class="textarea_item">
  139. <label style="display:block;marginBottom:10px;fontSize:16px;position:relative;color:#666;">
  140. <i style="color:#f00;fontSize:20px;position:absolute;left:-15px;top:10%;">*</i>
  141. 上传合同附件<span style="fontSize:12px;color:#f00;">(建议上传盖章后的合同,支持png、jpg、pdf格式)</span>
  142. <input type="file" name="file" @change="fileSelected()" id="file" class="true-file" style="display:none;">
  143. <el-button type="primary" size="medium" @click.native="clickinput('')" style="marginLeft:20px;">点击上传</el-button>
  144. </label>
  145. <ul class="img_cont">
  146. <li v-for="(img,index) in dataForm.imglist" :key="img" class="img_item">
  147. <!-- <el-image :src="img" alt="" style="background:#aaa;width:240px;height:180px;" :preview-src-list="dataForm.imglist" :id="'img'+index"/> -->
  148. <pdf ref="pdf" :src="img" style="width:240px;height:180px;overflow:hidden" v-if="img.indexOf('.pdf')!=-1" @click.native="preview('img'+index,index,img)"></pdf>
  149. <el-image :src="img" alt="" style="background:#aaa;width:240px;height:180px;" :id="'img'+index" v-else @click.native="preview('img'+index,index,img)"/>
  150. <i class="el-icon-zoom-in" style="position:absolute;right:12px;top:12px;color:#fff;" @click="preview('img'+index,index,img)"></i>
  151. <span style="position:absolute;right:12px;bottom:12px;color:#409EFF;fontSize:16px;cursor:pointer;" @click.stop="clickinput(index+1)">重新上传</span>
  152. </li>
  153. </ul>
  154. </el-form-item>
  155. </el-form>
  156. </div>
  157. </div>
  158. <div class="bot_cont">
  159. <div style="display:flex;justify-content:center;margin:80px 0 30px;">
  160. <el-button type="primary" style="width:80px;marginRight:24px;" @click="saveHandle">提交</el-button>
  161. <el-button type="primary" plain style="width:80px;" @click="cancelHandle">取消</el-button>
  162. </div>
  163. </div>
  164. </div>
  165. <!-- 历史签约弹窗 -->
  166. <el-dialog
  167. :visible.sync="isPreview"
  168. :modal-append-to-body='false'
  169. :show-close="false"
  170. custom-class="update_dialog"
  171. center
  172. top="7vh"
  173. width="60%">
  174. <div slot="title" style="display:flex;alignItems:center;">
  175. <span style="fontSize:16px;color:#333;fontWeight:bold;">历史签约</span>
  176. </div>
  177. <template v-if="dealList.length">
  178. <div v-for="(item,index) in dealList" :key="index" class="history_item">
  179. <el-tag style="margin-bottom:30px;" size="small">合同编号:{{item.ContractCode}}</el-tag>
  180. <ul class="detail_item">
  181. <li>
  182. <span style="min-width:300px;marginRight:260px;display:inline-block;">合同期限:{{item.StartDate+'-'+item.EndDate}}</span>
  183. <span>合同金额:{{item.Money}}元</span>
  184. </li>
  185. <li>
  186. <span style="min-width:300px;marginRight:260px;display:inline-block;">付款方式:{{item.PayMethod}}</span>
  187. <span>付款渠道:{{item.PayChannel}}</span>
  188. </li>
  189. <li class="textarea_item" style="width:97%;">
  190. <label style="display:block;marginBottom:20px;fontSize:16px;position:relative;">
  191. 权限设置
  192. </label>
  193. <ul class="menu_lists">
  194. <li v-for="auth in item.PermissionList" :key="auth.ClassifyName" class="menu_item">
  195. <el-checkbox :indeterminate="auth.CheckList.length>0&&auth.CheckList.length<auth.Items.length" v-model="auth.CheckAll" disabled @change="handleCheckAll(item)" style="marginRight:30px;fontWeight:bold;">{{auth.ClassifyName+':'}}</el-checkbox>
  196. <el-checkbox-group v-model="auth.CheckList" @change="handleChecked(item)" disabled>
  197. <el-checkbox v-for="list in auth.Items" :label="list.ChartPermissionId" :key="list.ChartPermissionId" class="list_item">{{list.PermissionName}}</el-checkbox>
  198. </el-checkbox-group>
  199. </li>
  200. </ul>
  201. </li>
  202. </ul>
  203. </div>
  204. </template>
  205. <span v-else>暂无历史合同</span>
  206. </el-dialog>
  207. <!-- 图片预览 -->
  208. <imgPreview
  209. :isShowToggle="isShowToggle"
  210. :isPreview="isPreviewimg"
  211. :arr="dataForm.imglist"
  212. :actIndex="preAct"
  213. @close="closePreview"
  214. @togglePre="togglePre"></imgPreview>
  215. </div>
  216. </template>
  217. <script>
  218. import { customInterence } from '@/api/api.js'
  219. import imgPreview from '@/components/imgPreview.vue'
  220. // import JurisdictionCheck from '../compontents/jurisdictionCheck.vue';
  221. import raiPermissionbox from './components/raiPermissionbox'
  222. import pdf from 'vue-pdf'
  223. export default {
  224. name:'',
  225. components: {imgPreview , pdf,raiPermissionbox},
  226. data () {
  227. return {
  228. temContractData:{},// 最后一份有效合同详情数据
  229. pickerOptions: {},
  230. companyInfo:JSON.parse(sessionStorage.getItem('companyInfo')) || {},//客户基本信息
  231. isRoleType:localStorage.getItem('RoleType'),
  232. authList2:[],
  233. dealList:[],//合同列表
  234. isPreview:false,//合同弹窗
  235. dataForm:{
  236. contract_type:this.$route.path=='/updateCustom'?'续约合同':'补充协议',
  237. term:'',
  238. amount:'',
  239. payway:'',
  240. payfrom:'',
  241. imglist:[],
  242. setmeal:'',
  243. qyBigServeCheck:0,
  244. CreditCode:'',
  245. },
  246. formRule:{
  247. // contract_type:[
  248. // { required: true, message: '合同类型不能为空', trigger: 'blur' },
  249. // ],
  250. term:[
  251. { required: true, message: '合同期限不能为空', trigger: 'blur' },
  252. ],
  253. amount:[
  254. { required: true, message: '合同金额不能为空', trigger: 'blur' },
  255. { type: 'number', message: '合同金额必须为数字'}
  256. ],
  257. payway:[
  258. { required: true, message: '付款方式不能为空', trigger: 'change' },
  259. ],
  260. payfrom:[
  261. { required: true, message: '付款渠道不能为空', trigger: 'blur' },
  262. ],
  263. imglist:[
  264. { required: true, message: '合同附件不能为空', trigger: 'change' },
  265. ]
  266. },
  267. authList:[],//权限列表
  268. img_replace:'',//重新上传的img
  269. isPreviewimg:false,
  270. preAct:"",
  271. isShowToggle:false,//是否显示切换
  272. timeDisable:false,//是否能选择日期 补充协议不可选择日期
  273. equityCheckData:[], //权益复选框
  274. citiesEquity:[], //
  275. citiesListEquity:[], //
  276. citiesListpitchOn:[],
  277. };
  278. },
  279. // 补充协议 最大截至日期 为权限中最大的
  280. // 续约 ficc 起始时间 为权限中最大的
  281. // 权益
  282. methods: {
  283. /* 获取客户大于今天的最后一份有效合同详情 */
  284. async getLastedContractInfo(){
  285. let res=await customInterence.lastContractInfo({CompanyId:this.companyInfo.CompanyId})
  286. if(res.Ret!=200) return
  287. this.temContractData=res.Data
  288. // 续约申请
  289. if(this.$route.path=='/updateCustom'){
  290. this.initUpdateTypeData()
  291. }
  292. // 补充协议
  293. if(this.$route.path=='/addAgreement'){
  294. let today=this.formatDate(new Date())
  295. // 找出权限中最晚截止的那个作为截至日期
  296. let timearr=this.temContractData.map(item=> item.EndDate)
  297. let maxTime=Math.max.apply(null, timearr.map(item => (new Date(item)).getTime()));
  298. let endDate=this.formatDate(new Date(maxTime))
  299. this.dataForm.term=[today,endDate]
  300. this.timeDisable=true
  301. }
  302. },
  303. // 格式化时间
  304. formatDate(date){
  305. let year=date.getFullYear()
  306. let month=date.getMonth()+1
  307. let day=date.getDate()
  308. return `${year}-${month<10?'0'+month:month}-${day<10?'0'+day:day}`
  309. },
  310. // 续约申请处理数据
  311. initUpdateTypeData(){
  312. let RoleType=this.companyInfo.CompanyType
  313. if(RoleType=='ficc'){
  314. // FICC:续约合同的起始日期需要在权限中最大的时间
  315. // 找出权限中最晚截止的那个作为截至日期
  316. let timearr=this.temContractData.map(item=> item.EndDate)
  317. let maxTime=Math.max.apply(null, timearr.map(item => (new Date(item)).getTime()));
  318. let endDate=this.formatDate(new Date(maxTime))
  319. this.pickerOptions={
  320. disabledDate(time) {
  321. return time.getTime() < new Date(endDate).getTime();
  322. }
  323. }
  324. }
  325. },
  326. //选择时间 权益:续约合同期限与上一份合同期限有重叠时,不能勾选同一行业.
  327. // 选择的时间和temContractData 中的时间比较 然后格式化权限选择列表
  328. dateChange(){
  329. if(parseInt((new Date() - new Date(this.dataForm.term[1]))/(1000*3600*24)) > 0) {
  330. this.$message.error('结束日期不能小于今天!')
  331. this.dataForm.term = []
  332. return
  333. }
  334. // if(this.companyInfo.CompanyType!='权益') return
  335. // if(!this.dataForm.term) return
  336. // let time1=new Date(this.dataForm.term[0]).getTime() //选择的开始时间
  337. // let time2=new Date(this.dataForm.term[1]).getTime() //选择的结束时间
  338. // let time3=new Date(this.temContractData.StartDate).getTime()// 上份合同的开始时间
  339. // let time4=new Date(this.temContractData.EndDate).getTime()// 上份合同的结束时间
  340. // if(time1>time4||time2<time3){
  341. // //没有重叠
  342. // console.log('时间无重叠');
  343. // }else{
  344. // //时间有重叠
  345. // console.log('时间有重叠');
  346. // this.$message.warning('合同期限内行业重复')
  347. // let arr=[]
  348. // this.temContractData.PermissionList.forEach(item=>{
  349. // arr=[...arr,...item.CheckList]
  350. // })
  351. // this.authList=this.authList.map(item=>{
  352. // item.CheckList=[]
  353. // item.isIndeterminate=false
  354. // item.Items.forEach(item2=>{
  355. // if(arr.indexOf(item2.ChartPermissionId)!=-1){
  356. // item2.disabled=true
  357. // }
  358. // })
  359. // return item
  360. // })
  361. // }
  362. },
  363. // /* 重新申请获取上次申请的合同信息并回显 */
  364. // getLastContract() {
  365. // customInterence.reapplyDetail({
  366. // CompanyApprovalId:parseInt(this.companyInfo.CompanyApprovalId)
  367. // }).then(res => {
  368. // if(res.Ret === 200) {
  369. // /* 处理日期 */
  370. // let date_arr = [];
  371. // date_arr.push(res.Data.Item.StartDate);
  372. // date_arr.push(res.Data.Item.EndDate);
  373. // this.dataForm = {
  374. // term:date_arr,
  375. // contract_type: res.Data.Item.ContractType,
  376. // amount:res.Data.Item.Money,
  377. // payway:res.Data.Item.PayMethod,
  378. // payfrom:res.Data.Item.PayChannel,
  379. // imglist:res.Data.Item.ImgUrl.split('#'),//合同列表图片
  380. // setmeal:res.Data.Item.PackageType
  381. // }
  382. // if(this.companyInfo.CompanyType == '权益' || this.isRoleType== '权益') {
  383. // let newData =res.Data.Item.PermissionList.length ? res.Data.Item.PermissionList[0] : []
  384. // this.citiesEquity = newData.ItemsType || []
  385. // this.citiesListEquity = newData.Items || []
  386. // this.citiesListpitchOn = newData.CheckList || []
  387. // }else {
  388. // /* 处理权限列表 */
  389. // let newArr = [];
  390. // res.Data.Item.PermissionList.forEach(item => {
  391. // item.Items=item.Items.map(item2=>{
  392. // return{
  393. // ...item2,
  394. // disabled:false
  395. // }
  396. // })
  397. // let obj = {
  398. // checkAll:item.CheckList&&item.CheckList.length===item.Items.length?true:false,
  399. // isIndeterminate:item.CheckList&&item.CheckList.length>0 && item.CheckList.length<item.Items.length,
  400. // ...item,
  401. // }
  402. // newArr.push(obj)
  403. // })
  404. // this.authList = newArr;
  405. // this.dataForm.setmeal == 1 && this.setmealChange()
  406. // }
  407. // }
  408. // })
  409. // },
  410. getLastContract() {
  411. customInterence.reapplyDetail({
  412. CompanyApprovalId:parseInt(this.companyInfo.CompanyApprovalId)
  413. }).then(res => {
  414. if(res.Ret === 200) {
  415. /* 处理日期 */
  416. let date_arr = [];
  417. date_arr.push(res.Data.Item.StartDate);
  418. date_arr.push(res.Data.Item.EndDate);
  419. this.dataForm = {
  420. term:date_arr,
  421. contract_type: res.Data.Item.ContractType,
  422. amount:res.Data.Item.Money,
  423. payway:res.Data.Item.PayMethod,
  424. payfrom:res.Data.Item.PayChannel,
  425. imglist:res.Data.Item.ImgUrl.split('#'),//合同列表图片
  426. qyBigServeCheck:res.Data.Item.RaiPackageType
  427. }
  428. /* 处理权限列表 */
  429. let newArr = [];
  430. if(this.companyInfo.CompanyType == '权益' || this.isRoleType== '权益') {
  431. res.Data.Item.PermissionList[0].Items.map(item => {
  432. item.disabled=item.isIndeterminate=false
  433. if(item.ChartPermissionId==22 && (!item.Child)) this.hasNoChild=true
  434. })
  435. /* 处理数据把复选框 拆分成三个*/
  436. res.Data.Item.PermissionList.length&&res.Data.Item.PermissionList.forEach(item => {
  437. let arr = item.Items.filter(key=> [22,21,20,19,23,156, 30, 69,148,62].includes(key.ChartPermissionId))
  438. let ItemsPrivate = item.Items.filter(key=> [29,31,52,20031,20032,53,54].includes(key.ChartPermissionId))
  439. let ItemsUp = item.Items.filter(key=> key.PermissionName.includes('升级'))
  440. let ItemsBig = item.Items.filter(key=> key.ChartPermissionId==0)
  441. let obj = {
  442. ...item,
  443. Items:arr,
  444. ItemsPrivate,
  445. ItemsUp,
  446. ItemsBig
  447. }
  448. newArr.push(obj)
  449. })
  450. } else {
  451. res.Data.Item.PermissionList.forEach(item => {
  452. item.Items=item.Items.map(item2=>{
  453. return{
  454. ...item2,
  455. disabled:false
  456. }
  457. })
  458. let obj = {
  459. checkAll:item.CheckList&&item.CheckList.length===item.Items.length?true:false,
  460. isIndeterminate:item.CheckList&&item.CheckList.length>0 && item.CheckList.length<item.Items.length,
  461. ...item,
  462. }
  463. newArr.push(obj)
  464. })
  465. }
  466. this.authList = newArr;
  467. }
  468. })
  469. },
  470. /* 获取基本权限信息 */
  471. // getAuthBasic() {
  472. // customInterence.authList().then(res => {
  473. // if(res.Ret === 200) {
  474. // // if(this.companyInfo.CompanyType == '权益'|| this.isRoleType== '权益') {
  475. // // this.citiesEquity = res.Data.ListType ? res.Data.ListType[0].Items : [];
  476. // // this.citiesListEquity = res.Data.List ? res.Data.List[0].Items : [];
  477. // // }else {
  478. // let newArr = [];
  479. // res.Data.List.length&&res.Data.List.forEach(item => {
  480. // item.Items=item.Items.map(item2=>{
  481. // return{
  482. // ...item2,
  483. // disabled:false
  484. // }
  485. // })
  486. // let obj = {
  487. // checkAll:false,
  488. // isIndeterminate:item.ClassifyName === '宏观经济'?true:false,
  489. // ...item,
  490. // }
  491. // newArr.push(obj)
  492. // this.authList = newArr;
  493. // })
  494. // this.authList = newArr;
  495. // // }
  496. // }
  497. // })
  498. // },
  499. /* 获取基本权限信息 */
  500. getAuthBasic() {
  501. customInterence.authList({
  502. IsShowYanXuanKouDian:true,
  503. }).then(res => {
  504. if(res.Ret === 200) {
  505. let newArr = [];
  506. if(this.companyInfo.CompanyType == '权益' || this.isRoleType== '权益') {
  507. res.Data.List[0].Items.map(item => {
  508. item.disabled=item.isIndeterminate=false
  509. if(item.ChartPermissionId==22 && (!item.Child)) this.hasNoChild=true
  510. })
  511. /* 处理数据把复选框 拆分成三个*/
  512. res.Data.List.length&&res.Data.List.forEach(item => {
  513. let arr = item.Items.filter(key=> [22,21,20,19,23,156, 30, 69,148,62].includes(key.ChartPermissionId))
  514. let ItemsPrivate = item.Items.filter(key=> [29,31,52,20031,20032,53,54].includes(key.ChartPermissionId))
  515. let ItemsUp = item.Items.filter(key=> key.PermissionName.includes('升级'))
  516. let ItemsBig = item.Items.filter(key=> key.ChartPermissionId==0)
  517. let obj = {
  518. ...item,
  519. Items:arr,
  520. ItemsPrivate,
  521. ItemsUp,
  522. ItemsBig
  523. }
  524. newArr.push(obj)
  525. })
  526. }else {
  527. res.Data.List.length&&res.Data.List.forEach(item => {
  528. item.Items=item.Items||[]
  529. const temarr=item.Items?item.Items.filter(_e=>_e.IsPublic==1):[]
  530. item.Items=item.Items.map(item2=>{
  531. return{
  532. ...item2,
  533. disabled:false
  534. }
  535. })
  536. let obj = {
  537. checkAll:item.Items.length>0?temarr.length==item.Items.length:false,
  538. isIndeterminate:item.Items.length>0?temarr.length==item.Items.length?false:item.Items.some(_e=>_e.IsPublic==1):false,
  539. ...item,
  540. }
  541. newArr.push(obj)
  542. })
  543. }
  544. this.authList = newArr;
  545. }
  546. })
  547. },
  548. setSelectPerDisabled(data){
  549. const arr=data.Items?data.Items.filter(_e=>_e.IsPublic==1):[]
  550. return (this.$route.path=='/updateCustom'&&arr.length==data.Items.length) || data.disabled
  551. //($route.path=='/updateCustom'&&item.IsPublic==1) || item.disabled
  552. },
  553. /* 获取历史签约 */
  554. getDealList() {
  555. customInterence.historydeal({
  556. CompanyId:this.companyInfo.CompanyId,
  557. CompanyType:this.companyInfo.CompanyType
  558. }).then(res => {
  559. if(res.Ret === 200) {
  560. let auth = [];
  561. res.Data.List&&res.Data.List.forEach(item=> {
  562. item.StartDate = item.StartDate.replace(/-/g,'.')
  563. item.EndDate = item.EndDate.replace(/-/g,'.')
  564. item.PermissionList.forEach(auth => {
  565. auth.CheckAll = auth.CheckList&&auth.CheckList.length===auth.Items.length?true:false
  566. })
  567. })
  568. this.dealList = res.Data.List || []
  569. }
  570. })
  571. },
  572. /* 查看历史签约 */
  573. previewHistory() {
  574. this.isPreview = true
  575. },
  576. // 权益 续约合同判断
  577. // 1、勾选同行业,判断选择的期限,是否与已存在的合同期限重叠:
  578. // 有重叠则提示:同行业有重叠的合同期限,请核实后再提交
  579. // 没有重叠,则提交成功,两份合同独立执行
  580. // 2、勾选不同行业,直接提交成功,提交成功后,
  581. // 若期限有重叠,新开新的行业,使用期限按照合同期限,列表中的服务期限按照合同期限加总
  582. // 若期限无重叠,两份合同独立执行,列表中的服务期限按照执行时的合同期限
  583. // 2023-02-21 修改只需判断勾选行业的服务期限与本行业是否有重叠,无需判断勾选行业与其余行业是否有期限重叠
  584. handleValidate(e){
  585. let validate=true
  586. const newtemContractData=[]//把所有的都加上升级 id加100000
  587. this.temContractData.forEach(item=>{
  588. newtemContractData.push(item)
  589. newtemContractData.push({...item,ChartPermissionId:100000+item.ChartPermissionId,PermissionName:item.PermissionName+'(升级)'})
  590. })
  591. const time1=new Date(this.dataForm.term[0]).getTime() //选择的开始时间
  592. const time2=new Date(this.dataForm.term[1]).getTime() //选择的结束时间
  593. if(this.companyInfo.CompanyType=='权益' &&this.$route.path=='/updateCustom'){
  594. let count=0
  595. newtemContractData.forEach(item=>{
  596. let flag=e.indexOf(item.ChartPermissionId)
  597. if(flag!=-1){
  598. const time3=new Date(item.StartDate).getTime()// 上份合同的开始时间
  599. const time4=new Date(item.EndDate).getTime()// 上份合同的结束时间
  600. if(time1>time4||time2<time3){
  601. console.log(item.ChartPermissionId,'没重叠');
  602. }else{
  603. count++
  604. }
  605. }
  606. })
  607. if(count>0){
  608. validate=false
  609. }
  610. // 勾选了同行业
  611. // if(count>0){
  612. // let tag=0
  613. // let time1=new Date(this.dataForm.term[0]).getTime() //选择的开始时间
  614. // let time2=new Date(this.dataForm.term[1]).getTime() //选择的结束时间
  615. // this.temContractData.forEach(item=>{
  616. // let time3=new Date(item.StartDate).getTime()// 上份合同的开始时间
  617. // let time4=new Date(item.EndDate).getTime()// 上份合同的结束时间
  618. // if(time1>time4||time2<time3){
  619. // // 没有重叠
  620. // console.log(item.ChartPermissionId,'没重叠');
  621. // }else{
  622. // // 重叠了
  623. // tag++
  624. // }
  625. // })
  626. // if(tag>0) {
  627. // validate=false
  628. // }
  629. // }
  630. }
  631. return validate
  632. },
  633. // /* 提交 */
  634. // saveHandle() {
  635. // if(!this.dataForm.contract_type) {
  636. // this.$message.warning('合同类型不能为空!')
  637. // }else {
  638. // this.$refs.dataForm.validate((valid) => {
  639. // if (valid) {
  640. // /* 处理权限列表 */
  641. // let checkArr = [];
  642. // this.authList.forEach(item => {
  643. // if(item.CheckList.length) {checkArr.push(item.CheckList)}})
  644. // // if(this.companyInfo.CompanyType==='权益' || this.isRoleType== '权益'){
  645. // // this.$refs.childrenCheck.cities.forEach(item=>{
  646. // // item.Items.forEach(key => {
  647. // // if(key.Checked) {
  648. // // checkArr.push(key.ChartPermissionId)
  649. // // }
  650. // // })
  651. // // })
  652. // // this.$refs.childrenCheck.citiesList.forEach(item=>{
  653. // // if(item.Checked) {
  654. // // checkArr.push(item.ChartPermissionId)
  655. // // }
  656. // // })
  657. // // }else {
  658. // // this.authList.forEach(item => {
  659. // // if(item.CheckList.length) {
  660. // // checkArr.push(item.CheckList)
  661. // // }
  662. // // })
  663. // // }
  664. // if(!checkArr.length && this.companyInfo.CompanyType === '权益') {
  665. // this.$message.warning('请选择权限!');
  666. // return
  667. // }
  668. // // 判断
  669. // let flag=this.handleValidate(checkArr.flat(2))
  670. // if(!flag){
  671. // this.$message.warning('同行业有重叠的合同期限,请核实后再提交')
  672. // return false
  673. // }
  674. // let PermissionIds = checkArr.flat(2).join(',');
  675. // // let PermissionIds = (this.companyInfo.CompanyType === '权益'|| this.isRoleType== '权益') ? checkArr.join(',') : [... new Set(checkArr.flat(2))].join(',');
  676. // let params = {
  677. // CompanyId:this.companyInfo.CompanyId,
  678. // CompanyApprovalId:this.companyInfo.CompanyApprovalId?parseInt(this.companyInfo.CompanyApprovalId):0,
  679. // CompanyType:this.companyInfo.CompanyType,
  680. // ContractType: this.dataForm.contract_type,
  681. // StartDate:this.dataForm.term[0],
  682. // EndDate:this.dataForm.term[1],
  683. // ImgUrl:this.dataForm.imglist.join('#'),
  684. // Money:Number(this.dataForm.amount),
  685. // PayChannel:this.dataForm.payfrom,
  686. // PayMethod:this.dataForm.payway,
  687. // PermissionIds:PermissionIds,
  688. // PackageType:this.dataForm.setmeal ? this.dataForm.setmeal : 0
  689. // }
  690. // console.log(params);
  691. // customInterence.Update(params).then(res => {
  692. // if(res.Ret === 200) {
  693. // this.$message.success('更新成功!')
  694. // this.$router.go(-1)
  695. // }
  696. // })
  697. // }
  698. // })
  699. // }
  700. // },
  701. /* 提交 */
  702. saveHandle() {
  703. if(!this.dataForm.contract_type) {
  704. this.$message.warning('合同类型不能为空!')
  705. }else {
  706. this.$refs.dataForm.validate((valid) => {
  707. if (valid) {
  708. /* 处理权限列表 */
  709. let checkArr = [];
  710. this.authList.forEach(item => {
  711. if(item.CheckList.length) {
  712. checkArr.push(item.CheckList)
  713. }
  714. })
  715. if(!checkArr.length && this.companyInfo.CompanyType === '权益') {
  716. this.$message.warning('请选择权限!');
  717. return
  718. }
  719. // 判断
  720. let flag=this.handleValidate(checkArr.flat(2))
  721. if(!flag){
  722. this.$message.warning('同行业有重叠的合同期限,请核实后再提交')
  723. return false
  724. }
  725. const hasFiftyTwo = checkArr.flat(2).includes(52);
  726. const hasMinusSignVal = this.companyInfo.CompanyType === '权益' ? this.$refs.raiPermissionboxRef[0].minus_sign_val : 0
  727. if(hasFiftyTwo && !hasMinusSignVal) return this.$message.error('请输入研选扣点数')
  728. let PermissionIds = checkArr.flat(2).join(',');
  729. let params = {
  730. CompanyId:this.companyInfo.CompanyId,
  731. CompanyApprovalId:this.companyInfo.CompanyApprovalId?parseInt(this.companyInfo.CompanyApprovalId):0,
  732. CompanyType:this.companyInfo.CompanyType,
  733. ContractType: this.dataForm.contract_type,
  734. StartDate:this.dataForm.term[0],
  735. EndDate:this.dataForm.term[1],
  736. ImgUrl:this.dataForm.imglist.join('#'),
  737. Money:Number(this.dataForm.amount),
  738. PayChannel:this.dataForm.payfrom,
  739. PayMethod:this.dataForm.payway,
  740. PermissionIds:PermissionIds,
  741. PackageType:Number(this.dataForm.setmeal),
  742. RaiPackageType:this.dataForm.qyBigServeCheck||0,
  743. Points:hasMinusSignVal||0
  744. }
  745. console.log(params);
  746. customInterence.Update(params).then(res => {
  747. if(res.Ret === 200) {
  748. this.$message.success('更新成功!')
  749. //this.$router.go(-1)
  750. this.$router.push({path:`/${this.$route.meta.pathFrom}`})
  751. }
  752. })
  753. }
  754. })
  755. }
  756. },
  757. /* 取消返回 */
  758. cancelHandle() {
  759. //this.$router.go(-1);
  760. this.$router.push({path:`/${this.$route.meta.pathFrom}`})
  761. },
  762. /* 选择全选或取消全选 */
  763. handleCheckAll(item,type) {
  764. if(type=='auth'){
  765. //获取公有的id合集
  766. let publicIds=[]
  767. let ids = item.Items.map(item =>{
  768. if(item.IsPublic==1){
  769. publicIds.push(item.ChartPermissionId)
  770. }
  771. return item.ChartPermissionId
  772. })
  773. item.CheckList = item.checkAll ? ids : publicIds;
  774. item.isIndeterminate = publicIds.length>0&&!item.checkAll?true:false;
  775. return
  776. }
  777. // 取到所有的子菜单id
  778. let ids = item.Items.map(item =>{
  779. return item.ChartPermissionId
  780. })
  781. item.CheckList = item.checkAll ? ids : [];
  782. item.isIndeterminate = false;
  783. },
  784. /* 复选框組选中时 */
  785. handleChecked(item) {
  786. let len = item.CheckList.length;
  787. if(this.companyInfo.CompanyType == '权益' || this.isRoleType== '权益') {
  788. /* 获取大套餐行业并且判断 value里面有没有包含 大套餐的全部id*/
  789. let isCheckAllTrue = item.Items.filter(key=> ![31,29].includes(key.ChartPermissionId)&& !key.PermissionName.includes('升级')).every(val => item.CheckList.includes(val.ChartPermissionId))
  790. item.checkAll = isCheckAllTrue;
  791. item.isIndeterminate = len > 0 && !isCheckAllTrue
  792. }else{
  793. item.checkAll = len === item.Items.length;
  794. item.isIndeterminate = len > 0 && len < item.Items.length;
  795. }
  796. },
  797. /* 预览 */
  798. preview(id,index,img) {
  799. // $('#'+id).click()
  800. if(img.indexOf('.pdf') == -1) {
  801. this.preAct = index;
  802. /* 是否显示左右切换 */
  803. let bol = this.dataForm.imglist.some(item => {
  804. return item.indexOf('.pdf') != -1
  805. })
  806. // 有pdf或图片只有一张
  807. if(bol || this.dataForm.imglist.length<=1) {
  808. this.isShowToggle = false
  809. }else {
  810. this.isShowToggle = true
  811. }
  812. this.isPreviewimg = true;
  813. }else {
  814. window.open(img)
  815. }
  816. },
  817. clickinput(index){ //上传模拟点击
  818. this.img_replace = '';
  819. if(index) {
  820. this.img_replace = index
  821. }
  822. $("#file").click();
  823. },
  824. fileSelected(){ //选择文件上传
  825. if( document.getElementById('file').files[0] ){
  826. let hostfile = document.getElementById('file').files[0];
  827. let size = Math.floor(hostfile.size / 1024 / 1024);
  828. if( size>200 ){
  829. this.$message.error('上传文件大小不能大于200M!');
  830. hostfile = {};
  831. return false
  832. }
  833. if( hostfile.name.toLowerCase().includes('.png') || hostfile.name.toLowerCase().includes('.jpg') || hostfile.name.toLowerCase().includes('.jpeg') || hostfile.name.toLowerCase().includes('.pdf') ){
  834. let form = new FormData();
  835. form.append('file',hostfile); //hostfile.name
  836. this.uploadloading=true;
  837. customInterence.upload(form).then((res) => {
  838. if( res.Ret === 200 ){
  839. /* 是替换还是新增 */
  840. if(this.img_replace) {
  841. this.dataForm.imglist.splice(this.img_replace-1,1,res.Data.ResourceUrl)
  842. }else {
  843. if(this.dataForm.imglist.length >= 4) {
  844. this.$message.warning('最多上传4张')
  845. }else {
  846. this.dataForm.imglist.push(res.Data.ResourceUrl)
  847. }
  848. }
  849. }
  850. this.uploadloading=false;
  851. $("#file").val('');
  852. hostfile = {};
  853. });
  854. }else{
  855. this.$message.error('上传文件格式不正确!');
  856. }
  857. }
  858. },
  859. closePreview() {
  860. this.isPreviewimg = false;
  861. },
  862. togglePre(type) {
  863. if(type==1) {
  864. this.preAct--;
  865. if(this.preAct < 0) {
  866. this.preAct = this.dataForm.imglist.length-1;
  867. }
  868. }else {
  869. this.preAct++;
  870. if(this.preAct > this.dataForm.imglist.length-1) {
  871. this.preAct = 0;
  872. }
  873. }
  874. },
  875. //套餐的选择
  876. setmealChange(){
  877. if(this.dataForm.setmeal == '1'){
  878. this.authList.forEach(item => {
  879. if(!['市场策略','固定收益'].includes(item.ClassifyName)) {
  880. item.Items.forEach(key => {
  881. item.CheckList.push(key.ChartPermissionId)
  882. key.Checked = true
  883. key.disabled = true
  884. })
  885. item.isIndeterminate = false
  886. item.checkAll = true
  887. item.disabled = true
  888. }
  889. })
  890. } else {
  891. console.log(this.authList);
  892. this.authList.forEach(item => {
  893. if(item.ClassifyName == '宏观经济') {
  894. item.CheckList = [1]
  895. item.isIndeterminate = true
  896. item.disabled=false
  897. item.Items[1].disabled=false
  898. item.Items[0].disabled=false
  899. }else {
  900. item.Items.forEach(key => {
  901. item.CheckList = []
  902. key.Checked = false
  903. key.disabled = false
  904. })
  905. item.isIndeterminate = false
  906. item.checkAll = false
  907. item.disabled = false
  908. }
  909. })
  910. this.$message.warning('请勾选品种')
  911. }
  912. },
  913. // 获取合同编号
  914. async querySearchCreditCode(queryString, cb) {
  915. cb([])
  916. if(queryString) {
  917. const res = await customInterence.searchSealcodeSeal({
  918. KeyWord:queryString
  919. })
  920. if(res.Ret === 200) {
  921. if(res.Data.List.length) {
  922. const data = res.Data.List.map(item => {
  923. return {
  924. value: item.Code,
  925. ...item
  926. }
  927. })
  928. cb(data)
  929. }
  930. }
  931. }
  932. },
  933. // 选择合同编号
  934. handleSelectCreditCode(item) {
  935. this.dataForm.term = [item.StartDate,item.EndDate]
  936. this.dataForm.amount = item.Money
  937. }
  938. },
  939. created() {},
  940. mounted() {
  941. this.getDealList();
  942. this.getLastedContractInfo()
  943. if(this.$route.query.isReapply) {
  944. this.getLastContract();
  945. }else {
  946. this.getAuthBasic();
  947. }
  948. },
  949. computed: {
  950. isRaiSellerShow() {
  951. return localStorage.getItem('Role') === 'rai_seller';
  952. },
  953. }
  954. }
  955. </script>
  956. <style lang='scss'>
  957. .updateServer_container {
  958. min-width: 1570px;
  959. *{
  960. box-sizing: border-box;
  961. }
  962. /* reset */
  963. .el-collapse {
  964. border: none;
  965. }
  966. .el-collapse-item__header {
  967. display: block;
  968. border: none;
  969. font-size: 16px;
  970. color: #333;
  971. font-weight: bold;
  972. position: relative;
  973. }
  974. .el-collapse-item__content {
  975. padding-left: 30px;
  976. }
  977. .el-collapse-item__wrap {
  978. border: none;
  979. margin-top: 20px;
  980. }
  981. .el-form-item {
  982. margin-bottom: 30px;
  983. }
  984. .el-form-item .el-checkbox-group {
  985. height: 40px;
  986. }
  987. .textarea_item .el-form-item__content {
  988. width: 100%;
  989. }
  990. /* */
  991. .card_cont {
  992. margin-bottom: 20px;
  993. border: 1px solid #ECECEC;
  994. padding: 30px;
  995. background: #fff;
  996. border-radius: 4px;
  997. box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
  998. .btn_top {
  999. display: flex;
  1000. justify-content: flex-end;
  1001. }
  1002. .info {
  1003. margin-top: 10px;
  1004. font-size: 16px;
  1005. color: #666;
  1006. .tit {
  1007. color: #333;
  1008. font-size: 16px;
  1009. margin-bottom: 30px;
  1010. }
  1011. .info_list {
  1012. display: flex;
  1013. flex-wrap: wrap;
  1014. padding-left: 50px;
  1015. padding-bottom: 20px;
  1016. li {
  1017. margin-right: 113px;
  1018. margin-bottom: 20px;
  1019. min-width: 250px;
  1020. }
  1021. }
  1022. }
  1023. .info_cont {
  1024. padding-left: 30px;
  1025. margin-top: 30px;
  1026. }
  1027. .img_cont {
  1028. width: 100%;
  1029. display: flex;
  1030. flex-wrap: wrap;
  1031. .img_item {
  1032. position: relative;
  1033. margin-right: 23px;
  1034. &:last-child {
  1035. margin-right: 0;
  1036. }
  1037. }
  1038. }
  1039. }
  1040. .menu_lists {
  1041. padding: 40px 18px;
  1042. border: 1px dashed #AAB4CC;
  1043. border-radius: 4px;
  1044. .menu_item {
  1045. display: flex;
  1046. // align-items: center;
  1047. margin-bottom: 40px;
  1048. &:last-child {
  1049. margin-bottom: 0;
  1050. }
  1051. .list_item {
  1052. margin-right: 30px;
  1053. &:last-child {
  1054. margin-right: 0;
  1055. }
  1056. }
  1057. }
  1058. }
  1059. .update_dialog {
  1060. max-height: 810px;
  1061. min-height: 200px;
  1062. // overflow: hidden;
  1063. overflow-y: auto;
  1064. .el-dialog__header {
  1065. background: #fff;
  1066. }
  1067. .el-dialog__body {
  1068. padding: 30px 50px !important;
  1069. }
  1070. .history_item {
  1071. margin-bottom: 60px;
  1072. .detail_item {
  1073. font-size: 16px;
  1074. color: #666;
  1075. li {
  1076. margin-bottom: 30px;
  1077. &:last-child {
  1078. margin-bottom: 0;
  1079. }
  1080. }
  1081. }
  1082. }
  1083. .menu_lists {
  1084. padding: 20px 18px;
  1085. border: 1px dashed #AAB4CC;
  1086. border-radius: 4px;
  1087. .menu_item {
  1088. display: flex;
  1089. // align-items: center;
  1090. margin-bottom: 20px;
  1091. &:last-child {
  1092. margin-bottom: 0;
  1093. }
  1094. .list_item {
  1095. margin-right: 30px;
  1096. margin-bottom: 5px;
  1097. &:last-child {
  1098. margin-right: 0;
  1099. }
  1100. }
  1101. }
  1102. }
  1103. }
  1104. }
  1105. </style>