feat:优化

src/views/goods/infoSet.vue

@@ -18,19 +18,19 @@
 
     <el-card class="detail-card">
       <div class="detail">
-        <div class="desc">
-          <div class="detail_title" style="min-width: 80px; text-align: end">钱币名称：</div>
-          <div class="detail_title">{{ goodsParams.name }}</div>
-        </div>
-        <div class="desc">
-          <div class="detail_desc-content" style="min-width: 80px; text-align: end">钱币价格：</div>
-          <div class="detail_desc-content">{{ `¥${goodsParams.price || '0'}` }}</div>
-        </div>
-
-        <div class="desc">
-          <div class="detail_desc-content" style="min-width: 80px">详细介绍：</div>
-          <div class="detail_desc-content">{{ goodsParams.detail | trimHtml }}</div>
-        </div>
+        <el-form ref="goods" :rules="rules" :model="goodsParams" label-width="150px">
+          <el-form-item label="钱币名称：" prop="name" require>
+            <el-input v-model="goodsParams.name" autofoucs/>
+          </el-form-item>
+          <el-form-item label="钱币价格：" prop="price">
+            <el-input v-model="goodsParams.price" placeholder="请输入钱币价格">
+              <template slot="append">元</template>
+            </el-input>
+          </el-form-item>
+          <el-form-item label="详细介绍：" prop="detail">
+            <el-input v-model="goodsParams.detail" :rows="5" type="textarea" placeholder="请输入钱币描述"/>
+          </el-form-item>
+        </el-form>
 
         <div class="detail_image">
           <div class="detail_title">{{ `钱币图片：` }}</div>
@@ -251,7 +251,12 @@ export default {
       imageType: 0, // 1正面 2反面
       cutEditImageDialogVisible: false, // 钱币图片编辑
       editImageUrl: '', // 用于处理是否合成或者替换原图,
-      imageMainPosition: -1 // 用于设置主图位置
+      imageMainPosition: -1, // 用于设置主图位置
+      rules: {
+        name: [
+          { required: true, message: '请输入标题', trigger: 'blur' }
+        ]
+      }
     }
   },
   computed: {
@@ -709,9 +714,15 @@ export default {
     flex-direction: row;
 
     .detail_title {
-      width: 100px;
-      font-weight: normal;
-      margin-top: 15px;
+      width: 150px;
+      text-align: right;
+      vertical-align: middle;
+      float: left;
+      font-size: 14px;
+      color: #606266;
+      line-height: 40px;
+      padding: 0 12px 0 0;
+      box-sizing: border-box;
     }
 
     .list {

src/views/goods/list.vue

@@ -4,6 +4,13 @@
     <!-- 查询和其他操作 -->
     <div class="filter-container">
       <el-input v-model="listQuery.name" clearable size="mini" class="filter-item" style="width: 200px;" placeholder="请输入商品名称"/>
+      <el-select v-model="listQuery.state" placeholder="请选择" size="mini" class="filter-item">
+        <el-option
+          v-for="item in options"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"/>
+      </el-select>
       <el-button size="mini" class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">查找</el-button>
       <el-button size="mini" class="filter-item" type="primary" icon="el-icon-edit" @click="handleCreate">添加</el-button>
       <el-button :loading="downloadLoading" size="mini" class="filter-item" type="warning" icon="el-icon-download" @click="handleDownload">导出</el-button>
@@ -130,6 +137,7 @@ export default {
         page: 1,
         limit: 20,
         name: undefined,
+        state: undefined,
         sort: 'update_time',
         order: 'desc'
       },
@@ -137,7 +145,20 @@ export default {
       detailDialogVisible: false,
       downloadLoading: false,
       imageUrl: '',
-      showLargeDialog: false
+      showLargeDialog: false,
+      options: [{
+        value: '0',
+        label: '待处理'
+      }, {
+        value: '1',
+        label: '暂不处理'
+      }, {
+        value: '9',
+        label: '已删除'
+      }, {
+        value: '10',
+        label: '已完成'
+      }]
     }
   },
   created() {