完成申购明细的新增和更新渲染

src/utils/applyfor-item.js

@@ -6,6 +6,17 @@ import store from "@/store"
 // const degree2Txt = store.getters['enum/getDegreeText']
 const maintainTypeList = store.getters['enum/getMaintainText']
 
+function getModule1(data){
+  const { create_at } = data
+  // TODO: 待完成
+  return [
+    {
+      title: '申请日期',
+      value: create_at
+    },
+  ]
+}
+
 function getModule8(data) {
   const { order_no, department_data, module_info} = data
   return [
@@ -50,6 +61,9 @@ export const formatApplyforRows = (data) => {
   let arrs = []
 
   switch (type) {
+    case 1:
+      arrs = getModule1(data)
+      break
     case 8:
       arrs = getModule8(data)
       break

src/utils/approve-item.js

@@ -1,5 +1,5 @@
 /**
- * @description 设置审核Row的数据内容等
+ * @description 设置审核Row的数据内容、我的申请内容数据
  */
 
 import store from "@/store"
@@ -24,7 +24,7 @@ export function formatApproveItemRow(data, type) {
                 },
                 {
                     label: '申购商品',
-                    val: ''
+                    val: data.apply_goods.map(goods => goods.goods_name).join(',')
                 }
             ]
             break

src/utils/import-vant.js

@@ -25,11 +25,12 @@ import {
     ImagePreview,
     Checkbox,
     Radio,
-    RadioGroup
+    RadioGroup,
+    Stepper
 } from 'vant'
 
 Vue.use(Tab).use(Tabs).use(Popup).use(Toast).use(Field).use(Button).use(NavBar).use(Icon).use(Tabbar).use(TabbarItem).use(Picker)
-.use(Uploader).use(Calendar).use(DatetimePicker).use(ActionSheet).use(Switch).use(List).use(Dialog).use(Checkbox).use(Radio).use(RadioGroup)
+.use(Uploader).use(Calendar).use(DatetimePicker).use(ActionSheet).use(Switch).use(List).use(Dialog).use(Checkbox).use(Radio).use(RadioGroup).use(Stepper)
 
 
 Vue.use(ImagePreview)

src/views/applyfor/ProductStore.vue

@@ -65,6 +65,10 @@
             <c-input :title="item.label" :placeholder="`请输入${item.label}`" :maxlength="5" :showWordLimit="false"
               input-type="digit" v-model="item.val" :key="idx" />
           </template>
+          <template v-else-if="item.type === 'price'">
+            <c-input :title="item.label" :placeholder="`请输入${item.label}`" :maxlength="5" :showWordLimit="false"
+              input-type="number" v-model="item.val" :key="idx" />
+          </template>
           <template v-else>
             <div :key="idx" class="product__row">
               <div class="product__row__header">
@@ -402,6 +406,9 @@ export default {
         }
 
         // 判断输入的数量是否大于库存
+        if (customCount <= 0) {
+          return this.$toast('物品数量最少1件')
+        }
         if (customCount > ChoosedGoodsStock) {
           return this.$toast('当前商品规格数量不足')
         }
@@ -421,7 +428,6 @@ export default {
       } catch (error) {
         console.log(error);
       }
-
     },
 
     // NOTE: 选中某商品进行业务
@@ -441,7 +447,7 @@ export default {
         },
         {
           label: '物品单价',
-          type: 'total',
+          type: 'price',
           val: ''
         }
       ]

src/views/applyfor/components/CFiles.vue

@@ -169,7 +169,15 @@ export default {
         }
     },
 
+    mounted() {
+        this.handleUpdateValues()
+    },
+
     methods: {
+        handleUpdateValues() {
+            const arrs = this.value
+            if (Array.isArray(arrs) && arrs.length) this.filelist = [...arrs]
+        },
         // 启动上传组件
         handleLaunchUploadBox() {
             this.$refs.uploadFileRef.chooseFile()
@@ -240,13 +248,13 @@ export default {
                 }
             }
         },
