接口文件夹创建

src/api/expend/expendMx.js

@@ -0,0 +1,18 @@
+import request from '@/utils/request'
+
+// 消耗单明细列表
+export function mxList(data) {
+  return request({
+    url: `/pu/doc/list`,
+    method: 'post',
+    data: data
+  })
+}
+// 消耗单明细下拉数据
+export function pullMx(data) {
+  return request({
+    url: `/pu/doc/addToSpdConsumerDocAndItem`,
+    method: 'post',
+    data: data
+  })
+}

src/views/expend/expendMx.vue

@@ -1,5 +1,230 @@
 <template>
-  <div>
-    111
+  <div id="expendMx">
+    <div v-if="isList">
+      <el-card
+        v-loading="loading"
+        style="position: relative;"
+      >
+      <el-form class="search_area" label-width="auto">
+        <el-row :gutter="10">
+          <el-col :span="1.5">
+            <el-form-item label="通用名称">
+                <el-input
+                  v-model.trim="params.commonName"
+                  size="mini"
+                  clearable
+                  style="width: 200px"
+                />
+              </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="注册名">
+                <el-input
+                  v-model.trim="params.registrationName"
+                  size="mini"
+                  clearable
+                  style="width: 200px"
+                />
+              </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="厂家名称">
+                <el-input
+                  v-model.trim="params.factoryName"
+                  size="mini"
+                  clearable
+                  style="width: 200px"
+                />
+              </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="型号">
+                <el-input
+                  v-model.trim="params.model"
+                  size="mini"
+                  clearable
+                  style="width: 200px"
+                />
+              </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label-width="80px">
+              <el-button type="primary" size="mini" icon="el-icon-search" @click="searchList">搜 索</el-button>
+              <el-button size="mini" plain icon="el-icon-refresh" @click="resetList">重 置</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+
+      <div class="btn_grooup">
+        <el-button type="primary" size="mini" @click="submits">提交</el-button>
+        <el-button type="primary" size="mini" @click="pulldata">下拉数据</el-button>
+        <el-button type="primary" size="mini" @click="huizong">汇总</el-button>
+      </div>
+
+      <el-super-ux-table
+        id="data-table"
+        v-model="tableData"
+        index
+        checkbox
+        :size="size"
+        :dict="dict"
+        :page="pageInfo"
+        :height=500
+        :columns="TableColumns"
+        pagination
+        convenitentOperation
+        storage-key="expendMxList"
+        @row-dblclick="useSee"
+        @row-select="useSelect"
+        @selection-change="handleSelectionChange"
+        @row-click="rowSelect"
+        @pagination="useQuery(params, pageInfo)"
+        ref="tables"
+      >
+        <ux-table-column
+          fixed="right"
+          title="操作"
+          align="center"
+          width="100"
+          >
+          <template slot-scope="scope">
+            <!-- <el-button type="text" size="mini" v-if="scope.row.status == '1' && scope.row.flowId" @click="reback(scope.row)">收回</el-button> -->
+            <el-button type="text" size="mini" @click="check(scope.row)">查看</el-button>
+            <el-button type="text" size="mini" @click="edit(scope.row)">编辑</el-button>
+          </template>
+        </ux-table-column>
+      </el-super-ux-table>
+
+      </el-card>
+    </div>
+
+    <Add v-model="isList" v-if="!isList" :pageStu="page" :disable="disable" :row="rowDetail" @refresh="searchList"/>
   </div>
