jufubao-admin-library 1.0.0-beta1

package/library/viewModules/viewsEnterpriseBuy/viewsEnterpriseBuy/detail.vue

@@ -0,0 +1,503 @@
+<template>
+  <div class="app-container">
+    <el-card class="app-container__list">
+      <div class="app-container__list-name">
+        <div>{{baseData.main_order.purchase_name}} （{{baseData.main_order.order_status_name}}）</div>
+        <div>
+          <order-button
+            v-if="isOperate"
+            :events="buttonData"
+            :purchase_main_order_id="id"
+            @refresh="handeleRefresh"
+            @confirmPrice="handleConfirmPrice"
+          ></order-button>
+        </div>
+      </div>
+    </el-card>
+    <el-card class="app-container__list">
+      <table-card :orderData="baseData" :key="baseKey"></table-card>
+    </el-card>
+    <el-card class="app-container__list">
+      <div class="mb-10">商品（{{product_num}}个）</div>
+      <div class="mb-10">配送至 <i class="el-icon-location-information"></i>{{baseData.main_order.receipt_province_name}}{{baseData.main_order.receipt_city_name}}{{baseData.main_order.receipt_area_name}}{{baseData.main_order.receipt_street_name}}{{baseData.main_order.receipt_address_detail}}</div>
+      <div class="app-container__list-table">
+        <xd-table
+          :default-select="['12987122','12987126']"
+          :get-link="getLink"
+          :headers="orderHeaders"
+          :key="tableKey"
+          :list="tables"
+          :hasExpand="true"
+          :stripe="false"
+          default-expand-all
+        >
+          <template slot="expand" slot-scope="scope1">
+            <xd-table
+              is-border
+              :stripe="false"
+              :show-header="false"
+              :key="childKey"
+              :get-link="getLinkChild"
+              :headers="orderHeadersIn"
+              :list="scope1.row.order_products"
+              default-expand-all
+              :custom-function="item=>handleInCustom(item,scope1.row)"
+            >
+              <template slot="info" slot-scope="scope">
+                <xd-store-product
+                  :key="tableRefresh"
+                  :list="getProductInfo(scope.row)"
+                  width="60"
+                  height="60"
+                ></xd-store-product>
+              </template>
+              <template slot="sale_price_slot" slot-scope="scope">
+               <div style="font-size:14px">
+                 <span class="red">¥{{scope.row.sale_price}}</span><i style="margin-left:5px;cursor:pointer" v-if="scope.row.is_can_edit_amount===1" @click="changeSalePrice(scope.row,scope.$index,scope)" class="el-icon-edit-outline"></i>
+               </div>
+              </template>
+              <template slot="supplier_settlement_amount" slot-scope="scope">
+                <div v-if="scope.row.is_can_edit_amount===1">
+                  <el-input v-model="scope.row.supplier_settlement_amount" type="number" @change="handleChangeAmount(scope.row.supplier_settlement_amount,scope1)" placeholder="请输入清单结算金额"></el-input>
+                  <span class="red">结算金额为最终支付金额</span>
+                </div>
+                <div v-else>
+                  <span class="red">{{scope.row.supplier_settlement_amount}}</span>元
+                </div>
+              </template>
+            </xd-table>
+          </template>
+        </xd-table>
+      </div>
+      <div style="padding-left: 150px">
+        <el-button @click="goBack" type="primary">返回</el-button>
+      </div>
+    </el-card>
+    <xd-dialog
+      title="单价"
+      v-if="dialogVisiblePrice"
+      :show.sync="dialogVisiblePrice"
+      width="40%"
+      @onConfirm="handlePrice"
+      @onClose="dialogVisiblePrice = false"
+      @onCancel="dialogVisiblePrice = false"
+    >
+      <xd-base-dynamic-field
+        ref="rule"
+        v-if="listFormPrice.length > 0"
+        v-model="listValuePrice"
+        :key="renderFormPriceKey"
+        :list="listFormPrice"
+        label-width="140px"
+      ></xd-base-dynamic-field>
+    </xd-dialog>
+  </div>
+</template>
+
+
+<script>
+import XdBaseDynamicField from "@/components/XdBaseDynamicField"
+import { getOptions } from "@/utils/options"
+import { Loading } from 'element-ui'
+import checkPermission from "@/utils/permission"
+import XdSelectList from "@/components/XdSelectList"
+import XdSelectRemote from "@/components/XdSelectRemote"
+import XdTable from "@/components/XdTable"
+import TableCard from "./table-card"
+import XdStoreProduct from "@/components/XdStoreProduct"
+import orderButton from "./compontents/OrderInfoButton"
+import XdDialog from "@/components/XdDialog"
+import permissions from "@/constant/permissions"
+import {
+  mapActions,
+  mapState,
+} from 'vuex'
+
+export default {
+  name: "userPondDetail",
+  components: {
+    XdBaseDynamicField,
+    XdSelectList,
+    XdSelectRemote,
+    TableCard,
+    XdTable,
+    XdStoreProduct,
+    orderButton,
+    XdDialog
+  },
+  data () {
+    TableCard
+    return {
+      formList: null,
+      formParams: {},
+      id: null,
+      renderFormKey: Date.now(),
+      customForm: {
+        company_id: '',
+        department_id: '',
+      },
+      customRules: {},
+      orderHeaders:[
+        // { type: 'selection' },
+        { type: 'expand', hide: true },
+        { "type": "normal", "prop": "base", "align": "center","minWidth": 300, "label": "商品信息" },
+        { "type": "normal", "prop": "brand_name", "width": 150, "align": "center", "label": "品牌" },
+        // #ifdef partner-wholesale
+        { "type": "price", "prop": "sale_price", "align": "center", "label": "单价（元）" },
+        { "type": "price", "prop": "min_sale_price", "align": "center","width": 150, "label": "最低售价（元）" },
+        // #endif
+        // #ifdef admin oa-finance
+        { "type": "price", "prop": "dist_price", "align": "center", "label": "分销价（元）" },
+        // #endif
+        { "type": "normal", "prop": "product_num", "align": "center", "label": "数量" },
+        // #ifdef partner-wholesale
+        { "type": "price", "prop": "sale_amount1", "align": "center", "label": "小计" },
+         // #endif
+         // #ifdef admin oa-finance
+        { "type": "price", "prop": "dist_amount1", "align": "center", "label": "小计" },
+         // #endif
+        { "type": "price", "prop": "total_amount1", "align": "center", "label": "订单金额" },
+        { "type": "normal", "prop": "supplier_name1", "align": "center", "label": "供应商" },
+        // #ifdef admin
+        { "type": "normal", "prop": "supplier_settlement_amount1", "align": "center","width":170, "label": "供应商结算金额" },
+        // #endif
+         // #ifdef oa-finance
+        { "type": "price", "prop": "supplier_settlement_amount1", "align": "center","width":170, "label": "实际结算货款" },
+        // #endif
+      ],
+      orderHeadersIn:[
+        { "type": "normal", "prop": "info", "align": "center","minWidth": 300, "label": "商品信息" },
+        { "type": "normal", "prop": "brand_name", "width": 150, "align": "center", "label": "品牌" },
+         // #ifdef partner-wholesale
+        { "type": "normal", "prop": "sale_price_slot", "align": "center", "label": "单价（元）" },
+        { "type": "price", "prop": "min_sale_price", "align": "center","width": 150, "label": "最低售价（元）" },
+         // #endif
+        // #ifdef admin oa-finance
+        { "type": "price", "prop": "dist_price", "align": "center", "label": "分销价（元）" },
+        // #endif
+        { "type": "normal", "prop": "product_num", "align": "center", "label": "数量" },
+         // #ifdef partner-wholesale
+        { "type": "price", "prop": "sale_amount", "align": "center", "label": "小计" },
+        // #endif
+         // #ifdef admin oa-finance
+        { "type": "price", "prop": "dist_amount", "align": "center", "label": "小计" },
+         // #endif
+        // #ifdef oa-finance admin
+        { "type": "price", "prop": "sub_dist_amount", "align": "center", "label": "订单金额" },
+        // #endif
+        // #ifdef partner-wholesale
+        { "type": "price", "prop": "total_amount", "align": "center", "label": "订单金额" },
+        // #endif
+        { "type": "normal", "prop": "supplier_name", "align": "center", "label": "供应商" },
+        // #ifdef admin
+        { "type": "normal", "prop": "supplier_settlement_amount", "align": "center","width":170, "label": "供应商结算金额" },
+        // #endif
+        // #ifdef oa-finance
+        { "type": "price", "prop": "actual_settlement_amount", "align": "center","width":170, "label": "实际结算货款" },
+        // #endif
+      ],
+      tables:[],
+      renderTableKey:'renderTableKey',
+      isJump:false,
+      baseData:null,
+      tableKey:'tableKey',
+      baseKey:'baseKey',
+      childKey:'childKey',
+      tableRefresh:'tableRefresh',
+      buttonData: [],
+      //修改商品价格
+      dialogVisiblePrice:false,
+      listFormPrice:[],
+      listValuePrice:{},
+      renderFormPriceKey:'renderFormPriceKey',
+      changeIndex:'',
+      changeRow:null,
+      product_num:0,
+    }
+  },
+  computed: {
+    isOperate(){
+      return checkPermission([permissions.enterprise_buy.purchaseDetailOperate])
+    },
+  },
+  created () {
+    this.id = this.$route.params.id
+    if (this.id) {
+      this.getOrderDetail();
+    }
+  },
+
+  methods: {
+    ...mapActions('enterprise_buy', [
+      'purchaseMainOrderInfo',
+      'userSettlementPrice',
+      'supplierSettlementAmountBatch'
+    ]),
+    getOrderDetail(){
+      let params = {
+        purchase_main_order_id: this.id
+      }
+      this.purchaseMainOrderInfo(params).then(res => {
+        this.baseData = res.data.order
+        this.tables = res.data.order.sub_orders
+        this.buttonData = res['data']['order']['buttons']
+        let product_num = 0;
+        this.tables.map(item=>{
+          item.supplier_settlement_amount = this.$xdHelper.divisionFloatNumber(item.supplier_settlement_amount,100)
+          product_num+=item.order_products.length
+          item.order_products.map(ls=>{
+            ls.supplier_name = item.supplier_name
+            ls.total_amount = item.total_amount
+            ls.sale_price = this.$xdHelper.divisionFloatNumber(ls.sale_price, 100)
+            ls.purchase_sub_order_id = item.purchase_sub_order_id
+            ls.supplier_settlement_amount = item.supplier_settlement_amount
+            ls.supplier_settlement_amount_finace = item.supplier_settlement_amount
+            ls.actual_settlement_amount = item.actual_settlement_amount
+            if(item.dist_amount){
+              ls.sub_dist_amount = item.dist_amount
+            }
+            if(item.is_can_edit_amount||item.is_can_edit_amount===0){
+               ls.is_can_edit_amount = item.is_can_edit_amount
+            }
+          })
+        })
+        this.product_num = product_num;
+        console.log(this.tables,product_num,'this.tables')
+        this.baseKey = Date.now()
+      }).catch(err => {
+        console.log(err, 'err')
+      })
+    },
+    /**
+     * @description 预设获取页面跳转地址方法
+     * @param item
+     */
+    getLink (item) {
+      return '/users/detail/1'
+    },
+    getLinkChild(){
+      return '/users/detail/1'
+    },
+    handleTableClick ({ row, value, index, rowIndex }) {
+
+    },
+    //修改商品价格
+    changeSalePrice(row,index,aa){
+      console.log(row,index,aa,'rrrrr')
+      this.changeRow = row
+      this.changeIndex = index
+      this.initFormPrice(row)
+    },
+     //设置结算金额form初始化
+    initFormPrice (row) {
+      this.listFormPrice = [
+        {
+          label: '商品名称:', //label
+          ele: 'el-input', //package 名称
+          type: 'text',
+          valueKey: 'product_name', //form[valueKey]
+          value: row.product_name, //v-model
+          placeholder: '输入商品名称',
+          classNmae: 'input40',
+          disabled:true,
+          rules: [
+            {
+              required: true,
+              message: '请输入商品名称',
+              trigger: 'blur'
+            },
+          ]
+        },
+        {
+          label: '单价(元):', //label
+          ele: 'el-input', //package 名称
+          type: 'text',
+          valueKey: 'sale_price', //form[valueKey]
+          value: row.sale_price, //v-model
+          placeholder: '输入单价',
+          classNmae: 'input40',
+          rules: [
+            {
+              required: true,
+              message: '请输入单价',
+              trigger: 'blur'
+            },
+          ]
+        },
+      ]
+
+      this.renderFormPriceKey = Date.now()
+      this.dialogVisiblePrice = true
+    },
+    //修改价格确认
+    handlePrice(){
+      console.log(this.changeRow,'ddddd')
+      let data = {
+        purchase_main_order_id:this.id,
+        items:[
+          {
+            purchase_sub_order_id:this.changeRow.purchase_sub_order_id,
+            items:[
+              {
+                product_id:this.changeRow.product_id,
+                product_sku_id:this.changeRow.product_sku_id,
+                amount:this.$xdHelper.multiplyFloatNumber(this.listValuePrice.sale_price,100),
+              }
+            ]
+          }
+        ]
+      }
+      this.userSettlementPrice(data).then(res=>{
+        this.listValuePrice = {}
+        this.dialogVisiblePrice = false
+        this.$message({
+          message: '修改价格成功',
+          type: 'success'
+        })
+        this.getOrderDetail()
+        console.log(res,'sss')
+      }).catch(err=>{
+        console.log(err,'eeee')
+      })
+    },
+    getProductInfo (value) {
+      return {
+        id: value.product_id,
+        title: value.product_name,
+        thumb: this.getImageFullPath(value.product_thumb),
+        specific: value.product_sku_name, params: { width: 150, height: 150 },
+      }
+    },
+ 
+    handleInCustom ({ action, data }, row) {
+      if (action === 'merge') {
+        let mergeRow = 1
+        let maxRow = 100 //需要合并的最大行数
+        let { row, column, rowIndex, columnIndex } = data
+        let mergeColumns = [];
+        //rowIndex，columnIndex的值是从0开始
+        // #ifdef admin oa-finance
+        mergeColumns = [5,6,7] //第4列需要合并行，并且合并到数组最大值,
+        // #endif
+        // #ifdef partner-wholesale
+        mergeColumns = [6,7,8] //第4列需要合并行，并且合并到数组最大值,
+        // #endif
+        const check = (i) => {
+          return mergeColumns.filter(key => {
+            return key === i
+          }).length > 0
+        }
+
+        if (rowIndex === 0) {
+          if (check(columnIndex)) {
+            return [maxRow, 1]
+          } else return [1, 1]
+        } else {
+          if (check(columnIndex)) {
+            return [0, 0]
+          } else return [1, 1]
+        }
+      }
+    },
+    //确定价格（超管）
+    handleConfirmPrice(e){
+      console.log(this.tables,'dddddd')
+      let copyData = this.$xdHelper.cloneDeep(this.tables)
+      let reg = /^\d+.?\d{0,2}$/
+      for(var i=0;i<copyData.length;i++){
+        if(!copyData[i]['supplier_settlement_amount']){
+          this.$message.error('请输入供应商结算金额且数值需大于0')
+          return
+        }
+        if(!reg.test(Number(copyData[i]['supplier_settlement_amount']))){
+          this.$message.error('小数点后最多保留两位小数')
+          return
+        }
+        if(copyData[i]['supplier_settlement_amount']){
+          copyData[i]['amount'] = this.$xdHelper.multiplyFloatNumber(Number(copyData[i]['supplier_settlement_amount']),100)
+        }
+      }
+      console.log(copyData,'ccc')
+      let data = {
+        purchase_main_order_id:this.id,
+        items:copyData
+      }
+      this.supplierSettlementAmountBatch(data)
+      .then(res=>{
+        this.$message({
+          message: '确认价格成功',
+          type: 'success'
+        })
+        this.getOrderDetail();
+      }).catch(err=>{
+        console.log(err,'err')
+      })
+    },
+    //结算金额改变
+    handleChangeAmount(value,scope1){
+      this.$set(this.tables[scope1['index']],'supplier_settlement_amount',value)
+       console.log(this.tables,value,scope1,2222)
+    },
+    goBack () {
+      this.$router.go(-1)
+    },
+    handeleRefresh(){
+      this.getOrderDetail();
+    },
+  }
+}
+
+</script>
+
+<style scoped lang="scss">
+.header-item {
+  padding: 0 20px;
+  font-size: 14px;
+}
+
+.show {
+  padding: 0 0 10px 0;
+  margin-bottom: 10px;
+  border-bottom: 1px solid #e5e5e5;
+  display: flex;
+  justify-content: flex-end;
+}
+
+.app-container {
+  &__link {
+    display: flex;
+
+    &-use {
+      display: flex;
+      flex-direction: column;
+      width: 150px;
+      padding: 20px;
+      background: #f7f7f7;
+      margin-right: 20px;
+
+      .el-button + .el-button {
+        margin-left: 0px;
+        margin-top: 30px;
+      }
+    }
+
+    &-tabs {
+      flex: 1;
+    }
+  }
+  .mb-10{
+    margin-bottom: 10px;
+  }
+  &__list{
+    margin-bottom: 10px;
+    &-name{
+      display: flex;
+      justify-content: space-between;
+    }
+  }
+}
+.red{
+  color: red!important;
+}
+</style>
+