-        value: {
-            handler(arrs) {
-                if (Array.isArray(arrs) && arrs.length) {
-                    this.filelist = [...arrs]
-                }
-            }
-        }
+        // value: {
+        //     handler(arrs) {
+        //         if (Array.isArray(arrs) && arrs.length) {
+        //             this.filelist = [...arrs]
+        //         }
+        //     }
+        // }
     }
 }
 

src/views/applyfor/components/CProductStore.vue

@@ -37,16 +37,22 @@
                 {{ item.goods_name }}
               </div>
               <div class="prow-header__right">
-                <span class="update" @click="handleUpdateRow">更改</span>
-                <span class="remove" @click="handleRemoveRow">删除</span>
+                <span class="update" @click="handleUpdateRow(item, idx)">更改</span>
+                <span class="remove" @click="handleRemoveRow(item, idx)">删除</span>
               </div>
             </div>
             <template v-for="(goodsStock, idx) in item.goods_stock">
-              <div class="prow-middle flex flex-row flex-row-aic" :key="idx">
-                <div class="tags">{{ goodsStock.name }}</div>
-                <div class="count">x40</div>
+              <div class="prow-middle flex flex-row flex--row-aic" :key="idx">
+                <div class="flex flex-row flex-row-aic">
+                  <div class="tags">{{ goodsStock.name }}</div>
+                  <div class="price">￥{{ goodsStock.price }}</div>
+                </div>
+                <div class="count">x{{ goodsStock.stock }}</div>
               </div>
             </template>
+            <div class="prow-total">
+              <span>￥</span>{{ item.goods_stock | sumPrice }}
+            </div>
           </div>
 
         </div>
@@ -221,11 +227,32 @@
       }
 
       &-middle {
-        padding: 3px 0;
+        padding: 5px 0;
         justify-content: space-between;
         font-size: @font-size-common;
         font-weight: 400;
         color: #727273;
+
+        >div:first-child {
+          .price {
+            font-size: 14px;
+            margin-left: 10px;
+            vertical-align: text-bottom;
+          }
+        }
+      }
+
+      &-total {
+        span {
+          font-size: 12px;
+          vertical-align: baseline;
+        }
+
+        padding-top: 6px;
+        font-size: 16px;
+        font-weight: 400;
+        color: #F45642;
+        line-height: 24px;
       }
     }
   }
@@ -296,8 +323,17 @@ export default {
     console.log('页面隐藏？');
   },
 
