,

src/views/cloth/hanger/index.vue

@@ -28,12 +28,6 @@
             <el-col :span="1.5">
                 <el-button type="primary" plain icon="el-icon-plus" @click="handleAdd" v-hasPermi="['cloth:hanger:add']" v-if="userInfoVO.userType != '00'">新增</el-button>
             </el-col>
-            <el-col :span="1.5">
-                <el-button type="success" plain icon="el-icon-edit" :disabled="single" @click="handleUpdate" v-hasPermi="['cloth:hanger:edit']" v-if="userInfoVO.userType != '00'">修改</el-button>
-            </el-col>
-            <el-col :span="1.5">
-                <el-button type="danger" plain icon="el-icon-delete" :disabled="multiple" @click="handleDelete" v-hasPermi="['cloth:hanger:remove']" v-if="userInfoVO.userType != '00'">删除</el-button>
-            </el-col>
             <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
         </el-row>
 

src/views/cloth/hanger/queryHangerDetail.vue

@@ -1,134 +1,158 @@
 <template>
-    <div class="app-container">
-        <el-row :gutter="20">
-            <div class="list_title">挂架名称：{{ hangerInfo.name }} 首数：{{ hangerInfo.firstNum }} 尾数：{{ hangerInfo.endNum }}</div>
-        </el-row>
-        <el-row :gutter="20">
-            <el-col :span="4">
-                <div class="head-container-one" :style="{ border: '1px solid #ccc' }">
-                    <el-tree :data="hangerList" :props="defaultProps" :expand-on-click-node="false" node-key="id" highlight-current @node-click="handleNodeClick" />
-                </div>
-            </el-col>
-            <el-col :span="20">
-                <div class="head-column1" :style="{ border: '1px solid #ddd' }">
-                    <el-radio-group v-model="detailId" size="medium" @input="getClothInfo">
-                        <el-radio-button v-for="detail in detailList" :key="detail.id" :label="detail.id" border style="margin-top: 10px; margin-left: 10px" :style="{ border: '1px solid #ddd' }">{{ detail.code }}# {{ detail.isHangerCount }} 件 </el-radio-button>
-                    </el-radio-group>
-                </div>
-            </el-col>
-        </el-row>
-        <el-row :gutter="20">
-            <el-col :span="24">
-                <div class="head-column2" style="margin-top: 20px">
-                    <el-table v-loading="loading" fit highlight-current-row border stripe :data="clothInfoList">
-                        <el-table-column label="订单号" align="center" prop="orderNo" />
-                        <el-table-column label="衣物条码" align="center" prop="washCode" />
-                        <el-table-column label="衣物名称" align="center" prop="clothName" />
-                        <el-table-column label="颜色" align="center" prop="colorName" />
-                        <el-table-column label="挂衣号" align="center" prop="hangerCode" />
-                        <el-table-column label="状态" align="center" prop="status">
-                            <template slot-scope="scope">
-                                <dict-tag :options="dict.type.cloth_order_status" :value="scope.row.status" />
-                            </template>
-                        </el-table-column>
-                        <el-table-column label="取衣时间" align="center" prop="takeClothTime" />
-                        <el-table-column label="姓名" align="center" prop="userName" />
-                        <el-table-column label="手机号" align="center" prop="phoneNumber" />
-                    </el-table>
-                </div>
-            </el-col>
-        </el-row>
-    </div>
+  <div class="app-container">
+    <el-row :gutter="20">
+      <div class="list_title">挂架名称：{{ hangerInfo.name }} 首数：{{ hangerInfo.firstNum }} 尾数：{{ hangerInfo.endNum }}</div>
+    </el-row>
+    <el-row :gutter="20">
+      <el-col :span="4">
+        <div class="head-container-one" :style="{ border: '1px solid #ccc' }">
+          <el-tree :data="hangerList" :props="defaultProps" :expand-on-click-node="false" node-key="id" highlight-current
+            @node-click="handleNodeClick"  ref="treeList"/>
+        </div>
+      </el-col>
+      <el-col :span="20">
+        <div class="head-column1" :style="{ border: '1px solid #ddd' }">
+          <el-radio-group v-model="detailId" size="medium" @input="getClothInfo">
+            <el-radio-button v-for="detail in detailList" :key="detail.id" :label="detail.id" border
+              :class="detail.isHangerCount>0 ? 'hasCloth' : 'nocloth'"
+              :style="detail.isHangerCount>0 ?  {'background-color': '#00ff00', 'border': '1px solid #ddd', 'margin-top': '10px', 'margin-left': '10px' } :  { border: '1px solid #ddd', 'margin-top': '10px', 'margin-left': '10px'}">
+              {{ detail.code }}# {{ detail.isHangerCount }} 件 </el-radio-button>
+          </el-radio-group>
+        </div>
+      </el-col>
+    </el-row>
+    <el-row :gutter="20">
+      <el-col :span="24">
+        <div class="head-column2" style="margin-top: 20px">
+          <el-table v-loading="loading" fit highlight-current-row border stripe :data="clothInfoList">
+            <el-table-column label="订单号" align="center" prop="orderNo" />
+            <el-table-column label="客户信息" align="center" width="140">
+              <template slot-scope="scope">
+                <span>{{ scope.row.userName ? scope.row.userName : "--" }}</span>
+                <br />
+                <span>{{ scope.row.phoneNumber ? scope.row.phoneNumber : "" }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="衣物条码" align="center" prop="washCode" />
+            <el-table-column label="衣物名称" align="center" prop="clothName" />
+            <el-table-column label="颜色" align="center" prop="colorName" />
+            <el-table-column label="挂衣号" align="center" prop="hangerCode" />
+            <el-table-column label="状态" align="center" prop="status">
+              <template slot-scope="scope">
+                <dict-tag :options="dict.type.cloth_order_status" :value="scope.row.status" />
+              </template>
+            </el-table-column>
+            <el-table-column label="取衣时间" align="center" prop="takeClothTime" />
+          </el-table>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
 </template>
 
 <script>
 import { getHangerList } from '@/api/cloth/hanger'
 import { getClothOrderInfoByHangerCodeAndId, getIsHangerList } from '@/api/cloth/hangerDetail'
 export default {
-    name: 'goodsPurchase',
-    dicts: ['purchase_order_status', 'purchase_refund_status', 'cloth_order_status'],
-    data() {
-        return {
-            nodeKeyId: null,
-            // 遮罩层
-            loading: false,
-            // 选中数组
-            ids: [],
-            // 非单个禁用
-            single: true,
-            // 非多个禁用
-            multiple: true,
-            // 显示搜索条件
-            showSearch: true,
-            // 总条数
-            total: 0,
-            // 弹出层标题
-            title: '',
-            // 是否显示弹出层
-            open: false,
-            // 查询参数
-            queryParams: {
-                pageNum: 1,
-                pageSize: 9999
-            },
-            // 表单参数
-            form: {},
-            // 表单校验
-            rules: {},
-            goodsType: null,
-            // 商品订单表格数据
-            hangerList: [],
-            currentNodeKey: null,
-            // 分类id
-            goodsCategoryId: null,
-            // 可选商品集合
-            goodsList: null,
-            // 已选商品集合
-            addGoodsList: [],
-            // 左侧分类集合
-            categoryList: null,
-            defaultProps: {
-                label: 'name'
-            },
-            hangerInfo: {},
-            detailList: [],
-            detailId: null,
-            clothInfoList: []
-        }
+  name: 'goodsPurchase',
+  dicts: ['purchase_order_status', 'purchase_refund_status', 'cloth_order_status'],
+  data() {
+    return {
+      nodeKeyId: null,
+      // 遮罩层
+      loading: false,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 弹出层标题
+      title: '',
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 9999
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {},
+      goodsType: null,
+      // 商品订单表格数据
+      hangerList: [],
+      currentNodeKey: null,
+      // 分类id
+      goodsCategoryId: null,
+      // 可选商品集合
+      goodsList: null,
+      // 已选商品集合
+      addGoodsList: [],
+      // 左侧分类集合
+      categoryList: null,
+      defaultProps: {
+        label: 'name'
+      },
+      hangerInfo: {},
+      detailList: [],
+      detailId: null,
+      clothInfoList: []
+    }
+  },
+  created() {
+    this.getList()
+    this.hangerInfo.name = '--'
+    this.hangerInfo.firstNum = '--'
+    this.hangerInfo.endNum = '--'
+  },
+  computed: {},
+  methods: {
+    // 节点单击事件
+    handleNodeClick(data) {
+      this.hangerInfo = data
+      this.getHangerDetail()
+    
     },
-    created() {
-        this.getList()
-        this.hangerInfo.name = '--'
-        this.hangerInfo.firstNum = '--'
-        this.hangerInfo.endNum = '--'
+    getHangerDetail() {
+      getIsHangerList(this.hangerInfo.id).then((response) => {
+        this.detailList = response.data
+      })
     },
-    computed: {},
-    methods: {
-        // 节点单击事件
-        handleNodeClick(data) {
-            this.hangerInfo = data
-            this.getHangerDetail()
-        },
-        getHangerDetail() {
-            getIsHangerList(this.hangerInfo.id).then((response) => {
-                this.detailList = response.data
-            })
-        },
-        getList() {
-            getHangerList(this.queryParams).then((response) => {
-                this.hangerList = response.rows
-            })
-        },
-        getClothInfo() {
-            const vo = this.detailList.find((item) => item.id == this.detailId)
-            getClothOrderInfoByHangerCodeAndId(vo.hangerId, vo.code).then((response) => {
-                this.clothInfoList = response.data
-            })
+    getList() {
+     let _this = this;
+      getHangerList(this.queryParams).then((response) => {
+        _this.hangerList = response.rows
+        if(this.hangerList){
+            this.$nextTick(() => {
+            this.$refs.treeList &&
+                this.$refs.treeList.setCurrentKey(this.hangerList[0].id); //默认选中第一条
+                this.handleNodeClick(this.hangerList[0]); //同时调用树点击事件
+            });
         }
+      })
+    },
+    getClothInfo() {
+      const vo = this.detailList.find((item) => item.id == this.detailId)
+      getClothOrderInfoByHangerCodeAndId(vo.hangerId, vo.code).then((response) => {
+        this.clothInfoList = response.data
+      })
     }
+  }
 }
 </script>
 <style>
+.hasCloth {
+    .el-radio-button__inner {
+        background-color: #81f79f;
+    }
+}
+
 .list_title {
     text-align: left;
     line-height: 40px;

src/views/cloth/hanger/upHanger.vue

@@ -1,236 +1,239 @@
 <template>
-    <div class="app-container">
-        <el-row :gutter="10">
-            <el-col :span="18">
-                <el-card class="box-card custom-card">
-                    <el-row :gutter="10">
-                        <el-col :span="24">
-                            <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
-                                <el-form-item  prop="washCode">
-                                    <el-input v-model="queryParams.washCode" placeholder="请输入衣物条码" clearable @keyup.enter.native="handleQuery" />
-                                </el-form-item>
-                                <el-form-item prop="orderNo">
-                                    <el-input v-model="queryParams.orderNo" placeholder="请输入洗衣单号" clearable @keyup.enter.native="handleQuery" />
-                                </el-form-item>
-                                <el-form-item label="状态" prop="flowStatus">
-                                    <el-radio-group v-model="queryParams.flowStatus">
-                                        <el-radio-button label="3">未上挂</el-radio-button>
-                                        <el-radio-button label="4">已上挂</el-radio-button>
-                                    </el-radio-group>
-                                </el-form-item>
-                                <el-form-item>
-                                    <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
-                                    <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
-                                </el-form-item>
-                            </el-form>
-                        </el-col>
-                    </el-row>
-                    <el-row :gutter="10" class="mb8">
-                        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-                    </el-row>
-                    <el-table v-loading="loading" fit highlight-current-row border stripe :data="clothItemList" style="height: 60%">
-                        <el-table-column label="衣物条码" align="center" prop="washCode" width="220px" />
-                        <el-table-column label="洗衣单号" align="center" prop="orderNo" width="220px" />
-                        <el-table-column label="衣服名称" align="center" prop="clothItemName" width="120px" />
-                        <el-table-column label="类型" align="center" width="80px">
-                            <template slot-scope="scope">
-                                <template v-for="(item, index) in scope.row.orderClothTypes">
-                                    {{ index == 0 ? item.clothTypeName : ',' + item.clothTypeName }}
-                                </template>
-                            </template>
-                        </el-table-column>
-                        <el-table-column label="颜色" align="center" width="80px">
-                            <template slot-scope="scope">
-                                <template v-for="(item, index) in scope.row.orderClothColors">
-                                    {{ index == 0 ? item.clothColorName : ',' + item.clothColorName }}
-                                </template>
-                            </template>
-                        </el-table-column>
-                        <el-table-column label="特殊处理" align="center" width="80px">
-                            <template slot-scope="scope">
-                                <template v-for="(item, index) in scope.row.orderClothCrafts">
-                                    {{ index == 0 ? item.clothCraftName : ',' + item.clothCraftName }}
-                                </template>
-                            </template>
-                        </el-table-column>
-                        <el-table-column label="瑕疵" align="center" width="150px" show-overflow-tooltip>
-                            <template slot-scope="scope">
-                                <span>
-                                    <template v-for="(item, index) in scope.row.orderClothFlaws">
-                                        {{ index == 0 ? item.clothFlawName : ',' + item.clothFlawName }}
-                                    </template>
-                                </span>
-                            </template>
-                        </el-table-column>
-                        <el-table-column label="附件" align="center" width="150px" show-overflow-tooltip>
-                            <template slot-scope="scope">
-                                <span>
-                                    <template v-for="(item, index) in scope.row.orderClothAdjuncts">
-                                        {{ index == 0 ? item.adjunctName + ' * ' + item.num : ',' + item.adjunctName + ' * ' + item.num }}
-                                    </template>
-                                </span>
-                            </template>
-                        </el-table-column>
-                        <el-table-column label="状态" align="center" width="80px">
-                            <template slot-scope="scope">
-                                <el-tag v-if="scope.row.flowStatus == '3'">未上挂</el-tag>
-                                <el-tag v-if="scope.row.flowStatus == '4'">已上挂</el-tag>
-                            </template>
-                        </el-table-column>
-                        <el-table-column label="挂架号" align="center" prop="hangerName" width="150px" show-overflow-tooltip>
-                            <template slot-scope="scope">
-                                <template v-for="item in hangerList">
-                                    {{ scope.row.clothHangerId == item.id ? item.name + '-' + scope.row.clothHangerCode + '#' : '' }}
-                                </template>
-                            </template>
-                        </el-table-column>
-                        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="150">
-                            <template slot-scope="scope">
-                                <el-button type="text" icon="el-icon-share" @click="handleUpdateHanger(scope.row)">分配挂衣号</el-button>
-                            </template>
-                        </el-table-column>
-                    </el-table>
-                    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
-                </el-card>
+  <div class="app-container">
+    <el-row :gutter="10">
+      <el-col :span="18">
+        <el-card class="box-card custom-card">
+          <el-row :gutter="10">
+            <el-col :span="24">
+              <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+                <el-form-item prop="washCode">
+                  <el-input v-model="queryParams.washCode" placeholder="请输入衣物条码" clearable @keyup.enter.native="handleQuery" />
+                </el-form-item>
+                <el-form-item prop="orderNo">
+                  <el-input v-model="queryParams.orderNo" placeholder="请输入洗衣单号" clearable @keyup.enter.native="handleQuery" />
+                </el-form-item>
+                <el-form-item label="状态" prop="flowStatus">
+                  <el-radio-group v-model="queryParams.flowStatus">
+                    <el-radio-button label="3">未上挂</el-radio-button>
+                    <el-radio-button label="4">已上挂</el-radio-button>
+                  </el-radio-group>
+                </el-form-item>
+                <el-form-item>
+                  <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
+                  <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+                </el-form-item>
+              </el-form>
             </el-col>
+          </el-row>
+          <el-row :gutter="10" class="mb8">
+            <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+          </el-row>
+          <el-table v-loading="loading" fit highlight-current-row border stripe :data="clothItemList" style="height: 60%">
+            <el-table-column label="衣物条码" align="center" prop="washCode" width="120px" />
+            <el-table-column label="洗衣单号" align="center" prop="orderNo" width="120px" />
+            <el-table-column label="衣服名称" align="center" prop="clothItemName" >
+              <template slot-scope="scope">
+                <span> {{ calculateClothName(scope.row) }} </span>
+              </template>
+            </el-table-column>
 
-            <el-col :span="6">
-                <el-card class="box-card custom-card">
-                    <el-form :model="queryParams2" ref="queryForm2" size="small" :inline="true" label-width="68px">
-                        <el-form-item label="衣物条码" prop="washCode">
-                            <el-input v-model="queryParams2.washCode" placeholder="请输入衣物条码" clearable />
-                        </el-form-item>
-                        <el-form-item>
-                            <el-button type="primary" @click="getOrderClothItemInfo">查询</el-button>
-                        </el-form-item>
-                    </el-form>
-                    <el-descriptions title="衣物信息" v-if="clothItemInfo" :column="1">
-                        <el-descriptions-item label="衣物条码">{{ clothItemInfo.washCode }}</el-descriptions-item>
-                        <el-descriptions-item label="洗衣单号">{{ clothItemInfo.orderNo }}</el-descriptions-item>
-                        <el-descriptions-item label="衣物名称">{{ clothItemInfo.clothItemName }}</el-descriptions-item>
-                        <el-descriptions-item label="颜色">
-                            <template>
-                                <template v-for="(item, index) in clothItemInfo.orderClothColors">
-                                    {{ index == 0 ? item.clothColorName : ',' + item.clothColorName }}
-                                </template>
-                            </template>
-                        </el-descriptions-item>
-                        <el-descriptions-item label="瑕疵">
-                            <template>
-                                <template v-for="(item, index) in clothItemInfo.orderClothFlaws">
-                                    {{ index == 0 ? item.clothFlawName : ',' + item.clothFlawName }}
-                                </template>
-                            </template>
-                        </el-descriptions-item>
-                        <el-descriptions-item label="特殊处理">
-                            <template>
-                                <template v-for="(item, index) in clothItemInfo.orderClothCrafts">
-                                    {{ index == 0 ? item.clothCraftName : ',' + item.clothCraftName }}
-                                </template>
-                            </template>
-                        </el-descriptions-item>
-                        <el-descriptions-item label="附件">
-                            <template>
-                                <template v-for="(item, index) in clothItemInfo.orderClothAdjuncts">
-                                    {{ index == 0 ? item.adjunctName + ' * ' + item.num : ',' + item.adjunctName + ' * ' + item.num }}
-                                </template>
-                            </template>
-                        </el-descriptions-item>
-                        <!--            <el-descriptions-item label="预计收衣">{{}}</el-descriptions-item>-->
-                        <el-descriptions-item label="衣服状态">
-                            <template>
-                                <span v-if="clothItemInfo.flowStatus == '3'">未上挂</span>
-                                <span v-if="clothItemInfo.flowStatus == '4'">已上挂</span>
-                            </template>
-                        </el-descriptions-item>
-                        <el-descriptions-item label="挂衣号">
-                            <template v-for="item in hangerList">
-                                {{ clothItemInfo.clothHangerId == item.id ? item.name + '-' + clothItemInfo.clothHangerCode + '#' : '' }}
-                            </template>
-                        </el-descriptions-item>
-                    </el-descriptions>
-                    <div style="margin-top: 20px">
-                        <el-button type="primary" @click="reFlow(clothItemInfo)" v-if="clothItemInfo">重洗</el-button>
-                        <el-button type="primary" @click="handleUpdateHanger(clothItemInfo)" v-if="clothItemInfo">重新分配挂衣号</el-button>
-                    </div>
-                </el-card>
-            </el-col>
-        </el-row>
+            <el-table-column label="颜色" align="center" width="150">
+              <template slot-scope="scope">
+                <span v-for="(item, index) in scope.row.orderClothColors">
+                  {{ index == 0 ? item.clothColorName : ',' + item.clothColorName }}
+                </span>
+              </template>
+            </el-table-column>
+            <el-table-column label="瑕疵" align="center" width="150">
+              <template slot-scope="scope">
+                <span v-for="(item, index) in scope.row.orderClothFlaws">
+                  {{ index == 0 ? item.clothFlawName : ',' + item.clothFlawName }}
+                </span>
+                <el-tag v-if="!scope.row.orderClothFlaws">暂无</el-tag>
+              </template>
+            </el-table-column>
+            <el-table-column label="特殊处理" align="center" width="150">
+              <template slot-scope="scope">
+                <el-tag v-if="scope.row.orderClothCrafts" size="small" v-for="item in scope.row.orderClothCrafts"
+                  style="margin-right: 10px; margin-bottom: 2.5px; margin-top: 2.5px">
+                  {{ item.clothCraftName }}
+                </el-tag>
+                <el-tag v-if="!scope.row.orderClothCrafts">暂无</el-tag>
+              </template>
+            </el-table-column>
+
+            <el-table-column label="附件" align="center">
+              <template slot-scope="scope">
+                <el-tag size="small" v-for="item in scope.row.orderClothAdjuncts" style="margin-right: 10px; margin-bottom: 2.5px; margin-top: 2.5px">
+                  {{ item.adjunctName + '*' + item.num }}
+                </el-tag>
+                <el-tag v-if="!scope.row.orderClothAdjuncts">暂无</el-tag>
+              </template>
+            </el-table-column>
+            <el-table-column label="状态" align="center" width="80px">
+              <template slot-scope="scope">
+                <el-tag v-if="scope.row.flowStatus == '3'">未上挂</el-tag>
+                <el-tag v-if="scope.row.flowStatus == '4'">已上挂</el-tag>
+              </template>
+            </el-table-column>
+            <el-table-column label="挂架号" align="center" prop="hangerName" width="150px" show-overflow-tooltip>
+              <template slot-scope="scope">
+                <template v-for="item in hangerList">
+                  {{ scope.row.clothHangerId == item.id ? item.name + '-' + scope.row.clothHangerCode + '#' : '' }}
+                </template>
+                <el-tag v-if="!hangerList">暂无</el-tag>
+              </template>
+            </el-table-column>
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="150">
+              <template slot-scope="scope">
+                <el-button type="text" icon="el-icon-share" @click="handleUpdateHanger(scope.row)">分配挂衣号</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+          <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
+        </el-card>
+      </el-col>
+
+      <el-col :span="6">
+        <el-card class="box-card custom-card">
+          <el-form :model="queryParams2" ref="queryForm2" size="small" :inline="true" label-width="68px">
+            <el-form-item label="衣物条码" prop="washCode">
+              <el-input v-model="queryParams2.washCode" placeholder="请输入衣物条码" clearable />
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="getOrderClothItemInfo">查询</el-button>
+            </el-form-item>
+          </el-form>
+          <el-descriptions title="衣物信息" v-if="clothItemInfo" :column="1">
+            <el-descriptions-item label="衣物条码">{{ clothItemInfo.washCode }}</el-descriptions-item>
+            <el-descriptions-item label="洗衣单号">{{ clothItemInfo.orderNo }}</el-descriptions-item>
+            <el-descriptions-item label="衣物名称">{{ clothItemInfo.clothItemName }}</el-descriptions-item>
+            <el-descriptions-item label="颜色">
+              <template>
+                <template v-for="(item, index) in clothItemInfo.orderClothColors">
+                  {{ index == 0 ? item.clothColorName : ',' + item.clothColorName }}
+                </template>
+              </template>
+            </el-descriptions-item>
+            <el-descriptions-item label="瑕疵">
+              <template>
+                <template v-for="(item, index) in clothItemInfo.orderClothFlaws">
+                  {{ index == 0 ? item.clothFlawName : ',' + item.clothFlawName }}
+                </template>
+              </template>
+            </el-descriptions-item>
+            <el-descriptions-item label="特殊处理">
+              <template>
+                <template v-for="(item, index) in clothItemInfo.orderClothCrafts">
+                  {{ index == 0 ? item.clothCraftName : ',' + item.clothCraftName }}
+                </template>
+              </template>
+            </el-descriptions-item>
+            <el-descriptions-item label="附件">
+              <template>
+                <template v-for="(item, index) in clothItemInfo.orderClothAdjuncts">
+                  {{ index == 0 ? item.adjunctName + ' * ' + item.num : ',' + item.adjunctName + ' * ' + item.num }}
+                </template>
+              </template>
+            </el-descriptions-item>
+            <!--            <el-descriptions-item label="预计收衣">{{}}</el-descriptions-item>-->
+            <el-descriptions-item label="衣服状态">
+              <template>
+                <span v-if="clothItemInfo.flowStatus == '3'">未上挂</span>
+                <span v-if="clothItemInfo.flowStatus == '4'">已上挂</span>
+              </template>
+            </el-descriptions-item>
+            <el-descriptions-item label="挂衣号">
+              <template v-for="item in hangerList">
+                {{ clothItemInfo.clothHangerId == item.id ? item.name + '-' + clothItemInfo.clothHangerCode + '#' : '' }}
+              </template>
+            </el-descriptions-item>
+          </el-descriptions>
+          <div style="margin-top: 20px">
+            <el-button type="primary" @click="reFlow(clothItemInfo)" v-if="clothItemInfo">重洗</el-button>
+            <el-button type="primary" @click="handleUpdateHanger(clothItemInfo)" v-if="clothItemInfo">重新分配挂衣号</el-button>
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
 
-        <!-- 选择上挂位置页面 -->
-        <el-dialog :title="title" :visible.sync="open" size="70%">
-            <div style="margin-left: 5%; margin-top: 1%; margin-right: 5%">
-                <el-row :gutter="20">
-                    <el-descriptions title="衣物信息" v-if="clothItemInfoWithIn" :column="2">
-                        <el-descriptions-item label="衣物条码">{{ clothItemInfoWithIn.washCode }}</el-descriptions-item>
-                        <el-descriptions-item label="洗衣单号">{{ clothItemInfoWithIn.orderNo }}</el-descriptions-item>
-                        <el-descriptions-item label="衣物名称">{{ clothItemInfoWithIn.clothItemName }}</el-descriptions-item>
-                        <el-descriptions-item label="颜色">
-                            <template>
-                                <template v-for="(item, index) in clothItemInfoWithIn.orderClothColors">
-                                    {{ index == 0 ? item.clothColorName : ',' + item.clothColorName }}
-                                </template>
-                            </template>
-                        </el-descriptions-item>
-                        <el-descriptions-item label="瑕疵">
-                            <template>
-                                <template v-for="(item, index) in clothItemInfoWithIn.orderClothFlaws">
-                                    {{ index == 0 ? item.clothFlawName : ',' + item.clothFlawName }}
-                                </template>
-                            </template>
-                        </el-descriptions-item>
-                        <el-descriptions-item label="特殊处理">
-                            <template>
-                                <template v-for="(item, index) in clothItemInfoWithIn.orderClothCrafts">
-                                    {{ index == 0 ? item.clothCraftName : ',' + item.clothCraftName }}
-                                </template>
-                            </template>
-                        </el-descriptions-item>
-                        <el-descriptions-item label="附件">
-                            <template>
-                                <template v-for="(item, index) in clothItemInfoWithIn.orderClothAdjuncts">
-                                    {{ index == 0 ? item.adjunctName + ' * ' + item.num : ',' + item.adjunctName + ' * ' + item.num }}
-                                </template>
-                            </template>
-                        </el-descriptions-item>
-                        <!--            <el-descriptions-item label="预计收衣">{{}}</el-descriptions-item>-->
-                        <el-descriptions-item label="衣服状态">
-                            <template>
-                                <span v-if="clothItemInfoWithIn.flowStatus == '3'">未上挂</span>
-                                <span v-if="clothItemInfoWithIn.flowStatus == '4'">已上挂</span>
-                            </template>
-                        </el-descriptions-item>
-                        <el-descriptions-item label="挂衣号">
-                            <template v-for="item in hangerList">
-                                {{ clothItemInfoWithIn.clothHangerId == item.id ? item.name + '-' + clothItemInfoWithIn.clothHangerCode + '#' : '' }}
-                            </template>
-                        </el-descriptions-item>
-                    </el-descriptions>
-                </el-row>
-                <el-row :gutter="20" style="margin-top: 20px">
-                    <el-col :span="5">
-                        <div class="head-upHanger-one" :style="{ border: '1px solid #ccc' }">
-                            <el-table :data="hangerList" ref="singleTable" :header-cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }" highlight-current-row @current-change="handleNodeClick">
-                                <<el-table-column property="name" label="挂架名称" style="width: 100%; text-align: center" />
-                            </el-table>
-                        </div>
-                    </el-col>
-                    <el-col :span="19">
-                        <div class="head-upHanger-two" :style="{ border: '1px solid #ddd' }">
-                            <el-radio-group v-model="detailId" size="medium">
-                                <el-radio-button v-for="detail in detailList" :key="detail.id" :label="detail.id" border style="margin-top: 10px; margin-left: 10px" :style="{ border: '1px solid #ddd' }">{{ detail.code }}# {{ detail.isHangerCount }} 件 </el-radio-button>
-                            </el-radio-group>
-                        </div>
-                    </el-col>
-                </el-row>
-                <el-row>
-                    <el-col :span="3">
-                        <el-button type="primary" style="width: 50%; height: 40px; margin-top: 30px; text-align: center" size="small" @click="submitForm">提交</el-button>
-                    </el-col>
-                </el-row>
+    <!-- 选择上挂位置页面 -->
+    <el-dialog :title="title" :visible.sync="open" size="70%">
+      <div style="margin-left: 5%; margin-top: 1%; margin-right: 5%">
+        <el-row :gutter="20">
+          <el-descriptions title="衣物信息" v-if="clothItemInfoWithIn" :column="2">
+            <el-descriptions-item label="衣物条码">{{ clothItemInfoWithIn.washCode }}</el-descriptions-item>
+            <el-descriptions-item label="洗衣单号">{{ clothItemInfoWithIn.orderNo }}</el-descriptions-item>
+            <el-descriptions-item label="衣物名称">{{ clothItemInfoWithIn.clothItemName }}</el-descriptions-item>
+            <el-descriptions-item label="颜色">
+              <template>
+                <template v-for="(item, index) in clothItemInfoWithIn.orderClothColors">
+                  {{ index == 0 ? item.clothColorName : ',' + item.clothColorName }}
+                </template>
+              </template>
+            </el-descriptions-item>
+            <el-descriptions-item label="瑕疵">
+              <template>
+                <template v-for="(item, index) in clothItemInfoWithIn.orderClothFlaws">
+                  {{ index == 0 ? item.clothFlawName : ',' + item.clothFlawName }}
+                </template>
+              </template>
+            </el-descriptions-item>
+            <el-descriptions-item label="特殊处理">
+              <template>
+                <template v-for="(item, index) in clothItemInfoWithIn.orderClothCrafts">
+                  {{ index == 0 ? item.clothCraftName : ',' + item.clothCraftName }}
+                </template>
+              </template>
+            </el-descriptions-item>
+            <el-descriptions-item label="附件">
+              <template>
+                <template v-for="(item, index) in clothItemInfoWithIn.orderClothAdjuncts">
+                  {{ index == 0 ? item.adjunctName + ' * ' + item.num : ',' + item.adjunctName + ' * ' + item.num }}
+                </template>
+              </template>
+            </el-descriptions-item>
+            <!--            <el-descriptions-item label="预计收衣">{{}}</el-descriptions-item>-->
+            <el-descriptions-item label="衣服状态">
+              <template>
+                <span v-if="clothItemInfoWithIn.flowStatus == '3'">未上挂</span>
+                <span v-if="clothItemInfoWithIn.flowStatus == '4'">已上挂</span>
+              </template>
+            </el-descriptions-item>
+            <el-descriptions-item label="挂衣号">
+              <template v-for="item in hangerList">
+                {{ clothItemInfoWithIn.clothHangerId == item.id ? item.name + '-' + clothItemInfoWithIn.clothHangerCode + '#' : '' }}
+              </template>
+            </el-descriptions-item>
+          </el-descriptions>
+        </el-row>
+        <el-row :gutter="20" style="margin-top: 20px">
+          <el-col :span="5">
+            <div class="head-upHanger-one" :style="{ border: '1px solid #ccc' }">
+              <el-table :data="hangerList" ref="singleTable" :header-cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }"
+                highlight-current-row @current-change="handleNodeClick">
+                <<el-table-column property="name" label="挂架名称" style="width: 100%; text-align: center" />
+              </el-table>
+            </div>
+          </el-col>
+          <el-col :span="19">
+            <div class="head-upHanger-two" :style="{ border: '1px solid #ddd' }">
+              <el-radio-group v-model="detailId" size="medium">
+                <el-radio-button v-for="detail in detailList" :key="detail.id" :label="detail.id" border style="margin-top: 10px; margin-left: 10px"
+                  :style="{ border: '1px solid #ddd' }">{{ detail.code }}# {{ detail.isHangerCount }} 件 </el-radio-button>
+              </el-radio-group>
             </div>
-        </el-dialog>
-    </div>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="3">
+            <el-button type="primary" style="width: 50%; height: 40px; margin-top: 30px; text-align: center" size="small" @click="submitForm">提交
+            </el-button>
+          </el-col>
+        </el-row>
+      </div>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
@@ -239,205 +242,214 @@ import { getHangerList } from '@/api/cloth/hanger'
 import { getHangerInfoByHangerCodeAndId, getIsHangerList, upHanger } from '@/api/cloth/hangerDetail'
 
 export default {
-    name: 'upHanger',
-    data() {
-        return {
-            // 遮罩层
-            loading: true,
-            // 选中数组
-            ids: [],
-            // 非单个禁用
-            single: true,
-            // 非多个禁用
-            multiple: true,
-            // 显示搜索条件
-            showSearch: true,
-            // 总条数
-            total: 0,
-            // 衣服表格数据
-            clothItemList: [],
-            // 弹出层标题
-            title: '',
-            // 是否显示弹出层
-            open: false,
-            // 查询参数
-            queryParams: {
-                pageNum: 1,
-                pageSize: 10,
-                washCode: null,
-                orderNo: null,
-                flowStatus: ''
-            },
-            queryParams2: {
-                pageNum: 1,
-                pageSize: 10,
-                washCode: null
-            },
-            // 表单参数
-            form: {},
-            // 表单校验
-            rules: {},
-            // 右侧衣服信息vo
-            clothItemInfo: null,
-            // 上挂页面衣服信息vo
-            clothItemInfoWithIn: null,
-            hangerList: [],
-            detailList: [],
-            detailInfo: null,
-            detailId: null,
-            clothItemId: null,
-            hangerName: null,
-            currentRow: null
-        }
-    },
-    created() {
-        this.getHangerList()
-        this.getList()
+  name: 'upHanger',
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 衣服表格数据
+      clothItemList: [],
+      // 弹出层标题
+      title: '',
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        washCode: null,
+        orderNo: null,
+        flowStatus: ''
+      },
+      queryParams2: {
+        pageNum: 1,
+        pageSize: 10,
+        washCode: null
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {},
+      // 右侧衣服信息vo
+      clothItemInfo: null,
+      // 上挂页面衣服信息vo
+      clothItemInfoWithIn: null,
+      hangerList: [],
+      detailList: [],
+      detailInfo: null,
+      detailId: null,
+      clothItemId: null,
+      hangerName: null,
+      currentRow: null
+    }
+  },
+  created() {
+    this.getHangerList()
+    this.getList()
+  },
+  methods: {
+    calculateClothName(row) {
+      var clothName = row.clothItemName
+      if (row.orderClothTypes) {
+        row.orderClothTypes.forEach((item) => {
+          clothName += ' 【' + item.clothTypeName + '】'
+        })
+      }
+      return clothName
     },
-    methods: {
-        reFlow(row) {
-            this.$confirm('是否确认将该衣物重洗？')
-                .then(() => {
-                    reFlowCloth(row.id).then((response) => {
-                        this.$message.success('操作成功')
-                        this.clothItemInfo = null
-                        this.getList()
-                    })
-                })
-                .catch(() => {})
-        },
-        // 单击事件
-        handleNodeClick(data) {
-            this.hangerInfo = data
-            this.getHangerDetail()
-        },
-        getHangerDetail() {
-            getIsHangerList(this.hangerInfo.id).then((response) => {
-                this.detailList = response.data
-            })
-        },
-        getHangerList() {
-            getHangerList({ pageNum: 1, pageSize: 999 }).then((response) => {
-                this.hangerList = response.rows
-            })
-        },
-        /** 查询衣服列表 */
-        getList() {
-            this.loading = true
-            getOrderClothItemListByUpHanger(this.queryParams).then((response) => {
-                this.clothItemList = response.data.records
-                this.total = response.data.total
-                this.loading = false
-            })
-        },
-        getOrderClothItemInfo() {
-            if (this.queryParams2.washCode == null) {
-                this.$message.error('条码不能为空')
-            }
-            getOrderClothItemListByUpHanger(this.queryParams2).then((response) => {
-                this.clothItemInfo = response.data.records[0]
-                this.total = response.data.total
-                this.loading = false
-            })
-        },
-        // 取消按钮
-        cancel() {
-            this.open = false
-            this.reset()
-        },
-        // 表单重置
-        reset() {
-            this.form = {}
-            this.resetForm('form')
-        },
-        /** 搜索按钮操作 */
-        handleQuery() {
-            this.queryParams.pageNum = 1
+    reFlow(row) {
+      this.$confirm('是否确认将该衣物重洗？')
+        .then(() => {
+          reFlowCloth(row.id).then((response) => {
+            this.$message.success('操作成功')
+            this.clothItemInfo = null
             this.getList()
-        },
-        /** 重置按钮操作 */
-        resetQuery() {
-            this.resetForm('queryForm')
-            this.handleQuery()
-        },
-        /** 修改按钮操作 */
-        handleUpdateHanger(row) {
-            this.clothItemInfoWithIn = row
-            if (this.hangerList.length == 0) {
-                this.clothItemId = row.id
-                this.open = true
-                this.title = '分配挂衣号'
-            } else {
-                // 判断是否已上挂   未上挂
-                if (this.clothItemInfoWithIn.clothHangerCode == null || this.clothItemInfoWithIn.clothHangerCode == '') {
-                    const hangerVO = this.hangerList[0]
-                    getIsHangerList(hangerVO.id).then((response) => {
-                        this.detailList = response.data
-                        this.clothItemId = row.id
-                        this.detailId = null
-                        this.open = true
-                        this.title = '分配挂衣号'
-                        var _this = this
-                        setTimeout(function () {
-                            console.log(this)
-                            console.log(_this)
-                            _this.$refs.singleTable.setCurrentRow(hangerVO)
-                        }, 300)
-                    })
-                } else {
-                    // 已上挂
-                    const vo = this.hangerList.find((item) => item.id == this.clothItemInfoWithIn.clothHangerId)
+          })
+        })
+        .catch(() => { })
+    },
+    // 单击事件
+    handleNodeClick(data) {
+      this.hangerInfo = data
+      this.getHangerDetail()
+    },
+    getHangerDetail() {
+      getIsHangerList(this.hangerInfo.id).then((response) => {
+        this.detailList = response.data
+      })
+    },
+    getHangerList() {
+      getHangerList({ pageNum: 1, pageSize: 999 }).then((response) => {
+        this.hangerList = response.rows
+      })
+    },
+    /** 查询衣服列表 */
+    getList() {
+      this.loading = true
+      getOrderClothItemListByUpHanger(this.queryParams).then((response) => {
+        this.clothItemList = response.data.records
+        this.total = response.data.total
+        this.loading = false
+      })
+    },
+    getOrderClothItemInfo() {
+      if (this.queryParams2.washCode == null) {
+        this.$message.error('条码不能为空')
+      }
+      getOrderClothItemListByUpHanger(this.queryParams2).then((response) => {
+        this.clothItemInfo = response.data.records[0]
+        this.total = response.data.total
+        this.loading = false
+      })
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false
+      this.reset()
+    },
+    // 表单重置
+    reset() {
+      this.form = {}
+      this.resetForm('form')
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1
+      this.getList()
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm('queryForm')
+      this.handleQuery()
+    },
+    /** 修改按钮操作 */
+    handleUpdateHanger(row) {
+      this.clothItemInfoWithIn = row
+      if (this.hangerList.length == 0) {
+        this.clothItemId = row.id
+        this.open = true
+        this.title = '分配挂衣号'
+      } else {
+        // 判断是否已上挂   未上挂
+        if (this.clothItemInfoWithIn.clothHangerCode == null || this.clothItemInfoWithIn.clothHangerCode == '') {
+          const hangerVO = this.hangerList[0]
+          getIsHangerList(hangerVO.id).then((response) => {
+            this.detailList = response.data
+            this.clothItemId = row.id
+            this.detailId = null
+            this.open = true
+            this.title = '分配挂衣号'
+            var _this = this
+            setTimeout(function () {
+              console.log(this)
+              console.log(_this)
+              _this.$refs.singleTable.setCurrentRow(hangerVO)
+            }, 300)
+          })
+        } else {
+          // 已上挂
+          const vo = this.hangerList.find((item) => item.id == this.clothItemInfoWithIn.clothHangerId)
 
-                    getHangerInfoByHangerCodeAndId(this.clothItemInfoWithIn.clothHangerId, this.clothItemInfoWithIn.clothHangerCode).then((response) => {
-                        this.detailInfo = response.data
-                        this.detailId = this.detailInfo.id
-                        this.clothItemId = row.id
-                        this.open = true
-                        this.title = '分配挂衣号'
-                        var _this = this
-                        setTimeout(function () {
-                            _this.$refs.singleTable.setCurrentRow(vo)
-                        }, 300)
-                    })
-                }
-            }
-        },
-        /** 提交按钮 */
-        submitForm() {
-            if (this.detailId == null) {
-                this.$message.error('挂衣位置不能为空')
-            }
-            const vo = this.detailList.find((item) => item.id == this.detailId)
-            upHanger(this.clothItemId, vo.hangerId, vo.code).then((response) => {
-                this.$modal.msgSuccess('上挂成功')
-                this.open = false
-                this.getList()
-                this.clothItemId = null
-                this.clothItemInfo = null
-            })
-        },
-        checkClose(done) {
-            this.$confirm('是否关闭表单，关闭后数据将丢失？')
-                .then(function () {
-                    done()
-                })
-                .then(() => {})
-                .catch(() => {})
-        },
-        handleStatusChange(row) {
-            let text = row.status === '0' ? '启用' : '停用'
-            this.$confirm('确认要' + text + ' ' + row.name + ' 吗？')
-                .then(function () {
-                    return updateClothItemStatus(row.id, row.status)
-                })
-                .then(() => {
-                    this.$modal.msgSuccess(text + '成功')
-                })
-                .catch(function () {
-                    row.status = row.status === '0' ? '1' : '0'
-                })
+          getHangerInfoByHangerCodeAndId(this.clothItemInfoWithIn.clothHangerId, this.clothItemInfoWithIn.clothHangerCode).then((response) => {
+            this.detailInfo = response.data
+            this.detailId = this.detailInfo.id
+            this.clothItemId = row.id
+            this.open = true
+            this.title = '分配挂衣号'
+            var _this = this
+            setTimeout(function () {
+              _this.$refs.singleTable.setCurrentRow(vo)
+            }, 300)
+          })
         }
+      }
+    },
+    /** 提交按钮 */
+    submitForm() {
+      if (this.detailId == null) {
+        this.$message.error('挂衣位置不能为空')
+      }
+      const vo = this.detailList.find((item) => item.id == this.detailId)
+      upHanger(this.clothItemId, vo.hangerId, vo.code).then((response) => {
+        this.$modal.msgSuccess('上挂成功')
+        this.open = false
+        this.getList()
+        this.clothItemId = null
+        this.clothItemInfo = null
+      })
+    },
+    checkClose(done) {
+      this.$confirm('是否关闭表单，关闭后数据将丢失？')
+        .then(function () {
+          done()
+        })
+        .then(() => { })
+        .catch(() => { })
+    },
+    handleStatusChange(row) {
+      let text = row.status === '0' ? '启用' : '停用'
+      this.$confirm('确认要' + text + ' ' + row.name + ' 吗？')
+        .then(function () {
+          return updateClothItemStatus(row.id, row.status)
+        })
+        .then(() => {
+          this.$modal.msgSuccess(text + '成功')
+        })
+        .catch(function () {
+          row.status = row.status === '0' ? '1' : '0'
+        })
     }
+  }
 }
 </script>
 <style>

src/views/order/cloth/orderList.vue

@@ -58,14 +58,11 @@
           <span v-if="scope.row.payType == '3'">支付方式：余额</span>
         </template>
       </el-table-column>
-      <el-table-column label="客户信息" align="center" width="200">
+      <el-table-column label="客户信息" align="center" width="140">
         <template slot-scope="scope">
-          <!-- <span v-if="scope.row.orderSource == 'OFFLINE'">订单来源：线下</span>
-                    <span v-else>订单来源：线上</span>
-                    <br /> -->
-          <span>{{ scope.row.appUserName ? scope.row.appUserName : "--" }}- </span>
+          <span>{{ scope.row.appUserName ? scope.row.appUserName : "--" }}</span>
+          <br/>
           <span>{{ scope.row.appUserPhoneNumber ? scope.row.appUserPhoneNumber : "" }}</span>
-
         </template>
       </el-table-column>
       <el-table-column label="订单时间" align="center" prop="createTime" min-width="200" />

src/views/order/cloth/searchCloth.vue

@@ -1,193 +1,214 @@
 <template>
-    <div class="app-container">
-        <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
-            <el-form-item  prop="flowStatus">
-                <el-select v-model="queryParams.flowStatus" placeholder="请选择衣服状态" clearable>
-                    <el-option key="0" label="清洗中" value="0" />
-                    <el-option key="1" label="已上挂" value="1" />
-                    <el-option key="2" label="已取衣" value="2" />
-                </el-select>
-            </el-form-item>
-            <el-form-item>
-                <el-date-picker v-model="createTimeRange" style="width: 240px" value-format="yyyy-MM-dd" type="daterange" range-separator="-" start-placeholder="下单日期" end-placeholder="结束日期"></el-date-picker>
-            </el-form-item>
-            <el-form-item  prop="washCode">
-                <el-input v-model="queryParams.washCode" placeholder="请输入衣服条码" clearable @keyup.enter.native="handleQuery" />
-            </el-form-item>
-            <el-form-item  prop="clothItemName">
-                <el-input v-model="queryParams.clothItemName" placeholder="请输入衣服名称" clearable @keyup.enter.native="handleQuery" />
-            </el-form-item>
-            <el-form-item >
-                <el-date-picker v-model="takeClothTimeRange" style="width: 240px" value-format="yyyy-MM-dd" type="daterange" range-separator="-" start-placeholder="取衣日期" end-placeholder="结束日期"></el-date-picker>
-            </el-form-item>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item prop="flowStatus">
+        <el-select v-model="queryParams.flowStatus" placeholder="请选择衣服状态" clearable>
+          <el-option key="0" label="清洗中" value="0" />
+          <el-option key="1" label="已上挂" value="1" />
+          <el-option key="2" label="已取衣" value="2" />
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-date-picker v-model="createTimeRange" style="width: 240px" value-format="yyyy-MM-dd" type="daterange" range-separator="-"
+          start-placeholder="下单日期" end-placeholder="结束日期"></el-date-picker>
+      </el-form-item>
+      <el-form-item prop="washCode">
+        <el-input v-model="queryParams.washCode" placeholder="请输入衣服条码" clearable @keyup.enter.native="handleQuery" />
+      </el-form-item>
+      <el-form-item prop="clothItemName">
+        <el-input v-model="queryParams.clothItemName" placeholder="请输入衣服名称" clearable @keyup.enter.native="handleQuery" />
+      </el-form-item>
+      <el-form-item>
+        <el-date-picker v-model="takeClothTimeRange" style="width: 240px" value-format="yyyy-MM-dd" type="daterange" range-separator="-"
+          start-placeholder="取衣日期" end-placeholder="结束日期"></el-date-picker>
+      </el-form-item>
 
-            <el-form-item prop="appUserPhoneNumber">
-                <el-input v-model="queryParams.appUserPhoneNumber" placeholder="请输入客户电话" clearable @keyup.enter.native="handleQuery" />
-            </el-form-item>
-            <el-form-item  prop="clothHangerId">
-                <el-input v-model="queryParams.clothHangerId" placeholder="请输入挂衣号" clearable @keyup.enter.native="handleQuery" />
-            </el-form-item>
+      <el-form-item prop="appUserPhoneNumber">
+        <el-input v-model="queryParams.appUserPhoneNumber" placeholder="请输入客户电话" clearable @keyup.enter.native="handleQuery" />
+      </el-form-item>
+      <el-form-item prop="clothHangerId">
+        <el-input v-model="queryParams.clothHangerId" placeholder="请输入挂衣号" clearable @keyup.enter.native="handleQuery" />
+      </el-form-item>
 
-            <el-form-item>
-                <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
-                <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
-            </el-form-item>
-        </el-form>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
 
-        <el-row :gutter="10" class="mb8">
-            <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-        </el-row>
+    <el-row :gutter="10" class="mb8">
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
 
-        <el-table v-loading="loading" fit highlight-current-row border stripe :data="clothItemList" @selection-change="handleSelectionChange">
-            <el-table-column label="订单编号" align="center" prop="orderNo" min-width="200" fixed="left" />
-            <el-table-column label="衣物条码" align="center" prop="washCode" width="200" />
-            <el-table-column label="衣服名称" align="center" prop="clothItemName" width="200" />
-            <el-table-column label="颜色" align="center" width="200">
-                <template slot-scope="scope">
-                    <template v-for="(item, index) in scope.row.orderClothColors">
-                        {{ index == 0 ? item.clothColorName : ',' + item.clothColorName }}
-                    </template>
-                </template>
-            </el-table-column>
-            <el-table-column label="挂衣号" align="center" width="200">
-                <template slot-scope="scope">
-                    <span v-if="scope.row.clothHanger">
-                        {{ scope.row.clothHanger.name + '#' + scope.row.clothHangerCode }}
-                    </span>
-                </template>
-            </el-table-column>
-            <el-table-column label="状态" align="center" prop="flowStatus" width="80">
-                <template slot-scope="scope">
-                    <dict-tag :options="dict.type.order_cloth_flow_status" :value="scope.row.flowStatus" />
-                </template>
-            </el-table-column>
-            <el-table-column label="下单时间" align="center" prop="createTime" min-width="200" />
-            <el-table-column label="取衣时间" align="center" prop="sendClothTime" min-width="200" />
-            <el-table-column label="客户姓名" align="center" prop="appUserName" width="150" />
-            <el-table-column label="客户手机号" align="center" prop="appUserPhoneNumber" width="150" />
+    <Page uri="/mapi/order/clothItem/list" :request-params="queryParams" ref="pagination">
+      <el-table-column label="订单编号" align="center" prop="orderNo" min-width="100" fixed="left" />
+      <el-table-column label="衣物条码" align="center" prop="washCode"  />
+      <el-table-column label="衣服名称" align="center" prop="clothItemName"/>
+      <el-table-column label="客户信息" align="center" prop="appUserName" width="150">
+        <template slot-scope="scope">
+          <span>{{ scope.row.appUserName ? scope.row.appUserName : "--" }} </span>
+          <br />
+          <span>{{ scope.row.appUserPhoneNumber ? scope.row.appUserPhoneNumber : "" }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="颜色" align="center" width="200">
+        <template slot-scope="scope">
+          <template v-for="(item, index) in scope.row.orderClothColors">
+            {{ index == 0 ? item.clothColorName : ',' + item.clothColorName }}
+          </template>
+        </template>
+      </el-table-column>
+      <el-table-column label="挂衣号" align="center" width="200">
+        <template slot-scope="scope">
+          <span v-if="scope.row.clothHanger">
+            {{ scope.row.clothHanger.name + '#' + scope.row.clothHangerCode }}
+          </span>
+          <span v-else>暂无</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="状态" align="center" prop="flowStatus" width="80">
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.order_cloth_flow_status" :value="scope.row.flowStatus" />
+        </template>
+      </el-table-column>
+      <el-table-column label="下单时间" align="center" prop="createTime" />
+      <el-table-column label="取衣时间" align="center" prop="sendClothTime" >
+        <template slot-scope="scope">
+          <span v-if="scope.row.sendClothTime">
+            {{ scope.row.clothHanger.sendClothTime}}
+          </span>
+          <span v-else>--</span>
+        </template>
 
-            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="150">
-                <template slot-scope="scope">
-                    <el-button type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">详情</el-button>
-                    <el-button type="text" icon="el-icon-camera" @click="handphotograph(scope.row)">拍照</el-button>
-                    <el-button type="text" icon="el-icon-printer" v-if="userInfoVO.userType != '00'" @click="btn_pointer_label(scope.row)">标签打印</el-button>
-                </template>
-            </el-table-column>
-        </el-table>
-
-        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
+      </el-table-column>
 
-        <!-- 添加或修改洗衣订单衣服明细对话框 -->
-        <el-dialog :title="title" :visible.sync="open" size="50%" append-to-body>
-            <el-row :gutter="15" style="margin-bottom: 80px; margin-left: 20px; width: calc(100% - 20px)">
-                <el-col :span="24">
-                    <el-descriptions class="margin-top" :column="2" border>
-                        <el-descriptions-item>
-                            <template slot="label"> 衣物条码 </template>
-                            {{ form.washCode }}
-                        </el-descriptions-item>
-                        <el-descriptions-item>
-                            <template slot="label"> 洗衣单号 </template>
-                            {{ form.orderNo }}
-                        </el-descriptions-item>
-                        <el-descriptions-item>
-                            <template slot="label"> 衣服名称 </template>
-                            {{ form.clothItemName }}
-                        </el-descriptions-item>
-                        <el-descriptions-item>
-                            <template slot="label"> 颜色 </template>
-                            <el-tag size="small" v-for="(item, index) in form.orderClothColors" :key="index" style="margin-right: 10px; margin-bottom: 2.5px; margin-top: 2.5px">{{ item.clothColorName }}</el-tag>
-                        </el-descriptions-item>
-                        <el-descriptions-item>
-                            <template slot="label"> 瑕疵 </template>
-                            <el-tag size="small" v-for="(item, index) in form.orderClothFlaws" :key="index" style="margin-right: 10px; margin-bottom: 2.5px; margin-top: 2.5px">{{ item.clothFlawName }}</el-tag>
-                        </el-descriptions-item>
-                        <el-descriptions-item>
-                            <template slot="label"> 特殊处理 </template>
-                            <el-tag size="small" v-for="(item, index) in form.orderClothCrafts" :key="index" style="margin-right: 10px; margin-bottom: 2.5px; margin-top: 2.5px">{{ item.clothCraftName + '（￥' + item.price + '）' }}</el-tag>
-                        </el-descriptions-item>
-                        <el-descriptions-item
-                            >(item, index)
-                            <template slot="label"> 附件 </template>
-                            <el-tag size="small" v-for="(item, index) in form.orderClothAdjuncts" :key="index" style="margin-right: 10px; margin-bottom: 2.5px; margin-top: 2.5px">{{ item.adjunctName + '*' + item.num }}</el-tag>
-                        </el-descriptions-item>
-                        <el-descriptions-item>
-                            <template slot="label"> 挂衣号 </template>
-                        </el-descriptions-item>
-                        <el-descriptions-item>
-                            <template slot="label"> 预计取衣 </template>
-                        </el-descriptions-item>
-                        <el-descriptions-item>
-                            <template slot="label"> 衣服状态 </template>
-                            <dict-tag :options="dict.type.order_cloth_flow_status" :value="form.flowStatus" />
-                        </el-descriptions-item>
-                        <el-descriptions-item>
-                            <template slot="label"> 照片 </template>
-                            <template v-if="form.pics">
-                                <el-image v-for="(item, index) in form.pics.split(',')" :key="index" style="width: 100px; height: 100px; margin-right: 10px; margin-top: 2.5px; margin-bottom: 2.5px" :src="item" :preview-src-list="form.pics.split(',')"> </el-image>
-                            </template>
-                        </el-descriptions-item>
-                    </el-descriptions>
-                </el-col>
-                <el-col :span="24" style="margin-top: 10px">
-                    <el-table :data="flowRecords">
-                        <el-table-column label="操作" align="center">
-                            <template slot-scope="scope">
-                                <dict-tag :options="dict.type.order_cloth_flow_action" :value="scope.row.flowStatus" />
-                            </template>
-                        </el-table-column>
-                        <el-table-column label="时间" align="center" prop="createTime" />
-                        <el-table-column label="操作人" align="center" prop="operateName" />
-                        <el-table-column label="单位" align="center" prop="operateOrgName" />
-                    </el-table>
-                </el-col>
-            </el-row>
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="150">
+        <template slot-scope="scope">
+          <el-button type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">详情</el-button>
+          <el-button type="text" icon="el-icon-camera" @click="handphotograph(scope.row)">拍照</el-button>
+          <el-button type="text" icon="el-icon-printer" v-if="userInfoVO.userType != '00'" @click="btn_pointer_label(scope.row)">标签打印</el-button>
+        </template>
+      </el-table-column>
+    </Page>
 
-            <div slot="footer" class="dialog-footer">
-                <!--        <el-button type="primary" @click="submitForm" style="margin-left: 5%">提交</el-button>-->
-                <el-button @click="cancel" style="margin-left: 5%">关 闭</el-button>
-            </div>
-        </el-dialog>
+    <!-- 添加或修改洗衣订单衣服明细对话框 -->
+    <el-dialog :title="title" :visible.sync="open" size="50%" append-to-body>
+      <el-row :gutter="15" style="margin-bottom: 80px; margin-left: 20px; width: calc(100% - 20px)">
+        <el-col :span="24">
+          <el-descriptions class="margin-top" :column="2" border>
+            <el-descriptions-item>
+              <template slot="label"> 衣物条码 </template>
+              {{ form.washCode }}
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label"> 洗衣单号 </template>
+              {{ form.orderNo }}
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label"> 衣服名称 </template>
+              {{ form.clothItemName }}
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label"> 颜色 </template>
+              <el-tag size="small" v-for="(item, index) in form.orderClothColors" :key="index"
+                style="margin-right: 10px; margin-bottom: 2.5px; margin-top: 2.5px">{{ item.clothColorName }}</el-tag>
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label"> 瑕疵 </template>
+              <el-tag size="small" v-for="(item, index) in form.orderClothFlaws" :key="index"
+                style="margin-right: 10px; margin-bottom: 2.5px; margin-top: 2.5px">{{ item.clothFlawName }}</el-tag>
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label"> 特殊处理 </template>
+              <el-tag size="small" v-for="(item, index) in form.orderClothCrafts" :key="index"
+                style="margin-right: 10px; margin-bottom: 2.5px; margin-top: 2.5px">{{ item.clothCraftName + '（￥' + item.price + '）' }}</el-tag>
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label"> 附件 </template>
+              <el-tag size="small" v-for="(item, index) in form.orderClothAdjuncts" :key="index"
+                style="margin-right: 10px; margin-bottom: 2.5px; margin-top: 2.5px">{{ item.adjunctName + '*' + item.num }}</el-tag>
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label"> 挂衣号 </template>
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label"> 预计取衣 </template>
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label"> 衣服状态 </template>
+              <dict-tag :options="dict.type.order_cloth_flow_status" :value="form.flowStatus" />
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label"> 照片 </template>
+              <template v-if="form.pics">
+                <el-image v-for="(item, index) in form.pics.split(',')" :key="index"
+                  style="width: 100px; height: 100px; margin-right: 10px; margin-top: 2.5px; margin-bottom: 2.5px" :src="item"
+                  :preview-src-list="form.pics.split(',')"> </el-image>
+              </template>
+            </el-descriptions-item>
+          </el-descriptions>
+        </el-col>
+        <el-col :span="24" style="margin-top: 10px">
+          <el-table :data="flowRecords">
+            <el-table-column label="操作" align="center">
+              <template slot-scope="scope">
+                <dict-tag :options="dict.type.order_cloth_flow_action" :value="scope.row.flowStatus" />
+              </template>
+            </el-table-column>
+            <el-table-column label="时间" align="center" prop="createTime" />
+            <el-table-column label="操作人" align="center" prop="operateName" />
+            <el-table-column label="单位" align="center" prop="operateOrgName" />
+          </el-table>
+        </el-col>
+      </el-row>
 
-        <!-- 拍照上传 -->
-        <el-dialog title="拍照上传" :visible.sync="photographType" :before-close="hidephotograph" width="55%">
-            <div class="photo_content">
-                <div class="video_content">
-                    <div class="loading" v-if="videoType">
-                        <el-button type="text" :loading="true" disabled>加载中请稍后</el-button>
-                    </div>
-                    <video class="videoElement" ref="videoElement" autoplay></video>
-                </div>
+      <div slot="footer" class="dialog-footer">
+        <!--        <el-button type="primary" @click="submitForm" style="margin-left: 5%">提交</el-button>-->
+        <el-button @click="cancel" style="margin-left: 5%">关 闭</el-button>
+      </div>
+    </el-dialog>
 
-                <div class="view">
-                    <div class="btn_box">
-                        <el-button class="btn_photo" :loading="photoType" :disabled="photoType" icon="el-icon-camera" type="primary" plain @click="takePhoto" v-if="!videoType">拍照上传</el-button>
+    <!-- 拍照上传 -->
+    <el-dialog title="拍照上传" :visible.sync="photographType" :before-close="hidephotograph" width="55%">
+      <div class="photo_content">
+        <div class="video_content">
+          <div class="loading" v-if="videoType">
+            <el-button type="text" :loading="true" disabled>加载中请稍后</el-button>
+          </div>
+          <video class="videoElement" ref="videoElement" autoplay></video>
+        </div>
 
-                        <el-upload v-if="photographimgList.length < 9" class="btn_upload" :action="uploadAction" :before-upload="handleBeforeUpload" :on-success="handleUploadSuccess" :on-error="handleUploadError" accept="image/*" :show-file-list="false" ref="fileUpload">
-                            <el-button icon="el-icon-folder" plain type="primary">上传本地文件</el-button>
-                        </el-upload>
-                    </div>
+        <div class="view">
+          <div class="btn_box">
+            <el-button class="btn_photo" :loading="photoType" :disabled="photoType" icon="el-icon-camera" type="primary" plain @click="takePhoto"
+              v-if="!videoType">拍照上传</el-button>
 
-                    <div class="image_list" v-if="photographimgList.length">
-                        <div class="image_item" v-for="(item, index) in photographimgList" :key="index">
-                            <el-image style="width: 120px; height: 120px" :src="item.src ? item.src : item.url" :preview-src-list="previewimgList"> </el-image>
+            <el-upload v-if="photographimgList.length < 9" class="btn_upload" :action="uploadAction" :before-upload="handleBeforeUpload"
+              :on-success="handleUploadSuccess" :on-error="handleUploadError" accept="image/*" :show-file-list="false" ref="fileUpload">
+              <el-button icon="el-icon-folder" plain type="primary">上传本地文件</el-button>
+            </el-upload>
+          </div>
 
-                            <div class="image_bottom">
-                                <el-button type="danger" icon="el-icon-delete" @click="btn_remove(item, index)"></el-button>
-                                <el-button v-if="item.type" type="success" icon="el-icon-check"></el-button>
-                            </div>
-                        </div>
-                    </div>
+          <div class="image_list" v-if="photographimgList.length">
+            <div class="image_item" v-for="(item, index) in photographimgList" :key="index">
+              <el-image style="width: 120px; height: 120px" :src="item.src ? item.src : item.url" :preview-src-list="previewimgList"> </el-image>
 
-                    <el-empty :image-size="200" v-else></el-empty>
-                </div>
+              <div class="image_bottom">
+                <el-button type="danger" icon="el-icon-delete" @click="btn_remove(item, index)"></el-button>
+                <el-button v-if="item.type" type="success" icon="el-icon-check"></el-button>
+              </div>
             </div>
-            <span slot="footer" class="dialog-footer">
-                <el-button @click="hidephotograph">关 闭</el-button>
-                <el-button type="primary" @click="btn_submit">保 存</el-button>
-            </span>
-        </el-dialog>
-    </div>
+          </div>
+
+          <el-empty :image-size="200" v-else></el-empty>
+        </div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="hidephotograph">关 闭</el-button>
+        <el-button type="primary" @click="btn_submit">保 存</el-button>
+      </span>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
@@ -197,447 +218,443 @@ import { uploadBase64OSS, uploadOSS, saveOrderClothPics } from '@/api/upload'
 import { getLodop } from '@/utils/lodopUtils'
 
 export default {
-    name: 'ClothItem',
-    dicts: ['sys_yes_no', 'order_cloth_flow_status', 'order_cloth_flow_action'],
-    data() {
-        return {
-            uploadAction: `${process.env.VUE_APP_BASE_API}` + '/common/uploadOSS',
-            // 遮罩层
-            loading: true,
-            // 选中数组
-            ids: [],
-            // 非单个禁用
-            single: true,
-            // 非多个禁用
-            multiple: true,
-            // 显示搜索条件
-            showSearch: true,
-            // 总条数
-            total: 0,
-            // 洗衣订单衣服明细表格数据
-            clothItemList: [],
-            // 弹出层标题
-            title: '',
-            // 是否显示弹出层
-            open: false,
-            // 查询参数
-            queryParams: {
-                pageNum: 1,
-                pageSize: 10,
-                clothItemName: null,
-                washCode: null,
-                clothHangerId: null
-            },
-            createTimeRange: [],
-            takeClothTimeRange: [],
-            // 表单参数
-            form: {},
-            flowRecords: [],
-            // 表单校验
-            rules: {},
-            photographType: false,
-            photographimgList: [],
-            previewimgList: [],
-            uploadList: [],
-            photoLoading: true,
-            clothId: null,
-            stream: null,
-            fileType: ['png', 'jpg', 'jpeg'],
-            number: 0,
-            videoType: true,
-            photoType: false,
+  name: 'ClothItem',
+  dicts: ['sys_yes_no', 'order_cloth_flow_status', 'order_cloth_flow_action'],
+  data() {
+    return {
+      uploadAction: `${process.env.VUE_APP_BASE_API}` + '/common/uploadOSS',
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 洗衣订单衣服明细表格数据
+      clothItemList: [],
+      // 弹出层标题
+      title: '',
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        clothItemName: null,
+        washCode: null,
+        clothHangerId: null
+      },
+      createTimeRange: [],
+      takeClothTimeRange: [],
+      // 表单参数
+      form: {},
+      flowRecords: [],
+      // 表单校验
+      rules: {},
+      photographType: false,
+      photographimgList: [],
+      previewimgList: [],
+      uploadList: [],
+      photoLoading: true,
+      clothId: null,
+      stream: null,
+      fileType: ['png', 'jpg', 'jpeg'],
+      number: 0,
+      videoType: true,
+      photoType: false,
 
-            LODOP: null,
-            number: 1,
-            pointerList: [],
+      LODOP: null,
+      number: 1,
+      pointerList: [],
 
-            userInfoVO: null
+      userInfoVO: null
+    }
+  },
+  created() {
+    this.userInfoVO = this.getUserInfo()
+    this.getList()
+  },
+  mounted() {
+    this.number = 1
+    const printerTime = setInterval(() => {
+      this.LODOP = getLodop()
+      this.number++
+      if (this.number == 25) {
+        clearInterval(printerTime)
+      }
+      if (this.LODOP) {
+        clearInterval(printerTime)
+      }
+    }, 200)
+
+    this.pointerList = JSON.parse(this.$cache.local.get('printerSeting'))
+  },
+  methods: {
+    // 上传前校检格式和大小
+    handleBeforeUpload(file) {
+      console.log(file)
+      // 校检文件类型
+      if (this.fileType) {
+        const fileName = file.name.split('.')
+        const fileExt = fileName[fileName.length - 1]
+        const isTypeOk = this.fileType.indexOf(fileExt) >= 0
+        if (!isTypeOk) {
+          this.$modal.msgError(`文件格式不正确, 请上传${this.fileType.join('/')}格式文件!`)
+          return false
         }
+      }
+      // 校检文件大小
+      const isLt = file.size / 1024 / 1024 < 3
+      if (!isLt) {
+        this.$message.error(`上传文件大小不能超过 3MB!`)
+        return false
+      }
+      this.$modal.loading('正在上传文件，请稍候...')
+      // this.number++;
+      return true
     },
-    created() {
-        this.userInfoVO = this.getUserInfo()
-        this.getList()
+    handleUploadSuccess(res, file) {
+      if (res.code === 200) {
+        this.previewimgList.push(res.data.src)
+        this.uploadList.push({ name: res.data.fileName, url: res.data.src })
+        this.uploadedSuccessfully()
+      } else {
+        // this.number--;
+        this.$modal.closeLoading()
+        this.$modal.msgError(res.msg)
+        this.$refs.fileUpload.handleRemove(file)
+        this.uploadedSuccessfully()
+      }
     },
-    mounted() {
-        this.number = 1
-        const printerTime = setInterval(() => {
-            this.LODOP = getLodop()
-            this.number++
-            if (this.number == 25) {
-                clearInterval(printerTime)
-            }
-            if (this.LODOP) {
-                clearInterval(printerTime)
-            }
-        }, 200)
-
-        this.pointerList = JSON.parse(this.$cache.local.get('printerSeting'))
+    handleUploadError() {
+      this.$modal.msgError('上传文件失败，请重试')
+      this.$modal.closeLoading()
     },
-    methods: {
-        // 上传前校检格式和大小
-        handleBeforeUpload(file) {
-            console.log(file)
-            // 校检文件类型
-            if (this.fileType) {
-                const fileName = file.name.split('.')
-                const fileExt = fileName[fileName.length - 1]
-                const isTypeOk = this.fileType.indexOf(fileExt) >= 0
-                if (!isTypeOk) {
-                    this.$modal.msgError(`文件格式不正确, 请上传${this.fileType.join('/')}格式文件!`)
-                    return false
-                }
-            }
-            // 校检文件大小
-            const isLt = file.size / 1024 / 1024 < 3
-            if (!isLt) {
-                this.$message.error(`上传文件大小不能超过 3MB!`)
-                return false
-            }
-            this.$modal.loading('正在上传文件，请稍候...')
-            // this.number++;
-            return true
-        },
-        handleUploadSuccess(res, file) {
-            if (res.code === 200) {
-                this.previewimgList.push(res.data.src)
-                this.uploadList.push({ name: res.data.fileName, url: res.data.src })
-                this.uploadedSuccessfully()
-            } else {
-                // this.number--;
-                this.$modal.closeLoading()
-                this.$modal.msgError(res.msg)
-                this.$refs.fileUpload.handleRemove(file)
-                this.uploadedSuccessfully()
-            }
-        },
-        handleUploadError() {
-            this.$modal.msgError('上传文件失败，请重试')
-            this.$modal.closeLoading()
-        },
-        // 上传结束处理
-        uploadedSuccessfully() {
-            if (this.uploadList.length) {
-                // this.fileList = this.fileList.concat(this.uploadList);
-                this.uploadList.forEach((item) => {
-                    this.photographimgList.push({
-                        src: item.url,
-                        fileName: item.fileName,
-                        type: true
-                    })
-                })
-                this.uploadList = []
-                // this.number = 0;
-                this.$modal.closeLoading()
+    // 上传结束处理
+    uploadedSuccessfully() {
+      if (this.uploadList.length) {
+        // this.fileList = this.fileList.concat(this.uploadList);
+        this.uploadList.forEach((item) => {
+          this.photographimgList.push({
+            src: item.url,
+            fileName: item.fileName,
+            type: true
+          })
+        })
+        this.uploadList = []
+        // this.number = 0;
+        this.$modal.closeLoading()
 
-                this.getuploadState()
-            }
-        },
-        //根据上传文件状态判断显示
-        getuploadState() {
-            // 初始状态值
-            let state = true
+        this.getuploadState()
+      }
+    },
+    //根据上传文件状态判断显示
+    getuploadState() {
+      // 初始状态值
+      let state = true
 
-            // 判断数组中的所有元素是否都为true
-            if (this.photographimgList.every((item) => item.type === true)) {
-                state = false
-            } else {
-                state = true
-            }
+      // 判断数组中的所有元素是否都为true
+      if (this.photographimgList.every((item) => item.type === true)) {
+        state = false
+      } else {
+        state = true
+      }
 
-            return state
-        },
-        /** 查询洗衣订单衣服明细列表 */
-        getList() {
-            this.loading = true
-            if (null != this.createTimeRange && '' != this.createTimeRange) {
-                this.queryParams['beginCreateTime'] = this.createTimeRange[0]
-                this.queryParams['endCreateTime'] = this.createTimeRange[1]
-            } else {
-                delete this.queryParams.beginCreateTime
-                delete this.queryParams.endCreateTime
-            }
-            if (null != this.takeClothTimeRange && '' != this.takeClothTimeRange) {
-                this.queryParams['beginTakeClothTime'] = this.takeClothTimeRange[0]
-                this.queryParams['endTakeClothTime'] = this.takeClothTimeRange[1]
-            } else {
-                delete this.queryParams.beginTakeClothTime
-                delete this.queryParams.endTakeClothTime
-            }
-            listOrderClothItem(this.queryParams).then((response) => {
-                this.clothItemList = response.data.records
-                this.total = response.data.total
-                this.loading = false
-            })
-        },
-        // 取消按钮
-        cancel() {
-            this.open = false
-            this.reset()
-        },
-        // 表单重置
-        reset() {
-            this.form = {
-                id: null,
-                orderId: null,
-                clothItemId: null,
-                clothItemName: null,
-                clothSpeedId: null,
-                clothSpeedName: null,
-                clothMultiple: null,
-                clothWashDayNum: null,
-                price: null,
-                clothNum: null,
-                clothWashModeId: null,
-                clothWashModeName: null,
-                pics: null,
-                washCode: null,
-                clothHangerId: null,
-                isHedging: null,
-                hedgingPrice: null,
-                createById: null,
-                createBy: null,
-                createTime: null,
-                updateById: null,
-                updateBy: null,
-                updateTime: null,
-                remark: null
-            }
-            this.resetForm('form')
-        },
-        /** 搜索按钮操作 */
-        handleQuery() {
-            this.queryParams.pageNum = 1
-            this.getList()
-        },
-        /** 重置按钮操作 */
-        resetQuery() {
-            this.resetForm('queryForm')
-            this.handleQuery()
-        },
-        // 多选框选中数据
-        handleSelectionChange(selection) {
-            this.ids = selection.map((item) => item.id)
-            this.single = selection.length !== 1
-            this.multiple = !selection.length
-        },
-        /** 新增按钮操作 */
-        handleAdd() {
-            this.reset()
-            this.open = true
-            this.title = '添加洗衣订单衣服明细'
-        },
-        /** 修改按钮操作 */
-        handleUpdate(row) {
-            this.reset()
-            this.flowRecords = []
-            const id = row.id || this.ids
-            getClothItem(id).then((response) => {
-                this.form = response.data
-                this.open = true
-                this.title = '衣物详情'
-                listOrderClothFlowRecordByOrderClothId({ orderClothId: id }).then((res) => {
-                    this.flowRecords = res.data
-                })
+      return state
+    },
+    /** 查询洗衣订单衣服明细列表 */
+    getList() {
+      this.loading = true
+      if (null != this.createTimeRange && '' != this.createTimeRange) {
+        this.queryParams['beginCreateTime'] = this.createTimeRange[0]
+        this.queryParams['endCreateTime'] = this.createTimeRange[1]
+      } else {
+        delete this.queryParams.beginCreateTime
+        delete this.queryParams.endCreateTime
+      }
+      if (null != this.takeClothTimeRange && '' != this.takeClothTimeRange) {
+        this.queryParams['beginTakeClothTime'] = this.takeClothTimeRange[0]
+        this.queryParams['endTakeClothTime'] = this.takeClothTimeRange[1]
+      } else {
+        delete this.queryParams.beginTakeClothTime
+        delete this.queryParams.endTakeClothTime
+      }
+      this.$nextTick(() => {
+        this.$refs.pagination.handleSearch(true)
+      })
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false
+      this.reset()
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        orderId: null,
+        clothItemId: null,
+        clothItemName: null,
+        clothSpeedId: null,
+        clothSpeedName: null,
+        clothMultiple: null,
+        clothWashDayNum: null,
+        price: null,
+        clothNum: null,
+        clothWashModeId: null,
+        clothWashModeName: null,
+        pics: null,
+        washCode: null,
+        clothHangerId: null,
+        isHedging: null,
+        hedgingPrice: null,
+        createById: null,
+        createBy: null,
+        createTime: null,
+        updateById: null,
+        updateBy: null,
+        updateTime: null,
+        remark: null
+      }
+      this.resetForm('form')
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1
+      this.getList()
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm('queryForm')
+      this.handleQuery()
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map((item) => item.id)
+      this.single = selection.length !== 1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset()
+      this.open = true
+      this.title = '添加洗衣订单衣服明细'
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset()
+      this.flowRecords = []
+      const id = row.id || this.ids
+      getClothItem(id).then((response) => {
+        this.form = response.data
+        this.open = true
+        this.title = '衣物详情'
+        listOrderClothFlowRecordByOrderClothId({ orderClothId: id }).then((res) => {
+          this.flowRecords = res.data
+        })
+      })
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs['form'].validate((valid) => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateClothItem(this.form).then((response) => {
+              this.$modal.msgSuccess('修改成功')
+              this.open = false
+              this.getList()
             })
-        },
-        /** 提交按钮 */
-        submitForm() {
-            this.$refs['form'].validate((valid) => {
-                if (valid) {
-                    if (this.form.id != null) {
-                        updateClothItem(this.form).then((response) => {
-                            this.$modal.msgSuccess('修改成功')
-                            this.open = false
-                            this.getList()
-                        })
-                    } else {
-                        addClothItem(this.form).then((response) => {
-                            this.$modal.msgSuccess('新增成功')
-                            this.open = false
-                            this.getList()
-                        })
-                    }
-                }
+          } else {
+            addClothItem(this.form).then((response) => {
+              this.$modal.msgSuccess('新增成功')
+              this.open = false
+              this.getList()
             })
+          }
+        }
+      })
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids
+      this.$modal
+        .confirm('是否确认删除洗衣订单衣服明细编号为"' + ids + '"的数据项？')
+        .then(function () {
+          return delClothItem(ids)
+        })
+        .then(() => {
+          this.getList()
+          this.$modal.msgSuccess('删除成功')
+        })
+        .catch(() => { })
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download(
+        'mapi/order/clothItem/export',
+        {
+          ...this.queryParams
         },
-        /** 删除按钮操作 */
-        handleDelete(row) {
-            const ids = row.id || this.ids
-            this.$modal
-                .confirm('是否确认删除洗衣订单衣服明细编号为"' + ids + '"的数据项？')
-                .then(function () {
-                    return delClothItem(ids)
-                })
-                .then(() => {
-                    this.getList()
-                    this.$modal.msgSuccess('删除成功')
-                })
-                .catch(() => {})
-        },
-        /** 导出按钮操作 */
-        handleExport() {
-            this.download(
-                'mapi/order/clothItem/export',
-                {
-                    ...this.queryParams
-                },
-                `clothItem_${new Date().getTime()}.xlsx`
-            )
-        },
-        checkClose(done) {
-            this.$confirm('是否关闭表单，关闭后数据将丢失？')
-                .then(function () {
-                    done()
-                })
-                .then(() => {})
-                .catch(() => {})
-        },
-
-        //打开拍照弹框 调用摄像头
-        async handphotograph(row) {
-            let objform = Object.assign({}, row)
-            this.clothId = objform.id
+        `clothItem_${new Date().getTime()}.xlsx`
+      )
+    },
+    checkClose(done) {
+      this.$confirm('是否关闭表单，关闭后数据将丢失？')
+        .then(function () {
+          done()
+        })
+        .then(() => { })
+        .catch(() => { })
+    },
 
-            if (objform.pics) {
-                let imgList = objform.pics.split(',')
-                imgList.forEach((item) => {
-                    this.previewimgList.push(item)
-                    this.photographimgList.push({
-                        type: true,
-                        src: item
-                    })
-                })
-            }
+    //打开拍照弹框 调用摄像头
+    async handphotograph(row) {
+      let objform = Object.assign({}, row)
+      this.clothId = objform.id
 
-            this.photographType = true
-            try {
-                this.stream = await navigator.mediaDevices.getUserMedia({ video: true })
-                this.$refs.videoElement.srcObject = this.stream
-                this.videoType = false
-            } catch (error) {
-                this.$modal.msgError('无法访问摄像头')
-                // console.error("无法访问摄像头:", error);
-                // this.photographType = false
-            }
-        },
-        //点击拍照 处理成base64
-        async takePhoto() {
-            this.photoType = true
-            try {
-                const canvas = document.createElement('canvas')
-                const context = canvas.getContext('2d')
-                canvas.width = this.$refs.videoElement.videoWidth
-                canvas.height = this.$refs.videoElement.videoHeight
-                context.drawImage(this.$refs.videoElement, 0, 0, canvas.width, canvas.height)
-                const imageDataUrl = canvas.toDataURL('image/jpeg')
-                if (this.photographimgList.length >= 9) {
-                    this.$modal.msgError('照片仅限上传9张')
-                    this.photoType = false
-                    return
-                }
+      if (objform.pics) {
+        let imgList = objform.pics.split(',')
+        imgList.forEach((item) => {
+          this.previewimgList.push(item)
+          this.photographimgList.push({
+            type: true,
+            src: item
+          })
+        })
+      }
 
-                let response = await fetch(imageDataUrl)
-                let blob = await response.blob() // 获取图片的 Blob 对象
-                let file = new File([blob], 'image.jpeg', { type: blob.type })
-                //创建form对象
-                let formdata = new FormData()
-                //通过append向form对象添加数据
-                formdata.append('file', file)
+      this.photographType = true
+      try {
+        this.stream = await navigator.mediaDevices.getUserMedia({ video: true })
+        this.$refs.videoElement.srcObject = this.stream
+        this.videoType = false
+      } catch (error) {
+        this.$modal.msgError('无法访问摄像头')
+        // console.error("无法访问摄像头:", error);
+        // this.photographType = false
+      }
+    },
+    //点击拍照 处理成base64
+    async takePhoto() {
+      this.photoType = true
+      try {
+        const canvas = document.createElement('canvas')
+        const context = canvas.getContext('2d')
+        canvas.width = this.$refs.videoElement.videoWidth
+        canvas.height = this.$refs.videoElement.videoHeight
+        context.drawImage(this.$refs.videoElement, 0, 0, canvas.width, canvas.height)
+        const imageDataUrl = canvas.toDataURL('image/jpeg')
+        if (this.photographimgList.length >= 9) {
+          this.$modal.msgError('照片仅限上传9张')
+          this.photoType = false
+          return
+        }
 
-                uploadOSS(formdata)
-                    .then((res) => {
-                        this.previewimgList.push(res.data.src)
-                        this.photographimgList.push({
-                            type: true,
-                            src: res.data.src
-                        })
-                        this.photoType = false
-                    })
-                    .catch(() => {
-                        // resolve(false);
-                        this.photoType = false
-                    })
+        let response = await fetch(imageDataUrl)
+        let blob = await response.blob() // 获取图片的 Blob 对象
+        let file = new File([blob], 'image.jpeg', { type: blob.type })
+        //创建form对象
+        let formdata = new FormData()
+        //通过append向form对象添加数据
+        formdata.append('file', file)
 
-                // 上传照片或处理imageDataUrl
-                // this.uploadImage(imageDataUrl); // 调用上传接口或本地处理逻辑
-            } catch (error) {
-                this.photoType = false
-                // console.error("拍照失败:", error);
-            } finally {
-                // this.$refs.videoElement.srcObject.getTracks().forEach((track) => track.stop());
-            }
-        },
-        // 关闭拍照弹框后清除视频流
-        hidephotograph() {
-            const that = this
-            this.$confirm('是否确认关闭当前拍照功能？', '提示', {
-                confirmButtonText: '确定',
-                cancelButtonText: '取消',
-                type: 'warning'
+        uploadOSS(formdata)
+          .then((res) => {
+            this.previewimgList.push(res.data.src)
+            this.photographimgList.push({
+              type: true,
+              src: res.data.src
             })
-                .then(() => {
-                    that.photographType = false
-                    that.photographimgList = []
-                    that.clothId = null
-                    if (that.stream) {
-                        that.stream.getTracks().forEach((track) => track.stop()) // 停止访问摄像头并释放资源
-                        that.$refs.videoElement.srcObject = null // 清除视频流对象
-                    }
-                })
-                .catch(() => {})
-        },
-        //删除照片
-        btn_remove(item, index) {
-            const that = this
-            this.$confirm('是否确认删除该照片？')
-                .then(function () {})
-                .then(() => {
-                    that.photographimgList.splice(index, 1)
-                    that.$modal.msgSuccess('删除成功')
-                })
-                .catch(() => {})
-        },
-        //保存图片
-        btn_submit() {
-            let _type = false
+            this.photoType = false
+          })
+          .catch(() => {
+            // resolve(false);
+            this.photoType = false
+          })
 
-            if (this.photographimgList.length < 1) {
-                this.$modal.msgError('请拍照上传后保存')
-                return
-            }
+        // 上传照片或处理imageDataUrl
+        // this.uploadImage(imageDataUrl); // 调用上传接口或本地处理逻辑
+      } catch (error) {
+        this.photoType = false
+        // console.error("拍照失败:", error);
+      } finally {
+        // this.$refs.videoElement.srcObject.getTracks().forEach((track) => track.stop());
+      }
+    },
+    // 关闭拍照弹框后清除视频流
+    hidephotograph() {
+      const that = this
+      this.$confirm('是否确认关闭当前拍照功能？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          that.photographType = false
+          that.photographimgList = []
+          that.clothId = null
+          if (that.stream) {
+            that.stream.getTracks().forEach((track) => track.stop()) // 停止访问摄像头并释放资源
+            that.$refs.videoElement.srcObject = null // 清除视频流对象
+          }
+        })
+        .catch(() => { })
+    },
+    //删除照片
+    btn_remove(item, index) {
+      const that = this
+      this.$confirm('是否确认删除该照片？')
+        .then(function () { })
+        .then(() => {
+          that.photographimgList.splice(index, 1)
+          that.$modal.msgSuccess('删除成功')
+        })
+        .catch(() => { })
+    },
+    //保存图片
+    btn_submit() {
+      let _type = false
 
-            const srcString = this.photographimgList.map((obj) => obj.src).join(',')
-            saveOrderClothPics({
-                id: this.clothId,
-                pics: srcString
-            }).then((response) => {
-                this.$modal.msgSuccess('保存图片成功')
+      if (this.photographimgList.length < 1) {
+        this.$modal.msgError('请拍照上传后保存')
+        return
+      }
 
-                this.photographType = false
-                this.photographimgList = []
-                this.clothId = null
-                this.getList()
-                if (this.stream) {
-                    this.stream.getTracks().forEach((track) => track.stop()) // 停止访问摄像头并释放资源
-                    this.$refs.videoElement.srcObject = null // 清除视频流对象
-                }
-            })
-        },
-        //标签打印
-        btn_pointer_label(row) {
-            if (!this.LODOP) {
-                this.$modal.msgError('请安装打印机软件')
-                return
-            }
-            let p_name = ''
-            this.pointerList.forEach((pointer) => {
-                if (pointer.printType == 2) {
-                    p_name = pointer.printName
-                }
-            })
-            this.labelPrinter(this.LODOP, row, p_name)
+      const srcString = this.photographimgList.map((obj) => obj.src).join(',')
+      saveOrderClothPics({
+        id: this.clothId,
+        pics: srcString
+      }).then((response) => {
+        this.$modal.msgSuccess('保存图片成功')
+
+        this.photographType = false
+        this.photographimgList = []
+        this.clothId = null
+        this.getList()
+        if (this.stream) {
+          this.stream.getTracks().forEach((track) => track.stop()) // 停止访问摄像头并释放资源
+          this.$refs.videoElement.srcObject = null // 清除视频流对象
+        }
+      })
+    },
+    //标签打印
+    btn_pointer_label(row) {
+      if (!this.LODOP) {
+        this.$modal.msgError('请安装打印机软件')
+        return
+      }
+      let p_name = ''
+      this.pointerList.forEach((pointer) => {
+        if (pointer.printType == 2) {
+          p_name = pointer.printName
         }
+      })
+      this.labelPrinter(this.LODOP, row, p_name)
     }
+  }
 }
 </script>
 <style scoped lang="scss">