|
@@ -7,8 +7,8 @@
|
|
|
</div>
|
|
</div>
|
|
|
<div class="pd-16">
|
|
<div class="pd-16">
|
|
|
<el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="auto">
|
|
<el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="auto">
|
|
|
- <el-form-item label="会员名称" prop="cpyName">
|
|
|
|
|
- <el-input v-model="queryParams.cpyName" placeholder="搜会员名称关键字" clearable style="width: 180px" @keyup.enter="handleQuery" />
|
|
|
|
|
|
|
+ <el-form-item label="检测项名称:" prop="name">
|
|
|
|
|
+ <el-input v-model="queryParams.name" placeholder="请输入检测项名称关键字" clearable style="width: 180px" @keyup.enter="handleQuery" />
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
<el-form-item>
|
|
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
|
@@ -16,22 +16,123 @@
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
</el-form>
|
|
</el-form>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
+ <div class="flex1 ov-hd d-flex content-border">
|
|
|
|
|
+ <div class="tree-wrap">
|
|
|
|
|
+ <div v-show="tabActive === '1'">
|
|
|
|
|
+ <el-tree ref="treeItemsRef" class="base-tree-tabs" auto-expand-parent default-expand-all node-key="id" :data="itemsData" :props="{ label: 'name' }" highlight-current @node-click="itemsClick" accordion>
|
|
|
|
|
+ <template #default="{ node, data }">
|
|
|
|
|
+ <span>{{ node.label }} <template v-if="!data?.children">({{ data?.itemCount || '0' }})</template></span>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-tree>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div v-show="tabActive === '2'">
|
|
|
|
|
+ <el-tree ref="treeStandardsRef" class="base-tree-tabs" auto-expand-parent :data="standards" node-key="id" :props="{ label: 'name' }" highlight-current @node-click="standardsClick" accordion>
|
|
|
|
|
+ <template #default="{ node, data }">
|
|
|
|
|
+ <span>{{ node.label }} <template v-if="!data?.children">({{ data?.itemCount || '0' }})</template></span>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-tree>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="flex1 ov-hd d-flex flex-cln">
|
|
|
|
|
+ <div class="flex1 ov-hd">
|
|
|
|
|
+ <vxe-table :loading="loading" border :data="list" min-height="0" max-height="100%">
|
|
|
|
|
+ <!-- 序号 -->
|
|
|
|
|
+ <vxe-column type="seq" width="60" title="序号" align="center" />
|
|
|
|
|
+ <vxe-column title="检测项目" align="center" field="name" min-width="100" :formatter="colNoData" />
|
|
|
|
|
+ <vxe-column title="单价(元、批次)" align="center" field="price" min-width="100" :formatter="colNoData" />
|
|
|
|
|
+ <vxe-column title="备注" align="center" field="description" min-width="100" :formatter="colNoData" />
|
|
|
|
|
+ </vxe-table>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
|
|
|
|
+ <div class="pd-5"></div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</template>
|
|
</template>
|
|
|
<script setup name="Items" lang="ts">
|
|
<script setup name="Items" lang="ts">
|
|
|
|
|
+import { itemsList, itemsListByTree, itemsStandardList } from '@/api/cdt/items';
|
|
|
|
|
+import { colNoData } from '@/utils/noData';
|
|
|
import { searchTabs } from '@/views/models/index';
|
|
import { searchTabs } from '@/views/models/index';
|
|
|
|
|
+
|
|
|
|
|
+// 树组件
|
|
|
|
|
+const treeItemsRef = ref<any>();
|
|
|
|
|
+const treeStandardsRef = ref<any>();
|
|
|
const tabActive = ref('1');
|
|
const tabActive = ref('1');
|
|
|
-const queryParams = ref({
|
|
|
|
|
- cpyName: '',
|
|
|
|
|
|
|
+const queryParams = ref<any>({
|
|
|
|
|
+ pageNum: 1,
|
|
|
|
|
+ pageSize: 10,
|
|
|
|
|
+ name: '',
|
|
|
|
|
+ itemTypeId: '',
|
|
|
|
|
+ packageId: ''
|
|
|
});
|
|
});
|
|
|
|
|
+const loading = ref(false);
|
|
|
|
|
+const total = ref(0);
|
|
|
|
|
+const list = ref<any>([]);
|
|
|
|
|
+const itemsData = ref<any>([]);
|
|
|
|
|
+const getList = async () => {
|
|
|
|
|
+ loading.value = true;
|
|
|
|
|
+ const res = await itemsList(queryParams.value);
|
|
|
|
|
+ if (!res || res.code !== 200) return;
|
|
|
|
|
+ list.value = res.rows;
|
|
|
|
|
+ total.value = res.total;
|
|
|
|
|
+ loading.value = false;
|
|
|
|
|
+};
|
|
|
const handleQuery = () => {
|
|
const handleQuery = () => {
|
|
|
- console.log('handleQuery');
|
|
|
|
|
|
|
+ queryParams.value.pageNum = 1;
|
|
|
|
|
+ getList();
|
|
|
};
|
|
};
|
|
|
const resetQuery = () => {
|
|
const resetQuery = () => {
|
|
|
- console.log('resetQuery');
|
|
|
|
|
|
|
+ queryParams.value = {
|
|
|
|
|
+ pageNum: 1,
|
|
|
|
|
+ pageSize: 10,
|
|
|
|
|
+ name: '',
|
|
|
|
|
+ itemTypeId: '',
|
|
|
|
|
+ packageId: ''
|
|
|
|
|
+ };
|
|
|
|
|
+ // 重置树高亮
|
|
|
|
|
+ treeItemsRef.value?.setCurrentKey(null, true);
|
|
|
|
|
+ treeStandardsRef.value?.setCurrentKey(null, true);
|
|
|
|
|
+ handleQuery()
|
|
|
|
|
+};
|
|
|
|
|
+const getTabsTree = async () => {
|
|
|
|
|
+ const res = await itemsListByTree();
|
|
|
|
|
+ if (!res || res.code !== 200) return;
|
|
|
|
|
+ itemsData.value = res.data;
|
|
|
|
|
+};
|
|
|
|
|
+const itemsClick = (data: any) => {
|
|
|
|
|
+ if (!data.children) {
|
|
|
|
|
+ queryParams.value.itemTypeId = data.id;
|
|
|
|
|
+ }
|
|
|
|
|
+ handleQuery()
|
|
|
|
|
+};
|
|
|
|
|
+const standardsClick = (data: any) => {
|
|
|
|
|
+ if (!data.children) {
|
|
|
|
|
+ queryParams.value.packageId = data.id;
|
|
|
|
|
+ }
|
|
|
|
|
+ handleQuery()
|
|
|
|
|
+};
|
|
|
|
|
+// 查询执行标准列表
|
|
|
|
|
+const standards = ref<any>([]);
|
|
|
|
|
+const getStandardList = async () => {
|
|
|
|
|
+ const res = await itemsStandardList({ pageNum: 1, pageSize: 10000 });
|
|
|
|
|
+ if (!res || res.code !== 200) return;
|
|
|
|
|
+ standards.value = res.rows;
|
|
|
};
|
|
};
|
|
|
onMounted(() => {
|
|
onMounted(() => {
|
|
|
- console.log("Items mounted");
|
|
|
|
|
|
|
+ getTabsTree();
|
|
|
|
|
+ getStandardList();
|
|
|
|
|
+ getList();
|
|
|
});
|
|
});
|
|
|
</script>
|
|
</script>
|
|
|
|
|
+<style lang="scss" scoped>
|
|
|
|
|
+.tree-wrap {
|
|
|
|
|
+ width: 310px;
|
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
|
+ border-right: 1px solid #ebeef5;
|
|
|
|
|
+ padding: 16px;
|
|
|
|
|
+}
|
|
|
|
|
+.content-border {
|
|
|
|
|
+ border: 1px solid var(--border-color);
|
|
|
|
|
+}
|
|
|
|
|
+</style>
|