+  mounted() {
+    this.handleUpdateValues()
+  },
+
   methods: {
 
+    handleUpdateValues() {
+      const arrs = this.value
+      if (Array.isArray(arrs) && arrs.length) this.list = [...arrs]
+    },
+
     handleTest() {
       this.list.push({ name: 1 })
     },
@@ -305,17 +341,35 @@ export default {
     handleUpdateList(data) {
       const { customCount, goodsStock, item, GoodsPrice } = data
       console.log('handleUpdateList', customCount, goodsStock, item, GoodsPrice);
-
-      let isHasGoods = this.list.some(goods => goods.id === item.id)
-
-      // TODO: 优先判断是否存在该商品。不存在新增。 存在添加到商品`goos_stock`中
+      const isHasGoods = this.list.some(goods => goods.goods_id === item.id)
       if (isHasGoods) {
-        let idx = this.list.findIndex(goods => goods.id === item.id)
-        console.log('%c query idx >>>', 'background: blue; color: #fff', idx);
+        let idx = this.list.findIndex(goods => goods.goods_id === item.id)
+        const { goods_stock } = this.list[idx]
+        // 判断是否以添加规格
+        let hasGoodsStock = goods_stock.some(standard => standard.id === goodsStock.id)
+        if (hasGoodsStock) {
+          let _idx = goods_stock.findIndex(standard => standard.id === goodsStock.id)
+          if (_idx >= 0) {
+            goods_stock[_idx] = {
+              ...goods_stock[_idx],
+              price: GoodsPrice,
+              stock: customCount
+            }
+          }
+        } else {
+          goods_stock.push({
+            id: goodsStock.id,
+            name: goodsStock.name,
+            price: GoodsPrice,
+            stock: customCount
+          })
+        }
+        this.$forceUpdate()
       } else {
         const _template_ = {
           flag: 3,
           id: item.id,
+          goods_id: item.id,
           goods_category_first: item.goods_category_first,
           goods_category_id: item.goods_category_id,
           goods_no: item.goods_no,
@@ -323,7 +377,7 @@ export default {
           goods_brand: item.goods_brand,
           goods_stock: [
             {
-              id: goodsStock.goods_id,
+              id: goodsStock.id,
               name: goodsStock.name,
               price: GoodsPrice,
               stock: customCount
@@ -414,18 +468,16 @@ export default {
       })
     },
 
-    handleRemoveRow() {
-      let article = '学生秋冬季节校服样式二'
+    handleRemoveRow(item, idx) {
+      let article = item.goods_name
       this.$dialog.confirm({
-        title: '删除领用物品',
+        title: `删除${this.title}`,
         message: `请确认是否删除“${article}”的信息`,
         confirmButtonText: '否',
         confirmButtonColor: '#576B95',
         cancelButtonText: '是'
-      }).then(res => {
-        this.$toast(res)
-      }).catch(err => {
-        this.$toast(err)
+      }).catch(() => {
+        this.list.splice(idx, 1)
       })
     },
 
@@ -453,6 +505,23 @@ export default {
       })
     }
   },
+  filters: {
+    // NOTE: 累加器
+    sumPrice(arrs) {
+      let sum = 0
+      return arrs.reduce((accumulator, cur) => (accumulator + (Number(cur.price) * Number(cur.stock))), sum)
+    },
+  },
+  watch: {
+    list: {
+      handler(arrs) {
+        if (Array.isArray(arrs) && arrs.length) {
+          this.$listeners['input'] && this.$emit('input', arrs)
+        }
+      }
+
+    }
+  },
   beforeDestroy() {
     console.log('%c destory $off updateProductList >>>', 'background: blue; color: #fff',);
     vueBus.$off('updateProductList')

src/views/applyfor/components/IndexType1.vue

@@ -1,5 +1,8 @@
 <template>
     <div class="type6-container">
+        <div class="btn-container" @click="handleNavRightBack">
+            <div class="btn-span">我的</div>
+        </div>
         <c-input title="申请事由" :required="true" input-type="textarea" :maxlength="800" v-model="reason" />
 
         <c-select title="采购类型" :required="true" v-model="type" :list="applyTypeList" pickerValueKey="name"
@@ -7,7 +10,7 @@
 
         <!-- NOTE: 只有货物采购才有 采购明细 -->
         <template v-if="type == '1'">
-            <c-product-store v-model="apply_goods" type="1" />
+            <c-product-store ref="productStoreRef" v-model="apply_goods" type="1" />
         </template>
 
         <c-input title="总金额（元）" :required="true" v-model="total_amount" />
@@ -16,7 +19,7 @@
 
         <c-files v-model="document" />
 
-        <c-files ctype="images" v-model="images" />
+        <c-files ref="imageRef" ctype="images" v-model="images" />
 
         <c-select title="支付方式" :required="true" :list="applyPayTypeList" v-model="pay_type" pickerValueKey="name"
             pickerValueId="id" />
@@ -54,8 +57,8 @@ export default {
             applyTypeList: this.$store.state.enum.applyTypeList,
             applyPayTypeList: this.$store.state.enum.applyPayTypeList,
 
-            // TODO: 缺少拟稿部门、落款选择数据列表
             // formData start
+            way: 'create',
             id: '',
             module: 1,
             reason: '', // 申购事由
@@ -78,9 +81,69 @@ export default {
     },
 
     methods: {
+        // NOTE: 设置标题等
+        navigationSetting() {
+            // settingNavigationTitle({
+            //     title: '维修申请'
+            // })
+
+            // settingNavigationRight({
+            //     show: true,
+            //     control: true,
+            //     text: '我的出差',
+            //     callback: this.handleNavRightBack
+            // })
+        },
+        handleNavRightBack(result) {
+            console.log('result', result);
+            this.$router.push({
+                name: 'ApplyState',
+                query: {
+                    type: this.module
+                }
+            })
+        },
+
         // 获取编辑数据
         handleFormatEditData(data) {
-            console.log('%c edit data type6 >>>', 'background: blue; color: #fff', data);
+            console.log('%c edit data type1 >>>', 'background: blue; color: #fff', data);
+            const IS_EDIT = this.flag === 'approve'
+            this.way = IS_EDIT ? 'edit' : 'update'
+            this.id = IS_EDIT ? data.approve_id : data.id
+            this.reason = data.reason
+            this.type = data.type
+
+            const mif = data.module_info
+
+            this.total_amount = `${Number(mif.total_amount)}`
+            this.pay_type = mif.pay_type
+
+            if (mif.apply_date) {
+                this.apply_date = mif.apply_date
+            }
+
+            this.apply_goods = data.apply_goods.map(goods => ({
+                ...goods,
+                goods_stock: JSON.parse(goods.goods_stock)
+            }))
+
+            if (data.module_info.images) {
+                this.images = data.module_info.images_text.map(img => ({
+                    url: img
+                }))
+            }
+
+            // TODO: document
+            // if (data.module_info.document_text) {
+            //     this.images = data.module_info.document_text.map(doc => ({
+            //         url: doc
+            //     }))
+            // }
+            // NOTE: 主动触发子组件渲染
+            this.$nextTick(() => {
+                this.$refs.productStoreRef.handleUpdateValues()
+                this.$refs.imageRef.handleUpdateValues()
+            })
         },
         /**
          * @description 提交数据默认函数
@@ -96,20 +159,27 @@ export default {
 
         __format_data__() {
             let templateObj = {
+                way: this.way,
                 module: this.module,
                 reason: this.reason,
                 type: this.type,
                 total_amount: this.total_amount,
                 pay_type: this.pay_type,
                 apply_date: this.apply_date,
-
+                apply_goods: this.apply_goods,
                 approve_user: this.approvePeople.map(user => (user.userid || user.emplId)).join(','),
                 copy_user: this.copyPeople.map(user => (user.userid || user.emplId)).join(',')
             }
 
-            // TODO: 格式化尚未完成
-            // document
-            // images
+            let images = this.images
+            if (Array.isArray(images) && images.length) {
+                templateObj.images = images.map(image => image.url).join(',')
+            }
+
+            let documents = this.document
+            if (Array.isArray(documents) && documents.length) {
+                templateObj.document = documents.map(document => document.url).join(',')
+            }
 
             if (this.id) templateObj.id = this.id
             return templateObj
@@ -119,14 +189,14 @@ export default {
             let mapTxt = {
                 'reason': '申购事由',
                 'type': '采购类型',
-                // 申购明细
+                'apply_goods': '申购明细',
                 'total_amount': '总金额',
                 'pay_type': '支付方式'
             }
             let requiredKey = [
                 'reason',
                 'type',
-                // 申购明细
+                'apply_goods',
                 'total_amount',
                 'pay_type'
             ]
@@ -142,17 +212,9 @@ export default {
                 const res = await this.postApi(data)
                 if (res.code === 1) {
                     this.$toast(res.msg)
-
-                    // TODO: 提交成功后跳转到我的审批
-                    /*
-                    this.$router.push({
-                        name: '',
-                        query: {
-                            formtype: this.formType
-                        }
-                    })
-                    */
-
+                    if (this.flag === 'approve') {
+                        this.$router.go(-1)
+                    } else this.__jump2apply_state__()
                 }
             } catch (e) {
                 console.log('it5, __post__', e);

src/views/approve/components/ApproveControl.vue

@@ -74,10 +74,11 @@ export default {
                     case 2:
                         temparr = [
                             urging,
-                            // {
-                            //     ...edit,
-                            //     disable: true
-                            // },
+                            // TEMPORARY: 临时取消注释展示
+                            {
+                                ...edit,
+                                disable: false
+                            },
                             revoke,
                             print
                         ]

src/views/approve/detail.vue

@@ -211,7 +211,7 @@ export default {
             //     },
             //     {
             //         title: '支付方式',
-            //         value: '银行转账' // NOTE: 转账方式理论上来讲也是一套枚举
+            //         value: '银行转账'
             //     }
             // ],