table固定列，适配小屏幕

src/views/food/index.vue

@@ -34,7 +34,12 @@
       highlight-current-row
       style="width: 100%;"
     >
-      <el-table-column type="index" label="序号" align="center" width="60px" />
+      <el-table-column type="index" label="序号" align="center" fixed width="60px" />
+      <el-table-column label="名称" align="center" fixed width="200px">
+        <template slot-scope="{row}">
+          <span>{{ row.name }}</span>
+        </template>
+      </el-table-column>
       <el-table-column label="图片" align="center" width="180">
         <template slot-scope="{row}">
           <el-image
@@ -50,11 +55,6 @@
           <span>{{ row.id2 }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="名称" align="center" width="200px">
-        <template slot-scope="{row}">
-          <span>{{ row.name }}</span>
-        </template>
-      </el-table-column>
       <el-table-column label="描述" align="center" width="200">
         <template slot-scope="{row}">
           <span>{{ row.description }}</span>
@@ -80,7 +80,7 @@
           <span>{{ row.updateTime }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="操作" align="center" class-name="small-padding">
+      <el-table-column label="操作" align="center" class-name="small-padding" fixed="right" width="460">
         <template slot-scope="{row,$index}">
           <el-button type="primary" size="mini" @click="handleUpdate(row)">
             更新

src/views/food/nutrient.vue

@@ -96,7 +96,7 @@
           <span v-else>{{ row.nvSpecUnit }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="320">
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="320" fixed="right">
         <template slot-scope="{row}">
           <template v-if="row.edit">
             <el-button

src/views/foodModifier/index.vue

@@ -21,8 +21,8 @@
       highlight-current-row
       style="width: 100%;"
     >
-      <el-table-column type="index" label="序号" align="center" width="60px" />
-      <el-table-column label="规格名称" align="center">
+      <el-table-column type="index" label="序号" align="center" fixed width="60px" />
+      <el-table-column label="规格名称" fixed align="center">
         <template slot-scope="{row}">
           <span>{{ row.name }}</span>
         </template>
@@ -62,7 +62,7 @@
           <span>{{ row.updateTime }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="操作" align="center" class-name="small-padding" width="320">
+      <el-table-column label="操作" align="center" class-name="small-padding" fixed="right" width="320">
         <template slot-scope="{row}">
           <el-button type="primary" size="mini" @click="handleUpdate(row)">
             更新

src/views/nutrient/index.vue

@@ -31,7 +31,12 @@
       fit
       highlight-current-row
     >
-      <el-table-column type="index" label="序号" align="center" width="60" />
+      <el-table-column type="index" label="序号" align="center" fixed width="60" />
+      <el-table-column label="名称" align="center" fixed width="250">
+        <template slot-scope="{row}">
+          <span>{{ row.name }}</span>
+        </template>
+      </el-table-column>
       <el-table-column label="图片" align="center" width="180">
         <template slot-scope="{row}">
           <el-image v-if="row.coverPic" style="width: 150px; height: 180px" :src="row.coverPic" fit="contain" />
@@ -42,11 +47,6 @@
           <span>{{ row.id2 }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="名称" align="center" width="150">
-        <template slot-scope="{row}">
-          <span>{{ row.name }}</span>
-        </template>
-      </el-table-column>
       <el-table-column label="英文名称" align="center" width="150">
         <template slot-scope="{row}">
           <span>{{ row.enName }}</span>
@@ -92,7 +92,7 @@
           <span>{{ row.updateTime }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="操作" align="center" width="480">
+      <el-table-column label="操作" align="center" fixed="right" width="480">
         <template slot-scope="{row}">
           <el-button type="primary" size="mini" @click="handleCreateOrUpdate('update', row)">
             更新

src/views/nutrientTemplate/detail.vue

@@ -96,7 +96,7 @@
             <span v-else>{{ row.nvSpecUnit }}</span>
           </template>
         </el-table-column>
-        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="320px">
+        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="320px">
           <template slot-scope="{row}">
             <template v-if="row.edit">
               <el-button

src/views/nutrientTemplate/index.vue

@@ -31,8 +31,8 @@
       fit
       highlight-current-row
     >
-      <el-table-column type="index" label="序号" align="center" width="60" />
-      <el-table-column label="名称" align="center" width="150">
+      <el-table-column type="index" label="序号" align="center" fixed width="60" />
+      <el-table-column label="名称" align="center" fixed width="150">
         <template slot-scope="{row}">
           <span>{{ row.name }}</span>
         </template>
@@ -57,7 +57,7 @@
           <span>{{ row.updateTime }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="操作" align="center">
+      <el-table-column label="操作" align="center" fixed="right" width="560">
         <template slot-scope="{row}">
           <el-button type="primary" size="mini" :disabled="!canUpdate(row.userId)" @click="handleCreateOrUpdate('update', row)">
             更新

src/views/recipe/index.vue

@@ -31,20 +31,20 @@
       highlight-current-row
       style="width: 100%;"
     >
-      <el-table-column type="index" label="序号" align="center" width="60px" />
-      <el-table-column label="自定义ID" align="center" width="80px">
+      <el-table-column type="index" label="序号" align="center" fixed width="60px" />
+      <el-table-column label="名称" fixed align="center">
         <template slot-scope="{row}">
-          <span>{{ row.id2 }}</span>
+          <span>{{ row.name }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="食谱封面图" align="center" width="200px">
+      <el-table-column label="自定义ID" align="center" fixed width="80px">
         <template slot-scope="{row}">
-          <el-image style="width: 180px; height: 100px" :src="row.coverPic" fit="contain" />
+          <span>{{ row.id2 }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="名称" align="center">
+      <el-table-column label="食谱封面图" align="center" width="200px">
         <template slot-scope="{row}">
-          <span>{{ row.name }}</span>
+          <el-image style="width: 180px; height: 100px" :src="row.coverPic" fit="contain" />
         </template>
       </el-table-column>
       <el-table-column label="描述" align="center">
@@ -62,7 +62,7 @@
           <span>{{ row.updateTime }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="操作" align="center" class-name="small-padding">
+      <el-table-column label="操作" align="center" class-name="small-padding" fixed="right" width="360">
         <template slot-scope="{row,$index}">
           <el-button type="primary" size="mini" @click="handleCreateOrUpdate('edit', row)">
             更新

src/views/unit/index.vue

@@ -27,12 +27,12 @@
       highlight-current-row
       style="width: 100%;"
     >
-      <el-table-column label="自定义ID" align="center" width="100">
+      <el-table-column label="自定义ID" align="center" fixed width="100">
         <template slot-scope="{row}">
           <span>{{ row.id2 }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="名称" align="center" width="200">
+      <el-table-column label="名称" align="center" fixed width="200">
         <template slot-scope="{row}">
           <span>{{ row.name }}</span>
         </template>
@@ -77,7 +77,7 @@
           <span>{{ row.stepScale }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="400">
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="400">
         <template slot-scope="{row}">
           <el-button type="primary" size="mini" @click="handleCreateOrUpdate('UPDATE', row)">
             更新

src/views/user/index.vue

@@ -30,13 +30,13 @@
       highlight-current-row
       style="width: 100%;"
     >
-      <el-table-column type="index" label="序号" align="center" width="60" />
-      <el-table-column label="工号" align="center">
+      <el-table-column type="index" label="序号" align="center" fixed width="60" />
+      <el-table-column label="工号" fixed align="center">
         <template slot-scope="{row}">
           <span>{{ row.name }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="昵称" align="center">
+      <el-table-column label="昵称" fixed align="center">
         <template slot-scope="{row}">
           <span>{{ row.nickName }}</span>
         </template>
@@ -61,7 +61,7 @@
           <span>{{ row.createTime }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="280">
         <template slot-scope="{row,$index}">
           <el-button type="primary" size="mini" @click="handleUpdate(row)">
             更新