demoForm2.vue 30 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883
  1. <template>
  2. <div class="form-main">
  3. <a-card :body-style="{padding: '24px 32px'}" :bordered="false">
  4. <!-- <a-form @submit="handleSubmit" :form="form">
  5. <a-form-item
  6. label="标题"
  7. :labelCol="{lg: {span: 7}, sm: {span: 7}}"
  8. :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
  9. <a-input :disabled="disabled"
  10. v-decorator="[
  11. 'name',
  12. {rules: [{ required: true, message: '请输入标题' }]}
  13. ]"
  14. name="name"
  15. placeholder="给目标起个名字" />
  16. </a-form-item>
  17. <a-form-item v-if="!disabled"
  18. :wrapperCol="{ span: 24 }"
  19. style="text-align: center"
  20. >
  21. <a-button htmlType="submit" type="primary" :disabled="disabled||btndisabled" @click="handleSubmit">保存</a-button>
  22. <a-button style="margin-left: 8px" :disabled="disabled" @click="close">取消</a-button>
  23. </a-form-item>
  24. </a-form>-->
  25. <k-form-build
  26. :value="jsonData"
  27. @change="handleChange"
  28. :dynamicData="dynamicData"
  29. ref="KFB"
  30. @submit="handleSubmit"
  31. />
  32. <div style="text-align:center">
  33. <a-button
  34. htmlType="submit"
  35. type="primary"
  36. :disabled="disabled||btndisabled"
  37. @click="handleSubmit"
  38. >保存</a-button>
  39. <todoManageOperation
  40. v-if="processData.operationType&&processData.operationType=='1'"
  41. :processData="processData"
  42. :todoManageOperationObject="todoManageOperationObject"
  43. :disabled="disabled"
  44. :btndisabled="btndisabled"
  45. @refreshToDo="refreshToDo"
  46. @handleSubmit2="handleSubmit2"
  47. ></todoManageOperation>
  48. <a-button style="margin-left: 8px;" :disabled="disabled||disabled2" @click="close">取消</a-button>
  49. </div>
  50. </a-card>
  51. </div>
  52. </template>
  53. <script>
  54. import pick from 'lodash.pick'
  55. import todoManageOperation from '../operation/todoManageOperation'
  56. import { postAction, postFormDataAction } from '@/api/manage'
  57. export default {
  58. name: 'demoForm',
  59. props: {
  60. /*全局禁用,可表示查看*/
  61. disabled: {
  62. type: Boolean,
  63. default: false,
  64. required: false
  65. },
  66. /*流程数据*/
  67. processData: {
  68. type: Object,
  69. default: () => {
  70. return {}
  71. },
  72. required: false
  73. },
  74. /*是否新增*/
  75. isNew: { type: Boolean, default: false, required: false }
  76. },
  77. components: {
  78. todoManageOperation
  79. },
  80. data() {
  81. return {
  82. isSJ: false,
  83. todoManageOperationObject: {
  84. isSave: false,
  85. formData: {},
  86. jsonData: {}
  87. },
  88. disabled2: false, //用来取决于表单时不同流程节点填写不同表单信息使用
  89. jsonData: {},
  90. url: {
  91. getForm: '/actBusiness/getForm',
  92. addApply: '/actBusiness/add',
  93. editForm: '/actBusiness/editForm',
  94. leaveType: '/sys/dict/getDictItems'
  95. },
  96. description: '流程表单demo,按例开发表单。需在 activitiMixin.js 中加入写好的表单',
  97. // form
  98. form: this.$form.createForm(this),
  99. /*表单回显数据*/
  100. data: {},
  101. btndisabled: false,
  102. ceshi_file: null,
  103. dynamicData: {
  104. jsonData: {},
  105. typeData: [], //请假类型下拉数据
  106. reimbursementTypeList: [], //报销类型下拉数据
  107. invoiceTypeList: [], //发票类型下拉数据
  108. add: this.add
  109. },
  110. itemModelNameList: [] //子表字段名
  111. }
  112. },
  113. watch: {
  114. // 'dynamicData.jsonData'(){
  115. // console.log("发生改变了")
  116. // },
  117. dynamicData: {
  118. handler(newName, oldName) {
  119. console.log('obj.a changed')
  120. console.log(newName)
  121. console.log(oldName)
  122. },
  123. immediate: true,
  124. deep: true
  125. }
  126. },
  127. created() {
  128. window.deleteRow = this.deleteRow
  129. console.log('流程数据', this.processData)
  130. //加载一些下拉选择数据等
  131. // this.getDataList()
  132. let businessTable = ''
  133. //如果没有值则在另一个属性上有值
  134. if (!this.processData.businessTable) {
  135. this.processData.businessTable = this.processData.tableName
  136. }
  137. this.getAction('/tbTableInfo/query', {
  138. businessTable: this.processData.businessTable,
  139. taskNodeId: this.processData.key,
  140. tableId: this.processData.tableId
  141. }).then(res => {
  142. // this.$refs.KFB.setData({aaa:null,bbb:null,name:"123"})
  143. // this.$refs.KFB.getData().then(res => {
  144. // console.log('aaa',res)
  145. // })
  146. var jsonString = JSON.stringify(res.result.jsonContent)
  147. // var jsonString='123d"dynamicKey":"666"'
  148. var index = 1
  149. var dynamicKeyValueList = []
  150. for (var index = 1; index !== -1; ) {
  151. //动态字符位置
  152. index = jsonString.indexOf('"dynamicKey"', index)
  153. if (index !== -1) {
  154. //从指定字符的周后一个字符后开始找(")
  155. var ihStart = jsonString.indexOf('"', index + 12)
  156. //再从 (") 后面位置还是找下一个 (")
  157. var ihEnd = jsonString.indexOf('"', ihStart + 1)
  158. //获取引号之间的字符
  159. var dynamicKeyValue = jsonString.substring(ihStart + 1, ihEnd)
  160. //如果动态表示不为空则获取
  161. if (dynamicKeyValue != '') {
  162. dynamicKeyValueList.push(dynamicKeyValue)
  163. }
  164. index = ihEnd + 1
  165. }
  166. }
  167. //循环动态数据源表示获取数据
  168. // if(dynamicKeyValueList.length>0){
  169. // dynamicKeyValueList.forEach(async element => {
  170. // await this.getDataListByName(element);
  171. // });
  172. // }
  173. console.log(dynamicKeyValueList)
  174. if (dynamicKeyValueList.length > 0) {
  175. //获取数据字典数据源
  176. postAction('/sys/dict/getDictItems/getDictList', dynamicKeyValueList).then(dictData => {
  177. if (dictData.success) {
  178. this.dynamicData = dictData.result.dicList
  179. //获取用户下拉数据
  180. this.getAction('/sys/user/list2', { pageSize: 20000 }).then(userData => {
  181. if (res.success) {
  182. userData.result.records.forEach(user => {
  183. user.label = user.realname
  184. user.value = user.username
  185. })
  186. //存到动态数据源中
  187. this.dynamicData.userList = userData.result.records
  188. this.dynamicData.add = this.add //新增按钮
  189. //获取json
  190. this.jsonData = res.result.jsonContent
  191. //如果是手机端子表初始化子表model
  192. this.listUpdateModel()
  193. if (!this.isNew) {
  194. this.init()
  195. }
  196. } else {
  197. this.$message.error(userData.message)
  198. }
  199. })
  200. } else {
  201. this.$message.error(dictData.message)
  202. }
  203. })
  204. } else {
  205. //获取json
  206. this.jsonData = res.result.jsonContent
  207. //如果是手机端子表初始化子表model
  208. this.listUpdateModel()
  209. // window.jsonData=this.jsonData;
  210. if (!this.isNew) {
  211. this.init()
  212. }
  213. }
  214. //后台检测到流程节点有关联表单且前台处于我的待办界面打开表单详情
  215. if (res.result.isSave && this.processData.isSuspended != undefined) {
  216. this.disabled = false
  217. this.btndisabled = false
  218. }
  219. })
  220. },
  221. methods: {
  222. //根据字典名字获取数据源
  223. getDataListByName(name) {
  224. this.getAction(this.url.leaveType + '/' + name).then(res => {
  225. if (res.success) {
  226. this.dynamicData[name] = res.result
  227. console.log(111)
  228. } else {
  229. this.$message.error(res.message)
  230. }
  231. })
  232. },
  233. //获取获取下拉数据等
  234. getDataList() {
  235. //获取请假类型下拉数据
  236. this.getAction(this.url.leaveType + '/leave_type').then(res => {
  237. if (res.success) {
  238. this.dynamicData.typeData = res.result
  239. } else {
  240. this.$message.error(res.message)
  241. }
  242. })
  243. //获取报销类型下拉数据
  244. this.getAction(this.url.leaveType + '/reimbursement_type').then(res => {
  245. if (res.success) {
  246. this.dynamicData.reimbursementTypeList = res.result
  247. } else {
  248. this.$message.error(res.message)
  249. }
  250. })
  251. //获取发票类型下拉数据
  252. this.getAction(this.url.leaveType + '/invoice_type').then(res => {
  253. if (res.success) {
  254. this.dynamicData.invoiceTypeList = res.result
  255. } else {
  256. this.$message.error(res.message)
  257. }
  258. })
  259. },
  260. /*回显数据*/
  261. init() {
  262. this.btndisabled = true
  263. var r = this.processData
  264. this.getAction(this.url.getForm, {
  265. tableId: r.tableId,
  266. tableName: r.tableName
  267. }).then(res => {
  268. if (res.success) {
  269. let formData = res.result
  270. formData.tableName = r.tableName
  271. this.data = formData
  272. //如果表单是手机端的子表则
  273. if (this.isSJ) {
  274. var formModelList = _.keys(this.data)
  275. .join(',')
  276. .split(',')
  277. var itemList = []
  278. formModelList.forEach(element => {
  279. if (element.indexOf('child&') != -1) {
  280. itemList = JSON.parse(JSON.stringify(this.data[element]))
  281. delete this.data[element]
  282. }
  283. })
  284. //子表字段名
  285. //子表数据model和值组装
  286. itemList.forEach((item, index) => {
  287. this.itemModelNameList.forEach(itemModelName => {
  288. this.data[itemModelName + '@' + (index + 1)] = item[itemModelName]
  289. })
  290. })
  291. }
  292. //赋值
  293. this.$refs.KFB.setData(this.data)
  294. this.btndisabled = false
  295. } else {
  296. this.$message.error(res.message)
  297. }
  298. })
  299. },
  300. //表单字段数值发生改变事件
  301. handleChange(value, key) {
  302. // 数据变化时触发
  303. //如果开始时间发生变化
  304. if (key == 'start_time') {
  305. //判断结束时间是否存在
  306. if (this.$refs.KFB.form.getFieldValue('end_time')) {
  307. //获取时间差
  308. let duration = startEndFun(value, this.$refs.KFB.form.getFieldValue('end_time'))
  309. if (duration) {
  310. // 使用k-form-design组件的form属性修改表单数据
  311. this.$refs.KFB.setData({
  312. duration: duration
  313. })
  314. }
  315. }
  316. }
  317. //如果结束时间发生变化
  318. if (key == 'end_time') {
  319. //判断结束时间是否存在
  320. if (this.$refs.KFB.form.getFieldValue('start_time')) {
  321. //获取时间差
  322. let duration = startEndFun(this.$refs.KFB.form.getFieldValue('start_time'), value)
  323. if (duration) {
  324. // 使用k-form-design组件的form属性修改表单数据
  325. this.$refs.KFB.setData({
  326. duration: duration
  327. })
  328. }
  329. }
  330. }
  331. },
  332. // handler
  333. handleSubmit(e) {
  334. // return new Promise((resolve)=>{
  335. //通过函数获取数据
  336. this.$refs.KFB.getData()
  337. .then(res => {
  338. //处理手机端子表数据
  339. if (this.isSJ) {
  340. this.itemData(res)
  341. }
  342. //清除为空的表单数据
  343. _.keys(res).forEach(r => {
  344. if (!res[r]) {
  345. delete res[r]
  346. }
  347. })
  348. // 获取数据成功
  349. let formData = JSON.parse(JSON.stringify(res))
  350. console.log(formData)
  351. formData.id = this.data.id
  352. formData.procDefId = this.processData.id
  353. formData.procDeTitle = this.processData.name
  354. if (!formData.tableName) formData.tableName = this.processData.businessTable
  355. formData.filedNames = _.keys(res).join(',')
  356. formData.filedNames = getFiledNames(formData) //获取主表字段,排除子表标识
  357. var url = this.url.addApply
  358. if (!this.isNew) {
  359. url = this.url.editForm
  360. }
  361. //是否存在子表
  362. let ischild = false
  363. //循环表单字段属性判断是否属性中包含数组对象
  364. let i = 0 //子表数量
  365. _.keys(res)
  366. .join(',')
  367. .split(',')
  368. .forEach(element => {
  369. if (formData[element] instanceof Array) {
  370. //判断是否符合子表命名规则
  371. if (element.indexOf('&') != -1) {
  372. let tableChildNameList = element.split('&')
  373. //判断是否能拆分两个字符,子表标识和子表数据库名称
  374. if (tableChildNameList.length == 2) {
  375. i++
  376. let childName = tableChildNameList[1] //子表数据库名称
  377. if (!formData.table_name_children) {
  378. //第一次拼接
  379. formData.table_name_children = childName //表名
  380. } else {
  381. //后面的表明拼接用“,”隔开
  382. formData.table_name_children = formData.table_name_children + ',' + childName //表名
  383. }
  384. //定义属性名和值
  385. formData['childFiledNames' + i] = _.keys(formData[element][0]).join(',') //子表字段名
  386. formData['childList' + i] = JSON.stringify(formData[element]) //子表数据
  387. ischild = true
  388. }
  389. } else {
  390. //如果不是子表则是上传文件,则转字符串
  391. formData[element] = JSON.stringify(formData[element])
  392. }
  393. }
  394. // formData[element];
  395. })
  396. //判断需不需要存子表
  397. if (ischild) {
  398. formData.filedNames = formData.filedNames + ',table_name_children'
  399. }
  400. console.log(formData)
  401. //子表数据
  402. //调用保存接口
  403. this.btndisabled = true
  404. this.todoManageOperationObject.formData = formData
  405. this.todoManageOperationObject.url = url
  406. // formData.jsonContent=JSON.stringify(this.jsonData).toString()
  407. //获取是否部门负责人
  408. formData.filedNames = formData.filedNames + ',is_leaders'
  409. formData.is_leaders = this.$store.getters.userInfo.identity
  410. //清除子表规则的属性
  411. _.keys(formData).forEach(r => {
  412. if (r.indexOf('child&') != -1) {
  413. delete formData[r]
  414. }
  415. })
  416. //如果手机端子表得则需要修改json
  417. var jsonPamats = JSON.parse(JSON.stringify(this.jsonData))
  418. if (!this.isSJ && this.isNew) {
  419. jsonPamats = null
  420. }
  421. this.todoManageOperationObject.jsonData = jsonPamats
  422. //非我的待办节点打卡表单界面
  423. postFormDataAction(url, formData, { jsonContent: jsonPamats })
  424. .then(res => {
  425. if (res.success) {
  426. this.todoManageOperationObject.isSave = true
  427. this.$message.success('保存成功!')
  428. console.log('123')
  429. this.$emit('afterSubmit', formData)
  430. this.$emit('close')
  431. // resolve(true);
  432. } else {
  433. this.$message.error(res.message)
  434. // resolve(false);
  435. }
  436. })
  437. .finally(() => {
  438. this.btndisabled = false
  439. // resolve(false);
  440. })
  441. })
  442. .catch(err => {
  443. console.log(err, '校验失败')
  444. // resolve(false);
  445. })
  446. // })
  447. },
  448. //我的待办点击通过保存专用
  449. handleSubmit2(e) {
  450. // return new Promise((resolve)=>{
  451. //通过函数获取数据
  452. this.$refs.KFB.getData()
  453. .then(res => {
  454. //处理手机端子表数据
  455. if (this.isSJ) {
  456. this.itemData(res)
  457. }
  458. //清除为空的表单数据
  459. _.keys(res).forEach(r => {
  460. if (!res[r]) {
  461. delete res[r]
  462. }
  463. })
  464. // 获取数据成功
  465. let formData = JSON.parse(JSON.stringify(res))
  466. console.log(formData)
  467. formData.id = this.data.id
  468. formData.procDefId = this.processData.id
  469. formData.procDeTitle = this.processData.name
  470. // formData.jsonContent=JSON.stringify(this.jsonData)
  471. if (!formData.tableName) formData.tableName = this.processData.businessTable
  472. formData.filedNames = _.keys(res).join(',')
  473. formData.filedNames = getFiledNames(formData) //获取主表字段,排除子表标识
  474. var url = this.url.addApply
  475. if (!this.isNew) {
  476. url = this.url.editForm
  477. }
  478. //是否存在子表
  479. let ischild = false
  480. //循环表单字段属性判断是否属性中包含数组对象
  481. let i = 0 //子表数量
  482. _.keys(res)
  483. .join(',')
  484. .split(',')
  485. .forEach(element => {
  486. if (formData[element] instanceof Array) {
  487. //判断是否符合子表命名规则
  488. if (element.indexOf('&') != -1) {
  489. let tableChildNameList = element.split('&')
  490. //判断是否能拆分两个字符,子表标识和子表数据库名称
  491. if (tableChildNameList.length == 2) {
  492. i++
  493. let childName = tableChildNameList[1] //子表数据库名称
  494. if (!formData.table_name_children) {
  495. //第一次拼接
  496. formData.table_name_children = childName //表名
  497. } else {
  498. //后面的表明拼接用“,”隔开
  499. formData.table_name_children = formData.table_name_children + ',' + childName //表名
  500. }
  501. //定义属性名和值
  502. formData['childFiledNames' + i] = _.keys(formData[element][0]).join(',') //子表字段名
  503. formData['childList' + i] = JSON.stringify(formData[element]) //子表数据
  504. ischild = true
  505. }
  506. } else {
  507. //如果不是子表则是上传文件,则转字符串
  508. formData[element] = JSON.stringify(formData[element])
  509. }
  510. }
  511. // formData[element];
  512. })
  513. //判断需不需要存子表
  514. if (ischild) {
  515. formData.filedNames = formData.filedNames + ',table_name_children'
  516. }
  517. console.log(formData)
  518. //子表数据
  519. //调用保存接口
  520. this.btndisabled = true
  521. this.todoManageOperationObject.formData = formData
  522. this.todoManageOperationObject.url = url
  523. //获取是否部门负责人
  524. formData.filedNames = formData.filedNames + ',is_leaders'
  525. formData.is_leaders = this.$store.getters.userInfo.identity
  526. //清除子表规则的属性
  527. _.keys(formData).forEach(r => {
  528. if (r.indexOf('child&') != -1) {
  529. delete formData[r]
  530. }
  531. })
  532. //如果手机端子表得则需要修改json
  533. var jsonPamats = JSON.parse(JSON.stringify(this.jsonData))
  534. if (!this.isSJ && this.isNew) {
  535. jsonPamats = null
  536. }
  537. this.todoManageOperationObject.jsonData = jsonPamats
  538. })
  539. .catch(err => {
  540. console.log(err, '校验失败')
  541. // resolve(false);
  542. })
  543. // })
  544. },
  545. close() {
  546. this.$emit('close')
  547. },
  548. getData() {
  549. // 通过函数获取数据
  550. this.$refs.KFB.getData()
  551. .then(res => {
  552. // 获取数据成功
  553. alert(JSON.stringify(res))
  554. })
  555. .catch(err => {
  556. console.log(err, '校验失败')
  557. })
  558. },
  559. //刷新待办列表
  560. refreshToDo() {
  561. this.close()
  562. this.$emit('getDataList')
  563. },
  564. itemData(res) {
  565. var childName = '' //子表规则名称
  566. var itemIndex = 0
  567. this.jsonData.list.forEach((element, index) => {
  568. if (element.label.indexOf('child&') != -1) {
  569. childName = element.label //获取规则名
  570. itemIndex = itemIndex + 1
  571. }
  572. })
  573. var itemList = [] //封装子表数据
  574. for (var i = 1; i <= itemIndex; i++) {
  575. var itemObject = {} //子表对象
  576. this.itemModelNameList.forEach(name => {
  577. //获取子表得值和封装对象
  578. itemObject[name] = res[name + '@' + i]
  579. delete res[name + '@' + i]
  580. })
  581. itemList.push(itemObject)
  582. }
  583. res[childName] = itemList //完成子表数据封装
  584. console.log(res)
  585. },
  586. deleteRow(idIndex) {
  587. //删除
  588. this.jsonData.list.splice(idIndex, 1)
  589. //删除掉得json之后 重新处理model 和value
  590. let childIndex = 0
  591. this.jsonData.list.forEach((element, index) => {
  592. if (element.label.indexOf('child&') != -1) {
  593. childIndex = childIndex + 1
  594. //只有当前删除的对象json的后面对象json才进行修改
  595. if (index >= idIndex) {
  596. //修改删除按钮的index
  597. element.columns[0].list[1].options.defaultValue =
  598. '<a href="javascript:void(0);" \n onclick="deleteRow(' + childIndex + ')">删除</a>'
  599. //修改model
  600. updateModel(element, childIndex)
  601. //需要调整的子表值
  602. var updateModelObject = {}
  603. //修改value
  604. this.$refs.KFB.getData().then(res => {
  605. //根据原始字段名拼接带规则的
  606. this.itemModelNameList.forEach(modelName => {
  607. updateModelObject[modelName + '@' + childIndex] = res[modelName + '@' + (childIndex + 1)]
  608. })
  609. this.$refs.KFB.setData(updateModelObject)
  610. })
  611. }
  612. }
  613. })
  614. console.log(JSON.stringify(this.jsonData.list))
  615. },
  616. add() {
  617. let childLable = '' //子表json标题
  618. let childValue = {} //新增子表json
  619. let isReturn = false
  620. let childIndex = 0
  621. var itemList = []
  622. this.jsonData.list.forEach((element, index) => {
  623. if (element.label.indexOf('child&') != -1) {
  624. childValue = JSON.parse(JSON.stringify(element))
  625. childLable = element.label
  626. //处理删除按钮
  627. childIndex = childIndex + 1
  628. // element.columns[0].list[1].options.dynamicFun = 'delete' + childIndex
  629. console.log(element.columns[0].list[1].options)
  630. element.columns[0].list[1].options.defaultValue =
  631. '<a href="javascript:void(0);" \n onclick="deleteRow(' + childIndex + ')">删除</a>'
  632. updateModel(childValue, childIndex)
  633. }
  634. if (!isReturn && childLable != '' && element.label != childLable) {
  635. isReturn = true
  636. //处理删除按钮
  637. childIndex = childIndex + 1
  638. // childValue.columns[0].list[1].options.dynamicFun = 'delete' + childIndex
  639. childValue.columns[0].list[1].options.defaultValue =
  640. '<a href="javascript:void(0);" \n onclick="deleteRow(' + childIndex + ')">删除</a>'
  641. updateModel(childValue, childIndex)
  642. // this.jsonData.list.splice(index, 0, childValue)
  643. itemList.push(childValue)
  644. }
  645. itemList.push(element)
  646. })
  647. this.jsonData.list = itemList
  648. console.log(JSON.stringify(this.jsonData.list))
  649. },
  650. //把整个子表json的model进行规则修改
  651. async listUpdateModel() {
  652. let modelIndex = 0 //子表model自增
  653. //循环整个json的表单
  654. this.jsonData.list.forEach((element, index) => {
  655. //找到为子表的json
  656. if (element.label.indexOf('child&') != -1) {
  657. this.isSJ = true
  658. //获取子表原始得model字段名
  659. if (modelIndex == 0) {
  660. var i = 1
  661. var itemString = JSON.stringify(element)
  662. var itemModelNameList = [] //储存子表字段名
  663. for (var i = 1; i !== -1; ) {
  664. //动态字符位置
  665. i = itemString.indexOf('"model"', i)
  666. if (i !== -1) {
  667. //从指定字符的周后一个字符后开始找(")
  668. var ihStart = itemString.indexOf('"', i + 7)
  669. //再从 (") 后面位置还是找下一个 (")
  670. var ihEnd = itemString.indexOf('"', ihStart + 1)
  671. //获取引号之间的字符
  672. var model = itemString.substring(ihStart + 1, ihEnd)
  673. //如果动态表示不为空则获取
  674. if (model != '') {
  675. if (model.indexOf('@') != -1) {
  676. model = model.substring(0, model.length - 2)
  677. }
  678. itemModelNameList.push(model)
  679. }
  680. i = ihEnd + 1
  681. }
  682. }
  683. this.itemModelNameList = itemModelNameList
  684. }
  685. modelIndex = modelIndex + 1
  686. //修改model
  687. updateModel(element, modelIndex)
  688. }
  689. })
  690. }
  691. }
  692. }
  693. //获取主表字段,排除子表标识
  694. function getFiledNames(formData) {
  695. let filedNames = ''
  696. let list = formData.filedNames.split(',') //获取表单属性名集合
  697. list.forEach(element => {
  698. if (element.indexOf('&') == -1) {
  699. //查询是否有这个字段
  700. if (filedNames == '') {
  701. //第一次则直接等于
  702. filedNames = element
  703. } else {
  704. //后面用逗号隔开
  705. filedNames = filedNames + ',' + element
  706. }
  707. }
  708. })
  709. return filedNames
  710. }
  711. //根据开始时间 结束时间计算天数
  712. function startEndFun(start, end) {
  713. let startTime = new Date(start)
  714. let endTime = new Date(end)
  715. if (startTime >= endTime) return 0
  716. //1,分钟取整
  717. startTime = carryTime(startTime)
  718. endTime = carryTime(endTime)
  719. //2,计算总天数
  720. var totalTime = 0 //工时,天数
  721. if (startTime.getDay() == 6 || startTime.getDay() == 0) {
  722. totalTime = endTime.getDate() - startTime.getDate()
  723. } else {
  724. totalTime = Math.floor((endTime - startTime) / (3600 * 1000) / 24)
  725. }
  726. //3,拿初始值赋值给一个临时变量
  727. var tempStartTime = new Date()
  728. tempStartTime.setTime(startTime.getTime())
  729. //4,计算出总天数
  730. while (tempStartTime.getDate() < endTime.getDate()) {
  731. if (tempStartTime.getDay() == 6 || tempStartTime.getDay() == 0) {
  732. //周六或者周日减去
  733. totalTime--
  734. }
  735. tempStartTime.setDate(tempStartTime.getDate() + 1)
  736. }
  737. //5,计算出总小时数
  738. var temp = 0 //工时,小时
  739. do {
  740. if (startTime.getDay() == 6 || startTime.getDay() == 0) {
  741. //周六周日
  742. startTime.setDate(startTime.getDate() + 1)
  743. //*********周六周日直接跳过,初始化为早晨9点
  744. startTime.setHours(9)
  745. startTime.setMinutes(0)
  746. continue
  747. }
  748. if (endTime.getDay() == 6 || endTime.getDay() == 0) {
  749. //周六周日
  750. endTime.setDate(endTime.getDate() + 1)
  751. //*********周六周日直接跳过,初始化为早晨9点
  752. endTime.setHours(9)
  753. endTime.setMinutes(0)
  754. continue
  755. }
  756. let tempMinutes = startTime.getHours() * 60 + startTime.getMinutes()
  757. //上午9点到12点半,算工时
  758. if (tempMinutes >= 9 * 60 && tempMinutes < 12 * 60) {
  759. temp += 0.05
  760. }
  761. //上午14点到18点半,算工时
  762. if (tempMinutes >= 13 * 60 && tempMinutes < 18 * 60) {
  763. temp += 0.05
  764. }
  765. startTime.setTime(startTime.getTime() + 0.5 * 3600 * 1000) //每次增加半个小时
  766. } while (startTime.getHours() * 60 + startTime.getMinutes() != endTime.getHours() * 60 + endTime.getMinutes())
  767. {
  768. totalTime += Math.floor(temp / 0.8)
  769. totalTime += temp % 0.8
  770. totalTime = Math.round(totalTime * 100) / 100
  771. }
  772. var days = Math.floor(totalTime)
  773. var hours = Math.round((totalTime - days) * 100) / 10
  774. console.log(days + '天', hours + '小时')
  775. return days * 8 + hours
  776. // if (start && end) {
  777. // let startTime = new Date(start) // 开始时间
  778. // let endTime = new Date(end) // 结束时间
  779. // let usedTime = endTime - startTime // 相差的毫秒数
  780. // let days = (usedTime / 1000 / 60 / 60).toFixed(2) // 计算出天数
  781. // return days
  782. // } else {
  783. // return null
  784. // }
  785. }
  786. //格式化时间
  787. function formatDate(date, fmt) {
  788. if (/(y+)/.test(fmt)) {
  789. fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
  790. }
  791. let o = {
  792. 'M+': date.getMonth() + 1,
  793. 'd+': date.getDate(),
  794. 'h+': date.getHours(),
  795. 'm+': date.getMinutes(),
  796. 's+': date.getSeconds()
  797. }
  798. for (let k in o) {
  799. if (new RegExp(`(${k})`).test(fmt)) {
  800. let str = o[k] + ''
  801. fmt = fmt.replace(RegExp.$1, RegExp.$1.length === 1 ? str : padLeftZero(str))
  802. }
  803. }
  804. return fmt
  805. }
  806. function padLeftZero(str) {
  807. return ('00' + str).substr(str.length)
  808. }
  809. /*
  810. * 0-15分不算工时
  811. * 15-45算半个小时
  812. * 45-60算一个小时
  813. * */
  814. function carryTime(date) {
  815. if (date.getMinutes() > 0 && date.getMinutes() < 15) {
  816. date.setMinutes(0)
  817. }
  818. if (date.getMinutes() >= 15 && date.getMinutes() < 30) {
  819. date.setMinutes(30)
  820. }
  821. if (date.getMinutes() > 30 && date.getMinutes() < 45) {
  822. date.setMinutes(30)
  823. }
  824. if (date.getMinutes() >= 45) {
  825. date.setHours(date.getHours() + 1)
  826. date.setMinutes(0)
  827. }
  828. return date
  829. }
  830. // function
  831. /**
  832. * 修改model绑定值
  833. */
  834. function updateModel(object, childIndex) {
  835. let keyString = _.keys(object).join(',')
  836. if (keyString.indexOf('model') != -1) {
  837. //如果没有修改过则直接修改
  838. if (object['model'].indexOf('@') == -1) {
  839. object['model'] = object['model'] + '@' + childIndex
  840. } else {
  841. //修改过则截取修改前的再进行修改
  842. var m = object['model'].substring(0, object['model'].length - 2)
  843. object['model'] = m + '@' + childIndex
  844. }
  845. }
  846. //递归
  847. _.keys(object)
  848. .join(',')
  849. .split(',')
  850. .forEach(l => {
  851. if (object[l] instanceof Array) {
  852. object[l].forEach(element => {
  853. updateModel(element, childIndex)
  854. })
  855. }
  856. })
  857. }
  858. </script>
  859. <style lang="less" scoped>
  860. .form-main {
  861. }
  862. </style>