-</template>
+</template>
+
+<script>
+import { mxList, pullMx } from '@/api/expend/expendMx.js'
+export default {
+  dicts: ['sys_equipment_type'],
+  components: {
+    Add: () => import("./expendMxDetail.vue"),
+    ElSuperUxTable: () => import("@/components/super-ux-table/index.vue"),
+  },
+  data() {
+    return {
+      // 页面配置
+      isList: true,
+      // 页面状态
+      page: '',
+      disable: false,
+      rowDetail: {},
+      size: "mini",
+      loading: false,
+      params: {
+        commonName: '',
+        registrationName: '',
+        deviceCategory: '',
+        departmentCode: '',
+        factoryName: '',
+        model: '',
+        referencePrice: '',
+        parameters: '',
+        isDeleteFile: '',
+        isProjectOrFactoryEmpower: '',
+        remark: ''
+      },
+      pageInfo: {
+        pageNum: 1,
+        pageSize: 20,
+        total: 0
+      },
+      tableData: [],
+      selectData: [],
+      // SearchColumns: SearchColumns,
+      TableColumns: [
+        { item: { key: "serviceFee", title: "服务费合计" }, attr: {} },
+        { item: { key: "custCode", title: "医院编码" }, attr: {} },
+        { item: { key: "supplierCode", title: "供应商编码" }, attr: {} },
+        { item: { key: "supplierName", title: "供应商名称" }, attr: {} },
+        { item: { key: "isSum", title: "是否汇总" }, attr: {} },
+        { item: { key: "settleNo", title: "结算单号"}, attr: {} },
+        { item: { key: "startDate", title: "结算开始日期" }, attr: {} },
+        { item: { key: "endDate", title: "结算截止日期" }, attr: {} },
+        { item: { key: "totalAmount", title: "合计金额" }, attr: {} },
+        // { item: { key: "isProjectOrFactoryEmpower", title: "是否项目/厂家年度授权" }, attr: {is: "el-dict-tag", dictName: "sys_equipment_type"} },
+        // { item: { key: "parameters", title: "参数" }, attr: {} },
+        { item: { key: "remark", title: "备注"}, attr: {} },
+        { item: { key: "code", title: "编码"}, attr: {} },
+        { item: { key: "verifyState", title: "单据状态"}, attr: {} },
+      ].map(({ item, attr }) => ({
+      attr,
+      item: {
+        ...item,
+        sortabled: true,
+        fixedabled: true,
+        filterabled: true,
+        hiddenabled: true,
+      },
+      })),
+      ids: []
+    }
+  },
+  created() {
+    this.useQuery(this.params, this.pageInfo)
+  },
+  methods: {
+    searchList() {},
+    resetList() {},
+    useSee() {},
+    useSelect() {},
+    handleSelectionChange(selection) {
+      console.log('选中', selection)
+      this.ids = selection.map(item => item.id)
+      console.log('选中数组', this.ids)
+    },
+    rowSelect(row) {
+      this.$refs.tables.toggleRowSelection([{row: row}]);
+    },
+    async useQuery(prop, page) {
+      let params = {...prop, ...page}
+      await mxList(params).then(res => {
+        if( res.code === 200 ) {
+          this.tableData = res.rows
+          this.pageInfo.total = res.total
+        }
+      })
+    },
+    submits() {
+      this.isList = false
+      this.page = 'add'
+      this.disable = false
+    },
+    pulldata() {
+      pullMx().then(res => {
+        
+      })
+    },
+    huizong() {},
+    check() {},
+    edit() {},
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+#expendMx {
+  padding: 12px;
+  box-sizing: border-box;
+  overflow-y: scroll;
+}
+.btn_grooup {
+  margin-bottom: 10px;
+  display: flex;
+  justify-content: flex-end;
+}
+</style>

src/views/expend/expendMxDetail.vue

@@ -1,5 +1,226 @@
 <template>
-  <div>
-    222
+  <div id="editExpendMx">
+    <el-card style="position: relative;">
+      <span>基本信息</span>
+      <el-form :model="basicForm" :rules="basicRules" ref="basic" label-width="auto" :show-message="false">
+        <el-row :gutter="10">
+
+          <el-col :span="1.5">
+            <el-form-item label="编码" prop="code">
+              <el-input style="width: 200px" clearable disabled size="mini" v-model="basicForm.code">
+              </el-input>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="服务费合计" prop="serviceFee">
+              <el-input style="width: 200px" clearable disabled size="mini" v-model="basicForm.serviceFee">
+              </el-input>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="医院编码" prop="custCode">
+              <el-input style="width: 200px" clearable :disabled="sonDisable" size="mini" v-model="basicForm.custCode">
+              </el-input>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="医院名称" prop="custName">
+              <el-input style="width: 200px" clearable :disabled="sonDisable" size="mini" v-model="basicForm.custName">
+              </el-input>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="供应商编码" prop="supplierCode">
+              <el-input style="width: 200px" clearable :disabled="sonDisable" size="mini" v-model="basicForm.supplierCode">
+              </el-input>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="供应商名称" prop="supplierName">
+              <el-input style="width: 200px" clearable :disabled="sonDisable" size="mini" v-model="basicForm.supplierName">
+              </el-input>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="结算单号" prop="settleNo">
+              <el-input style="width: 200px" clearable :disabled="sonDisable" size="mini" v-model="basicForm.settleNo">
+              </el-input>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="结算开始日期" prop="startDate">
+              <el-date-picker
+                v-model="basicForm.startDate"
+                :disabled="sonDisable"
+                clearable
+                type="date"
+                value-format="yyyy-MM-dd"
+                size="mini"
+                style="width: 200px"
+              >
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="结算截止日期" prop="endDate">
+              <el-date-picker
+                v-model="basicForm.endDate"
+                :disabled="sonDisable"
+                clearable
+                type="date"
+                value-format="yyyy-MM-dd"
+                size="mini"
+                style="width: 200px"
+              >
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="合计金额" prop="totalAmount">
+              <el-input style="width: 200px" clearable disabled size="mini" v-model="basicForm.totalAmount">
+              </el-input>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="备注" prop="remark">
+              <el-input style="width: 200px" clearable :disabled="sonDisable" size="mini" v-model="basicForm.remark">
+              </el-input>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+      </el-form>
+
+      <div class="btn_group">
+        <el-button type="primary" size="mini"  @click="editPage" v-if="sonPageStu == 'check'">编辑</el-button>
+        <el-button type="primary" size="mini"  @click="save" v-if="sonPageStu == 'add' || sonPageStu == 'edit'">保存</el-button>
+        <el-button size="mini" plain @click="back">返回</el-button>
+      </div>
+
+      <div class="btn_grooup">
+        <span>明细信息</span>
+        <div>
+          <el-button type="primary" size="mini" @click="addLine" v-if="!sonDisable">增行</el-button>
+          <el-button type="primary" size="mini" @click="delLines" v-if="!sonDisable">删行</el-button>
+        </div>
+      </div>
+
+      <ux-grid
+        :data="basicForm.sysMaterialDeviceOriginItemList"
+        border
+        :cell-style="{ borderColor: '#c0c0c0' }"
+        :header-cell-style="{ borderColor: '#c0c0c0' }"
+        class="exporttable"
+        height="410"
+        max-height="410"
+        style="font-size: 12px;"
+        @selection-change="handleSelectionChange"
+        ref="table"
+        show-header-overflow="tooltip"
+        show-overflow="tooltip"
+        keep-source
+        beautifyTable
+        :checkbox-config="{highlight: true, trigger: 'row'}"
+        :edit-config="{trigger: 'click', mode: 'row'}">
+      >
+        <ux-table-column resizable type="checkbox" width="50px" fixed="left"/>
+        <ux-table-column resizable title="医保编码" field="healthCode" align="center"/>
+        <ux-table-column resizable title="物料编码" field="itemCode" align="center"/>
+        <ux-table-column resizable title="物料名称" field="itemName" align="center"/>
+        <ux-table-column resizable title="规格型号" field="itemSpec" align="center"/>
+        <ux-table-column resizable title="厂家" field="manufactor" align="center"/>
+        <ux-table-column resizable title="单位" field="itemUom" align="center"/>
+        <ux-table-column resizable title="是否带量" field="isWhether" align="center"/>
+        <ux-table-column resizable title="服务费率" field="ratio" align="center" edit-render>
+          <template v-slot:edit="scope">
+            <el-input clearable :disabled="sonDisable" size="mini" v-model="scope.row.ratio"/>
+          </template>
+        </ux-table-column>
+        <ux-table-column resizable title="数量" field="qty" align="center"/>
+        <ux-table-column resizable title="单价" field="price" align="center"/>
+        <ux-table-column resizable title="小计" field="amount" align="center"/>
+        <ux-table-column resizable title="备注" field="detailRemark" align="center"/>
+        <ux-table-column resizable title="服务费" field="serviceFee" align="center"/>
+        <ux-table-column resizable title="是否汇总" field="isSum" align="center"/>
+      </ux-grid>
+    </el-card>
   </div>
-</template>
+</template>
+
+<script>
+export default {
+  props: ['pageStu','row', 'disable'],
+  model: {
+    prop: 'isList',
+    event: 'jugislist'
+  },
+  data() {
+    return {
+      // 不能直接改变props传来的值
+      sonPageStu: this.pageStu,
+      sonDisable: this.disable,
+      basicForm: {
+        id: '',
+        code: '',
+        serviceFee: '',
+        custCode: '',
+        custName: '',
+        supplierCode: '',
+        supplierName: '',
+        settleNo: '',
+        startDate: '',
+        endDate: '',
+        totalAmount: '',
+        remark: '',
+      },
+      basicRules: {},
+      ids:[],
+    }
+  },
+  methods: {
+    editPage() {},
+    save() {},
+    back() {
+      this.$emit('jugislist', true)
+      this.$emit('refresh')
+    },
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item =>{
+        return item.id
+      })
+      console.log('选中数组', this.ids)
+    },
+    addLine() {
+
+    },
+    delLines() {
+
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.btn_group {
+  display: flex;
+  justify-content: space-between;
+  position: absolute;
+  top: 10px;right: 20px;
+
+}
+.btn_grooup {
+  margin-bottom: 10px;
+  display: flex;
+  justify-content: space-between;
+}
+</style>